Skip to content

J
jilinzhongdianrenqun-web
Commit c619173d by zhangtw
Options

数据加载

parent 2a43f0f0
正在显示 包含 180 行增加 和 100 行删除
src/view/key-person/key_dm_inventory/index.vue
......@@ -316,52 +316,55 @@
<!-- 申请弹窗 -->
<Modal v-model="applyModal.visible" :title="applyModal.isEdit ? '修改领用申请' : '新增领用申请'" width="800">
<Form :model="applyModal.form" :rules="applyRules" :label-width="120" ref="applyForm">
<!-- <FormItem label="申请人">
<Input v-model="applyModal.form.applicant_name" disabled />
</FormItem>
<FormItem label="部门">
<Input v-model="applyModal.form.department_name" disabled />
</FormItem> -->
<FormItem label="领用用途" prop="borrow_purpose">
<Input v-model="applyModal.form.borrow_purpose" />
</FormItem>
<FormItem label="审批人:" prop="approver_id">
<Select
v-model="applyModal.form.approver_id"
placeholder="请选择审批人"
class="form-input"
filterable
>
<Option
v-for="item in approverModal.approverList"
:key="item.id"
:value="item.id"
<Spin fix v-if="applyModalLoading"></Spin>
<div v-else>
<Form :model="applyModal.form" :rules="applyRules" :label-width="120" ref="applyForm">
<!-- <FormItem label="申请人">
<Input v-model="applyModal.form.applicant_name" disabled />
</FormItem>
<FormItem label="部门">
<Input v-model="applyModal.form.department_name" disabled />
</FormItem> -->
<FormItem label="领用用途" prop="borrow_purpose">
<Input v-model="applyModal.form.borrow_purpose" />
</FormItem>
<FormItem label="审批人:" prop="approver_id">
<Select
v-model="applyModal.form.approver_id"
placeholder="请选择审批人"
class="form-input"
filterable
>
{{ item.name }} {{ item.leader === 1 ? '-leader' : '' }}
</Option>
</Select>
</FormItem>
<FormItem label="预计归还日期">
<DatePicker
v-model="applyModal.form.expected_return_date"
type="date"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
placeholder="请选择预计归还日期"
/>
</FormItem>
<Option
v-for="item in approverModal.approverList"
:key="item.id"
:value="item.id"
>
{{ item.name }} {{ item.leader === 1 ? '-leader' : '' }}
</Option>
</Select>
</FormItem>
<FormItem label="预计归还日期">
<DatePicker
v-model="applyModal.form.expected_return_date"
type="date"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
placeholder="请选择预计归还日期"
/>
</FormItem>
<h4>申请明细</h4>
<Row type="flex" justify="end" class="mb8">
<Col>
<Button size="small" class="mr5" type="primary" @click="showMaterialSelector = true">添加</Button>
<Button size="small" type="error" @click="deleteSelectedDetails">删除</Button>
</Col>
</Row>
<Table :data="applyModal.details" :columns="applyDetailColumns" size="small" border @on-selection-change="onApplyDetailSelectionChange" />
<MaterialSelector v-model="showMaterialSelector" :selected="[]" @on-ok="handleMaterialSelectorOk" @cancel="showMaterialSelector = false"/>
</Form>
<h4>申请明细</h4>
<Row type="flex" justify="end" class="mb8">
<Col>
<Button size="small" class="mr5" type="primary" @click="showMaterialSelector = true">添加</Button>
<Button size="small" type="error" @click="deleteSelectedDetails">删除</Button>
</Col>
</Row>
<Table :data="applyModal.details" :columns="applyDetailColumns" size="small" border @on-selection-change="onApplyDetailSelectionChange" />
<MaterialSelector v-model="showMaterialSelector" :selected="[]" @on-ok="handleMaterialSelectorOk" @cancel="showMaterialSelector = false"/>
</Form>
</div>
<div slot="footer">
<Button @click="applyModal.visible=false">取消</Button>
<Button type="primary" :loading="applyModal.saving" @click="saveApplication">保存</Button>
......@@ -370,16 +373,19 @@
<!-- 审批弹窗 -->
<Modal v-model="approveModal.visible" title="申请处理" width="700">
<Form :model="approveModal.record" :label-width="120">
<FormItem label="部门"><span>{{ approveModal.record.department_name }}</span></FormItem>
<FormItem label="申请人"><span>{{ approveModal.record.applicant_name }}</span></FormItem>
<FormItem label="申请明细">
<Table :data="approveModal.details" :columns="approveDetailColumns" size="small" border />
</FormItem>
<FormItem label="审批意见">
<Input type="textarea" v-model="approveModal.opinion" placeholder="驳回时必填" />
</FormItem>
</Form>
<Spin fix v-if="approveModalLoading"></Spin>
<div v-else>
<Form :model="approveModal.record" :label-width="120">
<FormItem label="部门"><span>{{ approveModal.record.department_name }}</span></FormItem>
<FormItem label="申请人"><span>{{ approveModal.record.applicant_name }}</span></FormItem>
<FormItem label="申请明细">
<Table :data="approveModal.details" :columns="approveDetailColumns" size="small" border />
</FormItem>
<FormItem label="审批意见">
<Input type="textarea" v-model="approveModal.opinion" placeholder="驳回时必填" />
</FormItem>
</Form>
</div>
<div slot="footer">
<Button @click="approveModal.visible=false">取消</Button>
<Button type="success" :loading="approveModal.submitting" @click="confirmApprove">通过</Button>
......@@ -406,38 +412,41 @@
<!-- 入库弹窗 -->
<Modal v-model="inboundModal.visible" :title="inboundModal.isEdit ? '修改入库' : '新增入库'" width="800">
<Form :model="inboundModal.form" :rules="inboundRules" :label-width="120" ref="inboundForm">
<FormItem label="入库单号" prop="inbound_no">
<Input v-model="inboundModal.form.inbound_no" />
</FormItem>
<FormItem label="批次号" prop="batch_no">
<Input v-model="inboundModal.form.batch_no" />
</FormItem>
<FormItem label="入库日期" prop="inbound_date">
<DatePicker
v-model="inboundModal.form.inbound_date"
type="date"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
placeholder="请选择入库日期"
/>
</FormItem>
<FormItem label="存放位置">
<Input v-model="inboundModal.form.storage_location" />
</FormItem>
<FormItem label="备注">
<Input type="textarea" v-model="inboundModal.form.remark" :rows="2" />
</FormItem>
<Spin fix v-if="inboundModalLoading"></Spin>
<div v-else>
<Form :model="inboundModal.form" :rules="inboundRules" :label-width="120" ref="inboundForm">
<FormItem label="入库单号" prop="inbound_no">
<Input v-model="inboundModal.form.inbound_no" />
</FormItem>
<FormItem label="批次号" prop="batch_no">
<Input v-model="inboundModal.form.batch_no" />
</FormItem>
<FormItem label="入库日期" prop="inbound_date">
<DatePicker
v-model="inboundModal.form.inbound_date"
type="date"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
placeholder="请选择入库日期"
/>
</FormItem>
<FormItem label="存放位置">
<Input v-model="inboundModal.form.storage_location" />
</FormItem>
<FormItem label="备注">
<Input type="textarea" v-model="inboundModal.form.remark" :rows="2" />
</FormItem>
<h4>明细（从用品库选择）
<div style="float: right;">
<Button size="small" class="mr5" type="primary" @click="showInboundMaterialSelector = true">添加</Button>
<Button size="small" type="error" @click="deleteSelectedInboundDetails">删除</Button>
</div>
</h4>
<Table :data="inboundModal.details" :columns="inboundDetailColumns" size="small" border @on-selection-change="onInboundDetailSelectionChange" style="width: 100%" />
<MaterialSelector v-model="showInboundMaterialSelector" :selected="[]" @on-ok="handleInboundMaterialSelectorOk" @cancel="showInboundMaterialSelector = false" />
</Form>
<h4>明细（从用品库选择）
<div style="float: right;">
<Button size="small" class="mr5" type="primary" @click="showInboundMaterialSelector = true">添加</Button>
<Button size="small" type="error" @click="deleteSelectedInboundDetails">删除</Button>
</div>
</h4>
<Table :data="inboundModal.details" :columns="inboundDetailColumns" size="small" border @on-selection-change="onInboundDetailSelectionChange" style="width: 100%" />
<MaterialSelector v-model="showInboundMaterialSelector" :selected="[]" @on-ok="handleInboundMaterialSelectorOk" @cancel="showInboundMaterialSelector = false" />
</Form>
</div>
<div slot="footer">
<Button @click="inboundModal.visible=false">取消</Button>
<Button type="primary" :loading="inboundModal.saving" @click="saveInbound">保存</Button>
......@@ -446,13 +455,16 @@
<!-- 归还弹窗 -->
<Modal v-model="returnModal.visible" title="归还物品" width="700">
<Form :model="returnModal.record" :label-width="120">
<FormItem label="部门"><span>{{ returnModal.record.department_name }}</span></FormItem>
<FormItem label="申请人"><span>{{ returnModal.record.applicant_name }}</span></FormItem>
<FormItem label="归还明细">
<Table :data="returnModal.details" :columns="returnDetailColumns" size="small" border />
</FormItem>
</Form>
<Spin fix v-if="returnModalLoading"></Spin>
<div v-else>
<Form :model="returnModal.record" :label-width="120">
<FormItem label="部门"><span>{{ returnModal.record.department_name }}</span></FormItem>
<FormItem label="申请人"><span>{{ returnModal.record.applicant_name }}</span></FormItem>
<FormItem label="归还明细">
<Table :data="returnModal.details" :columns="returnDetailColumns" size="small" border />
</FormItem>
</Form>
</div>
<div slot="footer">
<Button @click="returnModal.visible=false">取消</Button>
<Button type="primary" :loading="returnModal.saving" @click="confirmReturn">归还</Button>
......@@ -590,6 +602,10 @@ export default {
approverList: [], // 审批人列表
currentBorrowId: '' // 暂存当前提交的申请ID
},
approveModalLoading: false,
returnModalLoading: false,
applyModalLoading: false,
inboundModalLoading: false,
pushBadgeShow: false,
// 申请弹窗中的可编辑行状态
editingRowIndex: -1,
......@@ -1217,6 +1233,7 @@ export default {
openEdit (row) {
console.log(row)
this.applyModal.isEdit = true
this.applyModalLoading = true
this.applyModal.form = Object.assign({}, row)
// 关键：时间戳转 yyyy-MM-dd 字符串
if (this.applyModal.form.expected_return_date) {
......@@ -1234,6 +1251,15 @@ export default {
if (ret.data && ret.data.errcode === 0) {
this.applyModal.details = ret.data.data.details || []
}
}).catch(err => {
// 捕获所有异常（网络错误、接口抛错、代码逻辑错）
this.$Notice.error({
title: '查询失败',
desc: err.message || '网络异常，请稍后重试'
})
}).finally(() => {
// 无论成功/失败，最终都会执行（关闭loading）
this.applyModalLoading = false
})
this.applyModal.visible = true
this.exitEditMode()
......@@ -1366,6 +1392,8 @@ export default {
revoke (row) { revokeBorrow({ id: row.id }).then(ret => { if (ret.data && ret.data.errcode === 0) { this.$Message.success('撤回成功'); this.fetchList('apply') } else this.$Notice.error({ title: '撤回失败', desc: ret.data && ret.data.errmsg }) }) },
openApproveModal (row) {
this.approveModal.visible = true
this.approveModalLoading = true
this.approveModal.record = Object.assign({}, row)
this.approveModal.opinion = ''
// load details and current inventory for display
......@@ -1373,8 +1401,16 @@ export default {
if (ret.data && ret.data.errcode === 0) {
this.approveModal.details = ret.data.data.details || []
}
}).catch(err => {
// 捕获所有异常（网络错误、接口抛错、代码逻辑错）
this.$Notice.error({
title: '查询失败',
desc: err.message || '网络异常，请稍后重试'
})
}).finally(() => {
// 无论成功/失败，最终都会执行（关闭loading）
this.approveModalLoading = false
})
this.approveModal.visible = true
},
confirmApprove () {
this.approveModal.submitting = true
......@@ -1534,6 +1570,7 @@ export default {
},
openEditInbound (row) {
this.inboundModal.isEdit = true
this.inboundModalLoading = true
getInboundById({ id: row.id }).then(ret => {
if (ret.data && ret.data.errcode === 0) {
this.inboundModal.form = ret.data.data || {}
......@@ -1544,6 +1581,14 @@ export default {
}
this.inboundModal.details = ret.data.data.details || []
}
}).catch(err => {
// 捕获所有异常（网络错误、接口抛错、代码逻辑错）
this.$Notice.error({
title: '查询失败',
desc: err.message || '网络异常，请稍后重试'
})
}).finally(() => {
this.inboundModalLoading = false
})
this.inboundModal.visible = true
},
......@@ -1628,12 +1673,22 @@ export default {
})
},
openReturnModal (row) {
this.returnModal.visible = true
this.returnModalLoading = true
this.returnModal.record = Object.assign({}, row)
this.returnModal.details = []
getPendingReturnById({ id: row.id }).then(ret => {
if (ret.data && ret.data.errcode === 0) this.returnModal.details = ret.data.data.details || []
}).catch(err => {
// 捕获所有异常（网络错误、接口抛错、代码逻辑错）
this.$Notice.error({
title: '查询失败',
desc: err.message || '网络异常，请稍后重试'
})
}).finally(() => {
// 无论成功/失败，最终都会执行（关闭loading）
this.returnModalLoading = false
})
this.returnModal.visible = true
},
confirmReturn () {
this.returnModal.saving = true
......
src/view/key-person/key_dm_inventory/stats.vue
......@@ -53,7 +53,7 @@
<!-- 使用明细弹窗 -->
<Modal v-model="detailModal.visible" title="明细" width="800">
<Table :data="detailModal.rows" :columns="detailModal.columns" size="small" border />
<Table :data="detailModal.rows" :loading="loading.detail" :columns="detailModal.columns" size="small" border />
<div slot="footer"><Button type="primary" @click="detailModal.visible=false">关闭</Button></div>
</Modal>
</div>
......@@ -75,7 +75,7 @@ export default {
workStart: new Date(new Date().getFullYear(), new Date().getMonth(), 1),
workEnd: new Date(),
tables: { usage: [], workload: [] },
loading: { usage: false, workload: false },
loading: { usage: false, workload: false, detail: false },
usageColumns: [
{ type: 'index', title: '序号', width: 60, align: 'center' },
{ title: '部门', key: 'department_name', align: 'center' },
......@@ -135,12 +135,37 @@ export default {
{ title: '已归还数量', key: 'returned_quantity', align: 'center' }
]
this.detailModal.visible = true
this.loading.detail = true
this.detailModal.rows = []
const st = this.usageStart ? normalizeVisitTimeValue(this.usageStart) : null
const et = this.usageEnd ? normalizeVisitTimeValue(this.usageEnd).substring(0, 10) + ' 23:59:59' : null
getUsageDetails({ start: st, end: et, material: row.material_id, department: row.department_id }).then(ret => {
console.log(ret)
if (ret.data && ret.data.errcode === 0) this.detailModal.rows = ret.data.data || []
else this.$Notice.error({ title: '查询失败', desc: ret.data && ret.data.errmsg })
getUsageDetails({
start: st,
end: et,
material: row.material_id,
department: row.department_id
}).then(ret => {
// 先判断 ret 是否存在，避免报错
if (!ret || !ret.data) {
throw new Error('接口返回格式异常')
}
if (ret.data.errcode === 0) {
this.detailModal.rows = ret.data.data || []
} else {
this.$Notice.error({
title: '查询失败',
desc: ret.data.errmsg || '未知错误'
})
}
}).catch(err => {
// 捕获所有异常（网络错误、接口抛错、代码逻辑错）
this.$Notice.error({
title: '查询失败',
desc: err.message || '网络异常，请稍后重试'
})
}).finally(() => {
// 无论成功/失败，最终都会执行（关闭loading）
this.loading.detail = false
})
},
loadWorkload () {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论