xiamen-sb-uniapp/pages/fill/detail.vue

<template>
    <view class="container">
        <view class="mx3 my2 p3 bg-color-white" style="border-radius: 16rpx">
            <view class="f-size-32 f-weight-6 py2 mb-2 title">基本信息</view>
            <detail-list-item title="设备名称">{{ model.sbName }}</detail-list-item>
            <detail-list-item title="设备编号">{{ model.sbNo }}</detail-list-item>
            <detail-list-item title="日期">{{ model.fillDate }}</detail-list-item>
            <template v-for="natureDict in natureList" >
                <view
                    v-show="natureDict.show"
                    :key="natureDict.id"
                    class="f-size-32 f-weight-6 py2 mb-2 title">{{ natureDict.label }}</view>
                <view v-show="natureDict.show" v-for="fillInfo in fillInfoList" v-if="fillInfo.nature === natureDict.value">
                    <view :key="fillInfo.infoId" v-if="fillInfo.type === fillInfoTypeMap.FILL_INFO_TYPE_PROJECT_QUANTITY">
                        <detail-list-item
                            title="作业名称"
                        >
                            {{ getProjectQuantityValue(fillInfo) }}
                        </detail-list-item>

                        <detail-list-item
                            title="作业位置">
                            {{ getProjectQuantityValueValue(fillInfo) }}
                        </detail-list-item>

                        <detail-list-item
                            title="完成量">
                            {{ getProjectQuantityNumberValue(fillInfo) }}
                        </detail-list-item>
                        <detail-list-item
                            title="作业备注">
                            {{ fillInfo.remark }}
                        </detail-list-item>

                    </view>

                    <view :key="fillInfo.infoId+1" v-else-if="fillInfo.type === fillInfoTypeMap.FILL_INFO_TYPE_DATE_TIME">
                        <detail-list-item title="运行开始时间">
                            {{ fillInfo.startTime }}
                        </detail-list-item>
                        <detail-list-item title="运行结束时间">
                            {{ fillInfo.endTime }}
                        </detail-list-item>
                        <detail-list-item title="未工作小时">
                            {{ fillInfo.resultEliminate }}小时
                        </detail-list-item>
                    </view>

                    <detail-list-item
                        :title="fillInfo.name"
                        v-else
                        :key="fillInfo.infoId" >
                        {{ getFillValue(fillInfo) }}
                    </detail-list-item>
                </view>
            </template>
        </view>

        <u-modal
            v-model="modelShow"
            :content="content"
            :show-cancel-button="true"
            @confirm="handleDelete"
        ></u-modal>
        <!-- <view class="p-fixed d-flex j-around a-center footer">
            <view class="common" @tap="handleDelTip">删除</view>
            <view class="common" @tap="handleUpdate">修改</view>
        </view> -->
    </view>
</template>

<script>
import DetailListItem from '@/components/detail-list/DescriptionList'
export default {
    components: { DetailListItem },
    props: {
        useType: {
            type: Number,
            default: 1
        },
        projectQuantityList: {
            type: Array,
            default: () => []
        },
        fillInfoList: {
            type: Array,
            default: () => []
        },
        model: {
            type: Object,
            default: () => {}
        }
    },
    data() {
        return {
            modelShow: false,
            projectQuantityUnitMap: {},
            content: '',
            natureList: [],
            fillInfoTypeMap: {},
            selectOptionMap: {},
            radioGroupMap: {}
        };
    },
    watch: {
        fillInfoList (fillInfoListValue) {
            this.natureShowMap = {}
            fillInfoListValue.forEach(fillInfo => {
                this.natureShowMap[fillInfo.nature] = true
            })
            const natureList = this.$DictCache.getChildrenList(this.$DictCache.TYPE.FILL_INFO_NATURE)
            natureList.forEach(natureItem => {
                if (this.natureShowMap[natureItem.value]) {
                    natureItem.show = true
                } else {
                    natureItem.show = false
                }
            })
            this.natureList = natureList
            this.fillInfoList = fillInfoListValue
        }
    },
    created () {
        this.projectQuantityUnitMap = this.$DictCache.getLabelByValueMapByType(this.$DictCache.TYPE.FILL_PROJECT_QUANTITY_UNIT)
        this.fillInfoTypeMap = this.$DictCache.VALUE.FILL_INFO_TYPE
    },
    methods: {
        getProjectQuantityValue (fillInfo) {
            const selectList = this.projectQuantityList.filter((item) => { return item.id === fillInfo.resultDesc })
            if (selectList && selectList.length > 0) {
                return selectList[0].name
            }
            return ''
        },
        getProjectQuantityValueValue (fillInfo) {
            const selectList = this.projectQuantityList.filter((item) => { return item.id === fillInfo.resultDesc })
            let result = this.$BaseTool.Amount.formatter(fillInfo.resultStart) + '~' + this.$BaseTool.Amount.formatter(fillInfo.resultEnd)
            if (selectList && selectList.length > 0) {
                result = result + this.projectQuantityUnitMap[selectList[0].siteUnit]
            }
            return result
        },
        getProjectQuantityNumberValue (fillInfo) {
            const selectList = this.projectQuantityList.filter((item) => { return item.id === fillInfo.resultDesc })
            let result = fillInfo.resultNumber
            if (selectList && selectList.length > 0) {
                result = result + this.projectQuantityUnitMap[selectList[0].unit]
            }
            return result
        },
        getFillValue(fillInfo) {
            if (fillInfo.type === this.$DictCache.VALUE.FILL_INFO_TYPE.FILL_INFO_TYPE_XIA_LA) {
                return this.getSelectLabel(fillInfo)
            } else if (fillInfo.type === this.$DictCache.VALUE.FILL_INFO_TYPE.FILL_INFO_TYPE_DAN_XUAN) {
                return this.getRadioGroupLabel(fillInfo)
            } else if (fillInfo.type === this.$DictCache.VALUE.FILL_INFO_TYPE.FILL_INFO_TYPE_FAN_WEI) {
                let result = this.$BaseTool.Amount.formatter(fillInfo.resultStart) + '~' + this.$BaseTool.Amount.formatter(fillInfo.resultEnd) +
                    '(' + this.$BaseTool.Amount.formatter(fillInfo.resultEliminate) + ')'
                if (fillInfo.codeValue === this.$DictCache.VALUE.FILL_INFO_CODE_VALUE.FILL_INFO_CODE_VALUE_GLS) {
                    result = result + 'KM'
                } else if (fillInfo.codeValue === this.$DictCache.VALUE.FILL_INFO_CODE_VALUE.FILL_INFO_CODE_VALUE_SJS) {
                    result = result + '小时'
                }
                return result
            } else {
                return fillInfo.resultDesc
            }
        },
        getSelectLabel (fillInfo) {
            const options = this.getSelectOptions(fillInfo)
            return options[fillInfo.resultValue]
        },
        getSelectOptions (fillInfo) {
            if (this.$BaseTool.Object.isBlank(this.selectOptionMap[fillInfo.dictType])) {
                this.selectOptionMap[fillInfo.dictType] = this.$DictCache.getLabelByValueMapByType(fillInfo.dictType)
            }
            return this.selectOptionMap[fillInfo.dictType]
        },
        getRadioGroup (fillInfo) {
            if (this.$BaseTool.Object.isBlank(this.radioGroupMap[fillInfo.dictType])) {
                this.radioGroupMap[fillInfo.dictType] = this.$DictCache.getLabelByValueMapByType(fillInfo.dictType)
            }
            return this.radioGroupMap[fillInfo.dictType]
        },
        getRadioGroupLabel (fillInfo) {
            const options = this.getRadioGroup(fillInfo)
            return options[fillInfo.resultValue]
        },
        // 删除提示
        handleDelTip() {
            this.modelShow = true;
            this.content = '您确定删除吗?';
        },
        // 删除
        handleDelete() {},
        // 修改
        handleUpdate() {
            uni.navigateTo({
                url: '../running-update/running-update'
            });
        }
    }
};
</script>

<style scoped lang="less">
    page {
        background-color: #f4f4f4;
    }

    .container {
        padding-bottom: 100rpx;

        .title {
            border-bottom: 1rpx solid #f4f4f4;
            color: #0082ff;
        }

        .p-fixed {
            border-top: 1rpx solid #f4f4f4;
            height: 100rpx;

            .common {
                padding: 15rpx 100rpx;
                border-radius: 30rpx;
                background-color: #0082ff;
                color: #fff;

                &:last-of-type {
                    background-color: #fff;
                    border: 1rpx solid #0082ff;
                    color: #0082ff;
                }
            }
        }

        .footer {
            bottom: 0;
            left: 0;
            right: 0;
            background-color: #fff;
        }
    }
</style>