123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738 |
- <template>
- <div>
- <byBill :propConfig="config" @search="search" @onSmt="doSave" ref="bill" @resert="resert" @detail="openEdit"
- @onRefresh="resert" @pagination="pagination" @clickTab="clickTab">
- </byBill>
- <vxe-modal v-model="vxeValue" width="70%" height="70%" min-width="800" min-height="600" show-zoom resize transfer
- show-footer>
- <template #title>
- <!-- <span>拆单</span> -->
- </template>
- <template #default>
- <div class="fl" style="width: 40%;">
- <div style="margin-bottom: 20px;">主单销售数据</div>
- <by-table ref="leftTable" :propConfig="leftTableConfig"></by-table>
- </div>
- <div class="fl" style="font-size: 80px;margin: 200px 6% 0 6%;transform: rotate(90deg);"><i
- class="el-icon-sort"></i></div>
- <div class="fl" style="width: 40%;">
- <div style="margin-bottom: 20px;">拆单销售数据</div>
- <by-table ref="rightTable" :propConfig="rightTableConfig" @onChangeRow="rightChange"></by-table>
- </div>
- </template>
- <template #footer>
- <div class="btn">
- <el-button type="primary" size="small" @click="doConfirm">确定</el-button>
- </div>
- </template>
- </vxe-modal>
- </div>
- </template>
- <script lang="ts">
- import { Component, Prop, Vue, Watch } from "vue-property-decorator";
- import api from "@/api/order";
- import OrderType from "./components/orderType.vue";
- import byBill from "./components/byBill/byBill.vue";
- @Component({ components: { byBill } })
- export default class OrderTask extends Vue {
- vxeValue = false
- timeNum = 0;
- timer : any = null
- baseInfo : any = {} // 订单数据
- regularData : any = [] // 固定值
- leftTableConfig : any = {
- attr: {
- size: 'mini',
- height: 490,
- align: 'center',
- },
- columns:
- [
- {
- width: 128,
- title: '物料名称',
- field: 'materialName',
- },
- {
- width: 128,
- title: '数量',
- field: 'number',
- },
- {
- width: 128,
- title: '已拆单数量',
- field: 'splitOrderNumber',
- },
- {
- width: 128,
- title: '可拆单数量',
- field: 'splitNumber',
- }
- ]
- }
- rightTableConfig : any = {
- attr: {
- size: 'mini',
- height: 490,
- align: 'center',
- },
- columns:
- [
- {
- width: 258,
- title: '物料名称',
- field: 'materialName',
- },
- {
- width: 258,
- title: '数量',
- field: 'number',
- component: 'by-input',
- compConfig: {
- attr: {
- size: 'mini',
- type: 'integer',
- placeholder: '请输入数量'
- },
- }
- },
- ]
- }
- config : any = {
- attr: {
- activeName: 'all'
- },
- // 单据
- bill: {
- tool: {
- customTools: []
- },
- form: {
- attr: {
- size: 'medium',
- readonly: true,
- },
- columns: [
- [
- {
- span: 8,
- label: '单据编号',
- prop: 'orderNumber',
- component: 'by-input',
- },
- {
- span: 8,
- label: '机构名称',
- prop: 'organizationName',
- component: 'by-input',
- },
- {
- span: 8,
- label: '退单编号',
- prop: 'chargebackNo',
- component: 'by-input',
- },
- {
- span: 8,
- label: '联系方式',
- prop: 'deliveryPhone',
- component: 'by-input',
- },
- {
- span: 8,
- label: '收货人',
- prop: 'consignee',
- component: 'by-input',
- },
- {
- span: 8,
- label: '交货时间',
- prop: 'deliveryData',
- component: 'by-input',
- },
- {
- span: 8,
- label: '交货地点',
- prop: 'deliveryAddress',
- component: 'by-input',
- },
- {
- span: 8,
- label: '交货方式',
- prop: 'deliveryWay',
- component: 'by-input',
- },
- ],
- [
- {
- span: 28,
- label: '备注',
- slot: true,
- prop: 'remark',
- component: 'by-input',
- compConfig: {
- attr: {
- size: 'mini',
- placeholder: '请输入备注',
- type: 'textarea'
- },
- }
- },
- ]
- ]
- },
- tableConfig: [
- {
- table: {
- attr: {
- size: 'mini',
- height: 500,
- align: 'center',
- readonly: true
- },
- columns:
- [{
- width: 300,
- title: '物料名称',
- field: 'materialName',
- },
- {
- width: 150,
- title: '单位',
- field: 'unit',
- },
- {
- width: 150,
- title: '数量',
- field: 'number',
- },
- {
- width: 150,
- title: '已交付数量',
- field: 'deliveryNumber',
- },
- {
- width: 150,
- title: '单价',
- field: 'unitPrice',
- },
- {
- width: 150,
- title: '实际金额',
- field: 'realityPrice',
- },
- {
- width: 150,
- title: '优惠金额',
- field: 'prePrice',
- },
- {
- width: 150,
- title: '合计金额',
- field: 'totalPrice',
- },
- ]
- }
- }
- ]
- },
- // 综合
- all: {
- search: {
- attr: {
- size: 'mini',
- },
- columns: [
- [
- {
- span: 6,
- label: '单据编号',
- prop: 'orderNumber',
- component: 'by-input',
- compConfig: {
- attr: {
- placeholder: '请输入单据编号',
- clearable: true
- }
- }
- },
- {
- span: 6,
- label: '机构名称',
- prop: 'organizationName',
- component: 'by-input',
- compConfig: {
- attr: {
- placeholder: '请输入机构名称',
- clearable: true
- },
- },
- },
- {
- span: 6,
- label: '退单编号',
- prop: 'chargebackNo',
- component: 'by-input',
- compConfig: {
- attr: {
- placeholder: '请输入退单编号',
- clearable: true
- }
- }
- },
- ],
- ]
- },
- tool: {
- tools: {
- search: true,
- refresh: true
- },
- customTools: [
- {
- name: '退单', icon: 'el-icon-top', audit: [''], event: {
- click: () => {
- (this as any).doBackOrder()
- }
- }
- }
- ]
- },
- table: {
- attr: {
- height: 600,
- size: 'mini',
- seq: true,
- align: 'left',
- checkbox: true
- },
- columns: [
- {
- width: 144,
- title: '单据编号',
- field: 'orderNumber',
- isDetail: true,
- },
- {
- width: 50,
- component: OrderType,
- },
- {
- width: 180,
- title: '机构名称',
- field: 'organizationName',
- },
- {
- width: 178,
- title: '退单编号',
- field: 'chargebackNo',
- },
- {
- width: 90,
- title: '收货人',
- field: 'consignee',
- },
- {
- width: 120,
- title: '联系方式',
- field: 'phone',
- },
- {
- width: 150,
- title: '计划交货时间',
- field: 'planDeliveryData',
- },
- {
- width: 150,
- title: '确定交货时间',
- field: 'affirmDeliveryData',
- },
- {
- width: 150,
- title: '交货地点',
- field: 'address',
- },
- {
- width: 110,
- title: '操作',
- action: true,
- plugins: [
- {
- icon: 'el-icon-edit',
- name: '查看',
- audit: '',
- event: {
- click: (item : any) => {
- (this as any).openEdit(item)
- }
- }
- },
- {
- name: '拆单',
- event: {
- show: (item : any) => {
- return item.isMaster === 1
- },
- click: (item : any) => (this as any).orderTaking(item)
- }
- },
- ]
- }
- ]
- }
- },
- // 退单
- returnOrder: {
- search: {
- attr: {
- size: 'mini',
- },
- columns: [
- [
- {
- span: 6,
- label: '单据编号',
- prop: 'orderNumber',
- component: 'by-input',
- compConfig: {
- attr: {
- placeholder: '请输入单据编号',
- clearable: true
- }
- }
- },
- {
- span: 6,
- label: '机构名称',
- prop: 'organizationName',
- component: 'by-input',
- compConfig: {
- attr: {
- placeholder: '请输入机构名称',
- clearable: true
- },
- },
- },
- {
- span: 6,
- label: '退单编号',
- prop: 'chargebackNo',
- component: 'by-input',
- compConfig: {
- attr: {
- placeholder: '请输入退单编号',
- clearable: true
- }
- }
- },
- ],
- ]
- },
- tool: {
- tools: {
- search: true,
- refresh: true
- },
- },
- table: {
- attr: {
- height: 620,
- size: 'mini',
- seq: true,
- align: 'left',
- checkbox: true
- },
- columns: [
- {
- width: 168,
- title: '单据编号',
- field: 'orderNumber',
- isDetail: true,
- fixed: 'left'
- },
- {
- width: 180,
- title: '机构名称',
- field: 'organizationName',
- },
- {
- width: 178,
- title: '退单编号',
- field: 'chargebackNo',
- },
- {
- width: 90,
- title: '收货人',
- field: 'consignee',
- },
- {
- width: 120,
- title: '联系方式',
- field: 'phone',
- },
- {
- width: 150,
- title: '计划交货时间',
- field: 'planDeliveryData',
- },
- {
- width: 150,
- title: '确定交货时间',
- field: 'affirmDeliveryData',
- },
- {
- width: 150,
- title: '交货地点',
- field: 'address',
- },
- {
- width: 110,
- title: '操作',
- action: true,
- plugins: [{
- icon: 'el-icon-edit',
- name: '查看',
- audit: '',
- event: {
- click: (item : any) => {
- (this as any).openEdit(item)
- }
- }
- }, {
- name: '拆单',
- event: {
- click: (item : any) => (this as any).orderTaking(item)
- }
- }]
- }
- ]
- }
- },
- }
- created() {
- this.timer = setInterval(() => {
- this.getDataList()
- }, 500)
- }
- // 右拆单数据变化
- rightChange(e : any) {
- console.log(e.number);
- if (0 <= e.number && e.number <= this.regularData[e.dataIndex].splitNumber) {
- let leftTableData = (this.$refs.leftTable as any).getValue();
- leftTableData[e.dataIndex].splitNumber = leftTableData[e.dataIndex].number - e.number;
- (this.$refs.leftTable as any).setValue(leftTableData);
- } else {
- let leftTableData = (this.$refs.leftTable as any).getValue();
- let rifhtTableData = (this.$refs.rightTable as any).getValue();
- rifhtTableData[e.dataIndex].number = '0';
- leftTableData[e.dataIndex].splitNumber = leftTableData[e.dataIndex].number - leftTableData[e.dataIndex].splitOrderNumber;
- (this.$refs.leftTable as any).setValue(leftTableData);
- (this.$refs.rightTable as any).setValue(rifhtTableData);
- this.$message.warning('输入值只能是自然数且不能大于可拆单数量');
- }
- }
- // 打开拆单
- orderTaking(item : any) {
- this.vxeValue = true;
- this.baseInfo = item;
- this.regularData = (this as any).$lodash.cloneDeep(item.suborderList);
- let rightData = (this as any).$lodash.cloneDeep(item.suborderList);
- this.regularData.map((v : any) => {
- v.splitNumber = v.number - v.splitOrderNumber;
- })
- rightData.map((v : any, i : any) => {
- v.number = '0';
- v.dataIndex = i;
- v.splitNumber = v.number - v.splitOrderNumber;
- });
- setTimeout(() => {
- (this.$refs.leftTable as any).setValue(this.regularData);
- (this.$refs.rightTable as any).setValue(rightData);
- }, 0)
- }
- // 确认拆单
- doConfirm() {
- let rifhtNewData : any = [];
- let rifhtTableData = (this.$refs.rightTable as any).getValue();
- rifhtTableData.map((v : any) => {
- rifhtNewData.push({
- id: v.id,
- inSplitOrderNumber: v.number
- })
- });
- let isTrue = rifhtNewData.filter((v : any) => v.inSplitOrderNumber != 0);
- let obj : any = {
- id: this.baseInfo.id,
- splitList: rifhtNewData,
- };
- if (isTrue.length > 0) {
- api.splitOrder(obj, 'supplyPurchaseOrder').then((res : any) => {
- if (res.code === 200) {
- this.$message.success('拆单成功!');
- this.getPageList({}, 'all'); // 综合数据
- this.vxeValue = false;
- } else this.$message.error(res.msg);
- })
- } else this.$message.warning('请输入拆单销售数据');
- }
- // 保存新增
- doSave() {
- // (this.$refs.product as any).setShow(true)
- (this as any).$refs.bill.$refs.billForm.validate().then(() => {
- let query = (this as any).$refs.bill.$refs.billForm.getValue();
- api.saveList(query, 'supplyPurchaseOrder').then((res : any) => {
- if (res.code === 200) {
- this.$message({
- type: 'success',
- message: '提交成功!'
- });
- this.getDataList();
- (this.$refs.bill as any).showTab = 'all';
- (this.$refs.bill as any).setBillFormValue({});
- } else this.$message.error(res.msg);
- })
- })
- }
- getDataList() {
- if (!this.$refs.bill) {
- if (this.timeNum > 5) {
- clearInterval(this.timer)
- }
- this.timeNum++;
- return
- }
- clearInterval(this.timer);
- this.getPageList({}, 'all'); // 综合数据
- }
- // 获取分页数据
- getPageList(query : any, type : any) {
- api.pageList(query, 'supplyPurchaseOrder').then((res : any) => {
- if (res.code === 200) {
- (this.$refs.bill as any).setTabTableValue(type, res.data.records);
- let page = {
- pageNo: res.data.current, //当前页
- pageSize: res.data.size, //每页条数
- total: res.data.total //总条数
- };
- (this.$refs.bill as any).setTablePage(type, page)
- } else this.$message.error(res.msg);
- })
- }
- // 打开编辑
- openEdit(e : any) {
- e = e.row ? e.row : e;
- let billConfig = (this as any).$lodash.cloneDeep(this.config.bill);
- if (e.isMaster === 1) {
- billConfig.tool.customTools = [
- {
- name: '拆单', icon: 'el-icon-minus', audit: [''], event: {
- click: () => {
- (this as any).orderTaking(e)
- }
- }
- },
- ];
- } else {
- billConfig.tool.customTools = [
- {
- name: '退单', icon: 'el-icon-bottom', audit: [''], event: {
- click: () => {
- (this as any).doBackOrder2(e)
- }
- }
- }
- ];
- };
- (this.$refs.bill as any).setBillConfig(billConfig);
- (this.$refs.bill as any).setBillFormValue(e); // 设置单据表单数据
- (this.$refs.bill as any).setBillTableValue(e.suborderList, 0);// 设置第1张单据表格数据
- (this.$refs.bill as any).showTab = 'bill';
- }
- // 工具栏退单
- doBackOrder() {
- let selectData = (this as any).$refs.bill.getTableSelectData('all');
- if (selectData.length > 1) return this.$message.warning('只能选择一条退单数据')
- let ids:any = [];
- if (selectData.length > 0) {
- selectData.map((v : any) => {
- ids.push(v.id);
- })
- } else return this.$message({ type: 'warning', message: '请选择退单数据' })
- selectData[0].suborderList.map((v : any) => {
- delete v.id;
- })
- this.$confirm('确定退单吗!', '注意', {
- confirmButtonText: '确定',
- cancelButtonText: '取消',
- type: 'warning',
- center: true
- }).then(() => {
- api.stoporder({ids:ids}, 'supplyPurchaseOrder').then((res : any) => {
- if (res.code === 200) {
- this.$message.success('退单成功!');
- this.getDataList();
- (this.$refs.bill as any).showTab = 'all';
- } else this.$message.error(res.msg)
- })
- }).catch(() => this.$message.info('已取消退单'));
- }
- // 导航切换
- clickTab(e : any) {
- console.log('导航切换 ==> ', e);
- if (e === 'all') this.getDataList();
- if (e === 'bill') {
- let billConfig = (this as any).$lodash.cloneDeep(this.config.bill);
- billConfig.tool.customTools = [];
- (this.$refs.bill as any).setBillConfig(billConfig);
- }
- }
- // 单据操作退单
- doBackOrder2(e : any) {
- console.log(e);
- e.suborderList.map((v : any) => {
- delete v.id;
- })
- this.$confirm('确定退单吗!', '注意', {
- confirmButtonText: '确定',
- cancelButtonText: '取消',
- type: 'warning',
- center: true
- }).then(() => {
- api.stoporder([e.id], 'supplyPurchaseOrder').then((res : any) => {
- if (res.code === 200) {
- this.$message.success('退单成功!');
- this.getDataList();
- (this.$refs.bill as any).showTab = 'all';
- } else this.$message.error(res.msg)
- })
- }).catch(() => this.$message.info('已取消退单'));
- }
- // 分页
- pagination(e : any) {
- let query : any = (this as any).$refs.bill.getSearchValue(e.type);
- query.pageNo = e.page.pageNum;
- query.pageSize = e.page.pageSize;
- let loading = this.$loading({ target: '.main-container' })
- api.pageList(query, 'supplyPurchaseOrder').then((res : any) => {
- if (res.code === 200) {
- (this.$refs.bill as any).setTabTableValue(e.type, res.data.records);
- loading.close()
- } else this.$message.error(res.msg);
- })
- }
- // 搜索
- search(parames : any) {
- let query = parames.value
- if (parames.type === 'draftsBox') query.submitState = 0 // 草稿箱数据
- if (parames.type === 'smt') query.submitState = 1 // 已提交数据
- this.getPageList(query, parames.type) // 获取综合分页数据
- }
- // 刷新/重置
- resert(e : any) {
- let data : any = e.type ? e.type : e;
- (this as any).$refs.bill.$refs[data].clearSearch();
- if (data === 'all') this.getPageList({}, 'all'); // 综合数据
- }
- }
- </script>
|