<template>
    <view class="max-view">
        <view class="mx3 my2 p3 bg-color-white border-radius-view">
            <view class="d-flex py3 border-bottom">
                <view class="f-size-26 text-color-9 w200">设备名称</view>
                <view class="f-size-26 text-color-3">{{ model.sbName }}</view>
            </view>
            <view class="d-flex py3 border-bottom">
                <view class="f-size-26 text-color-9 w200">设备编号</view>
                <view class="f-size-26 text-color-3">{{ model.sbNo || '' }}</view>
            </view>
            <view class="d-flex py3 border-bottom">
                <view class="f-size-26 text-color-9 w200">仓库名称</view>
                <view class="f-size-26 text-color-3">{{ model.storeName || '' }}</view>
            </view>
            <view class="d-flex py3 border-bottom">
                <view class="f-size-26 text-color-9 w200">燃油类型</view>
                <view class="f-size-26 text-color-3">{{ model.spareName || '' }}</view>
            </view>
            <view class="d-flex py3 border-bottom">
                <view class="f-size-26 text-color-9 w200">用途</view>
                <view class="f-size-26 text-color-3">{{ model.reason || '' }}</view>
            </view>
            <view class="d-flex py3 border-bottom">
                <view class="f-size-26 text-color-9 w200">申请人</view>
                <view class="f-size-26 text-color-3">{{ model.userName || '' }}</view>
            </view>
            <view class="d-flex py3 border-bottom">
                <view class="f-size-26 text-color-9 w200">申请油量</view>
                <view class="f-size-26 text-color-3">{{ $BaseTool.Amount.formatter(model.applyOil) }} L</view>
            </view>
            <view class="d-flex py3 border-bottom">
                <view class="f-size-26 text-color-9 w200">审批人</view>
                <view class="f-size-26 text-color-3">{{ model.auditUserName || '系统' }}</view>
            </view>
            <view class="d-flex py3 border-bottom">
                <view class="f-size-26 text-color-9 w200">审批状态</view>
                <view class="f-size-26 text-color-3">{{ auditTypeMap[model.auditType] }}</view>
            </view>
            <view class="d-flex py3 border-bottom" v-if="model.storeUserName">
                <view class="f-size-26 text-color-9 w200">仓库管理员</view>
                <view class="f-size-26 text-color-3">{{ model.storeUserName || '' }}</view>
            </view>
            <view class="d-flex py3 border-bottom" v-if="model.realOil">
                <view class="f-size-26 text-color-9 w200">实际加油油量</view>
                <view class="f-size-26 text-color-3">{{ $BaseTool.Amount.formatter(model.realOil) }} L</view>
            </view>
            <view class="d-flex py3 border-bottom">
                <view class="f-size-26 text-color-9 w200">状态</view>
                <view class="f-size-26 text-color-3">{{ statusMap[model.status] }}</view>
            </view>
            <view class="d-flex py3">
                <view class="f-size-26 text-color-9 w200">申请说明</view>
                <view class="f-size-26 text-color-3">{{ model.applyRemark || '' }}</view>
            </view>
            <view class="d-flex py3">
                <view class="f-size-26 text-color-9 w200">审批说明</view>
                <view class="f-size-26 text-color-3">{{ model.remark || '' }}</view>
            </view>
            <view class="d-flex py3" v-if="model.storeUserName">
                <view class="f-size-26 text-color-9 w200">加油说明</view>
                <view class="f-size-26 text-color-3">{{ model.handleRemark || '' }}</view>
            </view>
        </view>
        <view class="m3" v-if="isConfirm">
            <u-button @click="submit" type="primary" shape="circle">确认</u-button>
        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            model: {
                sbId: null,
                storeId: null,
                userId: null,
                userName: null,
                storeUserId: null,
                storeUserName: null,
                status: null,
                applyOil: null,
                realOil: null,
                applyRemark: null,
                handleRemark: null,
                remark: null,
                createdUserId: null,
                updateUserId: null,
                updateUserName: null,
                updateTime: null,
                isOiL: null,
                isAudit: null,
                isUpdate: null,
                auditType: null,
                auditUserName: null
            },
            isConfirm: false,
            statusMap: {},
            auditTypeMap: {}
        };
    },
    created () {
        this.statusMap = this.$DictCache.getLabelByValueMapByType(this.$DictCache.TYPE.SB_OIL_STATUS)
        this.auditTypeMap = this.$DictCache.getLabelByValueMapByType(this.$DictCache.TYPE.SB_OIL_AUDIT_TYPE)
    },
    onLoad(options) {
        this.isConfirm = options.confirm === 1 || options.confirm === '1';
        this.$Http.fetchSbOil({ id: options.id }).then(res => {
            this.model = res.data;
        });
    },
    methods: {
        submit() {
            this.$Http.updateConfirmSbOil({ id: this.model.id })
                .then(() => {
                    uni.redirectTo({
                        url: '/pages/oiling/my-oiling'
                    });
                }).catch(() => {
                })
        }
    }
};
</script>

<style lang="less">
page {
    background-color: #f4f4f4;
}
.max-view {
    padding-top: unit(50, rpx);
    .border-radius-view {
        border-radius: unit(16, rpx);
    }
}
</style>
