f959f97099
refactor(QRCode): 优化二维码组件并修复空值检查 将QRCode组件从print目录移动到components目录，并添加空值检查防止错误 feat(crm): 在合同模型中添加交货日期字段 在CrmContract、CrmContractVo、CrmContractBo及相关Mapper中添加deliveryDate字段 refactor(wms): 统一使用全局QRCode组件路径 将多个文件中的QRCode引用路径从相对路径改为@/components/QRCode style(order): 调整订单页面标签顺序 调整操作记录和发货配卷标签的顺序 chore: 删除废弃的打印相关文件 移除print目录下不再使用的QRCode、CodeRenderer等组件和页面
119 lines
3.9 KiB
Vue
119 lines
3.9 KiB
Vue
<template>
|
|
<div class="contract-tabs">
|
|
<div v-if="contractId" class="tabs-content">
|
|
<el-tabs v-model="activeTab" type="card" tab-position="top" v-loading="tabLoading">
|
|
<el-tab-pane label="下发订单" name="second">
|
|
<OrderPage v-if="activeTab === 'second'" :contractId="contractId" />
|
|
</el-tab-pane>
|
|
<el-tab-pane label="财务状态" name="third">
|
|
<KLPTable v-loading="loading" :data="financeList">
|
|
<el-table-column label="收款日期" align="center" prop="dueDate" width="180">
|
|
<template slot-scope="scope">
|
|
<span>{{ parseTime(scope.row.dueDate, '{y}-{m}-{d}') }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="收款金额" align="center" prop="amount" />
|
|
<el-table-column label="备注" align="center" prop="remark" />
|
|
</KLPTable>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="订单异议" name="fourth">
|
|
<el-table v-loading="loading" :data="objectionList">
|
|
<el-table-column label="编号" align="center" prop="objectionCode" />
|
|
<el-table-column label="状态" align="center" prop="objectionStatus">
|
|
<template slot-scope="scope">
|
|
<el-tag v-if="scope.row.objectionStatus === 0" type="danger">待处理</el-tag>
|
|
<el-tag v-else-if="scope.row.objectionStatus === 1" type="success">已处理</el-tag>
|
|
<el-tag v-else-if="scope.row.objectionStatus === 2" type="info">已关闭</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="处理人" align="center" prop="handleUser" />
|
|
<el-table-column label="处理时间" align="center" prop="handleTime" width="180">
|
|
<template slot-scope="scope">
|
|
<span>{{ parseTime(scope.row.handleTime, '{y}-{m}-{d}') }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="备注" align="center" prop="remark" />
|
|
</el-table>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="发货配卷" name="fifth">
|
|
<CoilTable :data="coilList" />
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
</div>
|
|
<div v-else class="no-selection" style="display: flex; align-items: center; justify-content: center; height: 100%;">
|
|
<el-empty description="请先选择合同" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import OrderPage from "@/views/crm/order/index.vue";
|
|
import CoilTable from "../../components/CoilTable.vue";
|
|
|
|
export default {
|
|
name: "ContractTabs",
|
|
components: {
|
|
OrderPage,
|
|
CoilTable
|
|
},
|
|
props: {
|
|
contractId: {
|
|
type: Number,
|
|
default: null
|
|
},
|
|
financeList: {
|
|
type: Array,
|
|
default: () => []
|
|
},
|
|
objectionList: {
|
|
type: Array,
|
|
default: () => []
|
|
},
|
|
coilList: {
|
|
type: Array,
|
|
default: () => []
|
|
},
|
|
loading: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
tabLoading: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
// 活动tab
|
|
activeTab: "second"
|
|
};
|
|
},
|
|
methods: {
|
|
// 解析时间
|
|
parseTime(time, pattern) {
|
|
if (!time) return '';
|
|
const d = new Date(time);
|
|
const year = d.getFullYear();
|
|
const month = (d.getMonth() + 1).toString().padStart(2, '0');
|
|
const day = d.getDate().toString().padStart(2, '0');
|
|
const hours = d.getHours().toString().padStart(2, '0');
|
|
const minutes = d.getMinutes().toString().padStart(2, '0');
|
|
const seconds = d.getSeconds().toString().padStart(2, '0');
|
|
return pattern
|
|
.replace('{y}', year)
|
|
.replace('{m}', month)
|
|
.replace('{d}', day)
|
|
.replace('{h}', hours)
|
|
.replace('{i}', minutes)
|
|
.replace('{s}', seconds);
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
.contract-tabs {
|
|
height: 100%;
|
|
overflow-y: auto;
|
|
}
|
|
</style> |