116 lines
3.5 KiB
Vue
116 lines
3.5 KiB
Vue
|
<template>
|
||
|
<el-dialog title="订单详情" :visible.sync="show" width="500px" :before-do-close="doClose" :close-on-click-modal="false">
|
||
|
<div>
|
||
|
<el-scrollbar wrap-class="scrollbar-wrapper" style="height: 400px">
|
||
|
<data-form ref="dataform" :form="form" :form-model="formModel" class="data-box" />
|
||
|
</el-scrollbar>
|
||
|
</div>
|
||
|
<div slot="footer" class="dialog-footer">
|
||
|
<el-button type="primary" @click="doClose">关 闭</el-button>
|
||
|
</div>
|
||
|
</el-dialog>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
|
||
|
export default {
|
||
|
name: 'RouteDetail',
|
||
|
components: {
|
||
|
},
|
||
|
props: {
|
||
|
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
show: false,
|
||
|
formModel: {
|
||
|
organizationName: '',
|
||
|
userName: '',
|
||
|
goodsName: '',
|
||
|
amount: '',
|
||
|
forever: '',
|
||
|
startTime: '',
|
||
|
monthAmount: '',
|
||
|
totalPrice: '',
|
||
|
payWays: '',
|
||
|
createTime: '',
|
||
|
orderType: '',
|
||
|
contractNo: '',
|
||
|
bizType: '',
|
||
|
payStatusZh: '',
|
||
|
sellerName: ''
|
||
|
}
|
||
|
};
|
||
|
},
|
||
|
computed: {
|
||
|
form() {
|
||
|
const form = {
|
||
|
labelWidth: '120px',
|
||
|
items: [
|
||
|
{ prop: 'organizationName', label: `${this.$t('orderAuthor.organizationOrEnterprise')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'userName', label: `${this.$t('orderAuthor.userName')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'goodsName', label: `${this.$t('orderAuthor.commodityName')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'amount', label: `${this.$t('orderAuthor.permissionNumber')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'forever', label: `${this.$t('orderAuthor.permanenceOrNot')}:`, type: 'radio', disabled: true, required: false, options: this.$ConstSelect.Whether },
|
||
|
{ prop: 'startTime', label: `${this.$t('orderAuthor.startDate')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'monthAmount', label: `${this.$t('orderAuthor.purchaseMonths')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'totalPrice', label: `${this.$t('orderAuthor.totalPrice')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'payWays', label: `${this.$t('orderAuthor.paymentMethod')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'createTime', label: `${this.$t('orderAuthor.creationDate')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'orderType', label: `${this.$t('orderAuthor.orderType')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'contractNo', label: `${this.$t('orderAuthor.contractNumber')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'bizType', label: `${this.$t('orderAuthor.businessType')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'payStatusZh', label: `${this.$t('orderAuthor.paymentStatus')}:`, type: 'text', disabled: true },
|
||
|
{ prop: 'sellerName', label: `${this.$t('orderAuthor.salesman')}:`, type: 'text', disabled: true }
|
||
|
]
|
||
|
|
||
|
};
|
||
|
return form;
|
||
|
}
|
||
|
},
|
||
|
watch: {
|
||
|
|
||
|
},
|
||
|
mounted() {
|
||
|
},
|
||
|
methods: {
|
||
|
doShow(data) {
|
||
|
this.show = true;
|
||
|
this.formModel = {
|
||
|
organizationName: data.organizationName,
|
||
|
userName: data.userName,
|
||
|
goodsName: data.goodsName,
|
||
|
amount: data.amount,
|
||
|
forever: data.forever,
|
||
|
startTime: data.startTime,
|
||
|
monthAmount: data.monthAmount,
|
||
|
totalPrice: data.totalPrice,
|
||
|
payWays: data.payWays,
|
||
|
createTime: data.createTime,
|
||
|
orderType: data.orderType,
|
||
|
contractNo: data.contractNo,
|
||
|
bizType: data.bizType,
|
||
|
payStatusZh: data.payStatusZh,
|
||
|
sellerName: data.sellerName
|
||
|
};
|
||
|
},
|
||
|
doClose() {
|
||
|
this.show = false;
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
</script>
|
||
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
||
|
.draft {
|
||
|
width: 400px;
|
||
|
text-align: center;
|
||
|
margin: 20px auto;
|
||
|
}
|
||
|
/deep/{
|
||
|
.data-box .el-form-item {
|
||
|
margin-bottom: 12px;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
</style>
|