委外申请

src/views/outsourcing/components/orderSearch.vue

@@ -0,0 +1,68 @@
+<!-- 搜索表单 -->
+<template>
+    <el-form label-width="120px" class="ele-form-search" @keyup.enter.native="search" @submit.native.prevent>
+        <el-row :gutter="24">
+
+            <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
+                <el-form-item label="销售订单号:">
+                    <el-input v-model="where.code" placeholder="请输入"></el-input>
+                </el-form-item>
+            </el-col>
+            <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
+                <el-form-item label="物料编码:">
+                    <el-input v-model="where.productCode" placeholder="请输入"></el-input>
+                </el-form-item>
+            </el-col>
+
+
+
+            <el-col v-bind="styleResponsive ? { sm: 4 } : { span: 4 }">
+                <div class="ele-form-actions">
+                    <el-button type="primary"  icon="el-icon-search" class="ele-btn-icon" @click="search">
+                        查询
+                    </el-button>
+                    <el-button @click="reset">重置</el-button>
+                </div>
+            </el-col>
+        </el-row>
+    </el-form>
+</template>
+  
+<script>
+export default {
+    data() {
+        // 默认表单数据
+        const defaultWhere = {
+            code: '',
+            productCode: '',
+           
+
+        };
+        return {
+            // 表单数据
+            where: { ...defaultWhere }
+        };
+    },
+    props: {
+
+    },
+    computed: {
+        // 是否开启响应式布局
+        styleResponsive() {
+            return this.$store.state.theme.styleResponsive;
+        }
+    },
+    methods: {
+        /* 搜索 */
+        search() {
+            this.$emit('search', this.where);
+        },
+        /*  重置 */
+        reset() {
+            this.where = { ...this.defaultWhere };
+            this.search();
+        }
+    }
+};
+</script>
+  

src/views/outsourcing/components/orderTablePopup.vue

@@ -0,0 +1,183 @@
+<template>
+    <el-dialog :title="title" v-if="visible" :visible.sync="visible" :before-close="handleClose"
+        :close-on-click-modal="true" :close-on-press-escape="false" append-to-body width="70%">
+
+        <el-card shadow="never">
+            <orderSearch @search="reload" />
+
+            <!-- 数据表格 -->
+            <ele-pro-table ref="table" :columns="columns" :datasource="datasource" :selection.sync="selection" row-key="id">
+
+            </ele-pro-table>
+
+
+        </el-card>
+
+        <div class="btns">
+            <el-button type="primary" size="small" @click="selected">选择</el-button>
+            <el-button size="small" @click="handleClose">关闭</el-button>
+        </div>
+    </el-dialog>
+</template>
+
+<script>
+import orderSearch from './orderSearch.vue'
+import { getPageList } from '@/api/saleOrder';
+import dictMixins from '@/mixins/dictMixins';
+export default {
+    components: { orderSearch },
+    mixins: [dictMixins],
+    data() {
+        return {
+            visible: false,
+            title: '销售订单',
+
+            // 表格列配置
+            columns: [
+                {
+                    columnKey: 'selection',
+                    type: 'selection',
+                    width: 45,
+                    align: 'center',
+                    reserveSelection: true,
+                    fixed: 'left'
+                },
+                {
+                    prop: 'code',
+                    label: '销售订单号',
+                    align: 'center',
+                    showOverflowTooltip: true,
+                    minWidth: 150,
+                    slot: 'code',
+                    sortable: true
+                },
+                {
+                    prop: 'lineNumber',
+                    label: '行号',
+                    align: 'center',
+                    showOverflowTooltip: true
+                },
+                {
+                    prop: 'productCode',
+                    label: '产品编码',
+                    align: 'center',
+                    showOverflowTooltip: true,
+                    minWidth: 140
+                },
+
+                {
+                    prop: 'productName',
+                    label: '产品名称',
+                    align: 'center',
+                    minWidth: 120
+                },
+
+                {
+                    prop: 'brandNo',
+                    label: '牌号',
+                    align: 'center'
+                },
+                {
+                    prop: 'model',
+                    label: '型号',
+                    align: 'center',
+                    minWidth: 120
+                },
+                {
+                    prop: 'productSumWeight',
+                    label: '订单重量',
+                    align: 'center'
+                },
+                {
+                    prop: 'contractNum',
+                    label: '订单数量',
+                    align: 'center'
+                },
+
+                {
+                    prop: 'status',
+                    label: '生产状态',
+                    align: 'center',
+                    showOverflowTooltip: true,
+                    formatter: (_row, _column, cellValue) => {
+                        return this.getDictValue('生产状态', _row.status);
+                    }
+                },
+
+
+            ],
+
+            // 表格选中数据
+            selection: [],
+
+            tableData: [],
+            current: null
+
+        }
+    },
+
+    watch: {
+
+    },
+    created() {
+        this.requestDict('生产状态');
+    },
+    methods: {
+
+        open(item) {
+            if (item) {
+                this.tableData = item
+            }
+            this.visible = true
+        },
+
+
+        /* 表格数据源 */
+        async datasource({ page, limit, where }) {
+            where.status = [1, 2, 3, 4, 7, 8]
+            const data = await getPageList({
+                ...where,
+                pageNum: page,
+                size: limit
+            });
+
+
+
+            return data;
+        },
+
+        /* 刷新表格 */
+        reload(where) {
+            this.$refs.table.reload({ page: 1, where: where });
+        },
+
+
+
+
+
+
+        handleClose() {
+            this.visible = false
+            this.$refs.table.setSelectedRows([]);
+            this.selection = []
+
+        },
+        selected() {
+
+            if (!this.selection.length) {
+                this.$message.error('请至少选择一条数据');
+                return;
+            }
+            this.$emit('selectOrder', this.selection)
+            this.handleClose()
+        },
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.btns {
+    text-align: center;
+    padding: 10px 0;
+}
+</style>

src/views/outsourcing/components/outsourceAddOrEdit.vue

@@ -0,0 +1,124 @@
+<template>
+  <ele-modal :visible.sync="visible" :closed="cancel" :title="`${ addOrEditFlag ? '创建' : '编辑'}委外计划`"
+             custom-class="ele-dialog-form" :close-on-click-modal="true" :close-on-press-escape="false" width="80%">
+    <div>
+      <el-form :model="formData" ref="form" label-width="120px" class="ele-body" :rules="rules">
+        <el-row :gutter="32">
+
+          <el-col :span="4">
+            <el-form-item label="计划名称:">
+              <el-input clearable v-model="formData.name" placeholder="请输入" />
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+      </el-form>
+
+      <el-form :model="formData" ref="tableForm">
+
+        <ele-pro-table ref="parentTable" :needPage="false" :columns="parentColumns" row-key="id">
+
+          <template v-slot:toolbar>
+            <el-button size="small" type="primary" icon="el-icon-plus" class="ele-btn-icon" @click="addOrder">
+              添加销售订单
+            </el-button>
+            <el-button size="small" type="primary" icon="el-icon-plus" class="ele-btn-icon" @click="addPlan">
+              添加生产计划
+            </el-button>
+          </template>
+
+          <template v-slot:expand="{ row, $index }">
+            <div style="width:calc(100% - 95px); min-height: 60px; margin-left: 95px;" v-if="row.childrenList || row.childrenList.length > 0">
+
+              <ele-pro-table :toolbar="false" toolsTheme="none" ref="childTable" :need-page="false"
+                             :datasource="row.childrenList" :columns="childColumns" :key="row.id + '-'+ $index">
+
+
+
+              </ele-pro-table>
+
+            </div>
+          </template>
+
+
+        </ele-pro-table>
+
+      </el-form>
+
+    </div>
+
+    <orderTablePopup ref="orderTablePopup" @selectOrder="selectOrder"></orderTablePopup>
+    <planTablePopup ref="planTablePopup" @selectPlan="selectPlan"></planTablePopup>
+
+  </ele-modal>
+</template>
+
+<script>
+import orderTablePopup from './orderTablePopup.vue';
+import planTablePopup from './planTablePopup.vue';
+export default {
+  components: {
+    orderTablePopup,
+    planTablePopup
+  },
+  data() {
+    return {
+      visible: false,
+      addOrEditFlag: true,
+      formData: {
+        name: '',
+      },
+      rules: {
+
+      },
+      parentColumns: [
+        {
+          width: 45,
+          type: 'expand',
+          columnKey: 'childrenList',
+          align: 'center',
+          slot: 'expand'
+        },
+      ],
+      childColumns: [
+
+      ],
+      tableData: [],
+    }
+  },
+  created() {
+  },
+  methods: {
+    selectOrder(row){
+      console.log(row);
+    },
+    selectPlan(row){
+      console.log(row);
+    },
+    addOrder(){
+      console.log('addOrder...........');
+      // this.tableData = this.$refs.parentTable.getData();
+      this.$refs.orderTablePopup.open();
+    },
+    addPlan(){
+      console.log('addPlan...........');
+      // this.tableData = this.$refs.parentTable.getData();
+      this.$refs.planTablePopup.open();
+    },
+    open(row){
+      // 有值为编辑
+      if(row){
+        this.addOrEditFlag = false;
+      }
+      this.visible = true;
+    },
+    cancel() {
+      this.visible = false;
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+
+</style>

src/views/outsourcing/components/outsourceSearch.vue

@@ -0,0 +1,74 @@
+<template>
+  <div>
+    <el-form label-width="80px" class="ele-form-search" @keyup.enter.native="search" @submit.native.prevent>
+      <el-row :gutter="15">
+
+        <el-col v-bind="styleResponsive ? { lg: 5, md: 12 } : { span: 5 }">
+          <el-form-item label="计划名称:">
+            <el-input clearable v-model="where.name" placeholder="请输入" />
+          </el-form-item>
+        </el-col>
+<!--        <el-col></el-col>-->
+        <el-col v-bind="styleResponsive ? { lg: 4, md: 12 } : { span: 4 }">
+          <div class="ele-form-actions">
+            <el-button type="primary" icon="el-icon-search" class="ele-btn-icon" @click="search">
+              查询
+            </el-button>
+            <el-button @click="reset" icon="el-icon-refresh-left" type="primary">重置</el-button>
+          </div>
+        </el-col>
+
+      </el-row>
+    </el-form>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {
+
+  },
+  data() {
+    const defaultWhere = {
+      releaseTime: [],
+      deliveryTime: [],
+      createTime: []
+    };
+    return {
+      where: { ...defaultWhere },
+    }
+  },
+  computed: {
+    // 是否开启响应式布局
+    styleResponsive() {
+      return this.$store.state.theme.styleResponsive;
+    }
+  },
+  methods: {
+    search() {
+      const where = { ...this.where };
+
+      for (const key in where) {
+        if (Array.isArray(where[key]) && where[key].length) {
+          where[`${key}Start`] = where[key][0];
+          where[`${key}End`] = where[key][1];
+        }
+      }
+      delete where.releaseTime;
+      delete where.deliveryTime;
+      delete where.createTime;
+
+      this.$emit('search', where);
+    },
+    /*  重置 */
+    reset() {
+      this.where = { ...this.defaultWhere };
+      this.search();
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+
+</style>

src/views/outsourcing/components/planSearch.vue

@@ -0,0 +1,67 @@
+<!-- 搜索表单 -->
+<template>
+    <el-form label-width="120px" class="ele-form-search" @keyup.enter.native="search" @submit.native.prevent>
+        <el-row :gutter="24">
+
+            <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
+                <el-form-item label="计划编号:">
+                    <el-input v-model="where.code" placeholder="请输入"></el-input>
+                </el-form-item>
+            </el-col>
+            <el-col v-bind="styleResponsive ? { lg: 6, md: 12 } : { span: 6 }">
+                <el-form-item label="物料编码:">
+                    <el-input v-model="where.productCode" placeholder="请输入"></el-input>
+                </el-form-item>
+            </el-col>
+
+
+
+            <el-col v-bind="styleResponsive ? { sm: 4 } : { span: 4 }">
+                <div class="ele-form-actions">
+                    <el-button type="primary"  icon="el-icon-search" class="ele-btn-icon" @click="search">
+                        查询
+                    </el-button>
+                    <el-button @click="reset">重置</el-button>
+                </div>
+            </el-col>
+        </el-row>
+    </el-form>
+</template>
+
+<script>
+export default {
+    data() {
+        // 默认表单数据
+        const defaultWhere = {
+            code: '',
+            productCode: '',
+
+
+        };
+        return {
+            // 表单数据
+            where: { ...defaultWhere }
+        };
+    },
+    props: {
+
+    },
+    computed: {
+        // 是否开启响应式布局
+        styleResponsive() {
+            return this.$store.state.theme.styleResponsive;
+        }
+    },
+    methods: {
+        /* 搜索 */
+        search() {
+            this.$emit('search', this.where);
+        },
+        /*  重置 */
+        reset() {
+            this.where = { ...this.defaultWhere };
+            this.search();
+        }
+    }
+};
+</script>

src/views/outsourcing/components/planTablePopup.vue

@@ -0,0 +1,277 @@
+<template>
+    <el-dialog :title="title" v-if="visible" :visible.sync="visible" :before-close="handleClose"
+        :close-on-click-modal="true" :close-on-press-escape="false" append-to-body width="70%">
+
+        <el-card shadow="never">
+            <planSearch @search="reload" />
+
+            <!-- 数据表格 -->
+            <ele-pro-table ref="table" :columns="columns" :datasource="datasource" :selection.sync="selection" row-key="id">
+
+            </ele-pro-table>
+
+
+        </el-card>
+
+        <div class="btns">
+            <el-button type="primary" size="small" @click="selected">选择</el-button>
+            <el-button size="small" @click="handleClose">关闭</el-button>
+        </div>
+    </el-dialog>
+</template>
+
+<script>
+import planSearch from './planSearch.vue'
+import { getList } from '@/api/productionPlan';
+import dictMixins from '@/mixins/dictMixins';
+export default {
+    components: { planSearch },
+    mixins: [dictMixins],
+    data() {
+        return {
+            visible: false,
+            title: '销售订单',
+
+            // 表格列配置
+            columns: [
+              {
+                width: 45,
+                type: 'selection',
+                columnKey: 'selection',
+                align: 'center',
+                slot: 'selection'
+              },
+              {
+                columnKey: 'index',
+                label: '序号',
+                type: 'index',
+                width: 55,
+                align: 'center',
+                showOverflowTooltip: true
+              },
+
+              {
+                slot: 'batchNo',
+                prop: 'batchNo',
+                label: '批次号',
+                align: 'center',
+                minWidth: 140,
+                sortable: true
+              },
+
+              {
+                slot: 'code',
+                prop: 'code',
+                action: 'code',
+                label: '计划编号',
+                align: 'center',
+
+                minWidth: 160,
+                sortable: true
+              },
+
+              {
+                prop: 'salesCode',
+                action: 'salesCode',
+                label: '销售订单号',
+                align: 'center',
+                minWidth: 160
+              },
+
+              {
+                prop: 'productCode',
+                label: '编码',
+                align: 'center',
+
+                minWidth: 140
+              },
+              {
+                prop: 'productName',
+                label: '名称',
+                align: 'center',
+
+                minWidth: 140
+              },
+
+              {
+                prop: 'brandNo',
+                label: '牌号',
+                align: 'center',
+                showOverflowTooltip: true
+              },
+
+              {
+                prop: 'specification',
+                label: '规格',
+                align: 'center',
+                minWidth: 150,
+
+                showOverflowTooltip: true
+              },
+              {
+                prop: 'model',
+                label: '型号',
+                align: 'center',
+                showOverflowTooltip: true
+              },
+
+              {
+                prop: 'priority',
+                label: '优先级',
+                align: 'center',
+                minWidth: 120,
+                slot: 'priority',
+                sortable: 'custom'
+              },
+
+              {
+                prop: 'produceRoutingName',
+                label: '工艺路线',
+                align: 'center',
+                width: 140,
+                showOverflowTooltip: true
+              },
+
+              {
+                prop: 'productNum',
+                label: '计划数量',
+                align: 'center',
+
+                slot: 'productNum'
+              },
+              {
+                prop: 'productWeight',
+                label: '计划重量',
+                align: 'center',
+
+                slot: 'productWeight'
+              },
+              {
+                prop: 'requiredFormingNum',
+                label: '要求生产数量',
+                align: 'center',
+
+                slot: 'requiredFormingNum'
+              },
+
+              {
+                prop: 'newSumOrderWeight',
+                label: '要求生产重量',
+                align: 'center',
+
+                slot: 'newSumOrderWeight'
+              },
+
+              {
+                prop: 'scheduleStatusName',
+                label: '进度状态',
+                align: 'center',
+                minWidth: 100
+              },
+
+              {
+                prop: '',
+                label: '已排产数量',
+                align: 'center',
+                showOverflowTooltip: true
+              },
+
+              {
+                prop: '',
+                label: '未排产数量',
+                align: 'center',
+                showOverflowTooltip: true
+              },
+              {
+                prop: '',
+                label: '已生产数量',
+                align: 'center',
+                showOverflowTooltip: true
+              },
+
+              {
+                prop: '',
+                label: '未生产数量',
+                align: 'center',
+                showOverflowTooltip: true
+              },
+
+
+            ],
+
+            // 表格选中数据
+            selection: [],
+
+            tableData: [],
+            current: null
+
+        }
+    },
+
+    watch: {
+
+    },
+    created() {
+        this.requestDict('生产状态');
+    },
+    methods: {
+
+        open(item) {
+            if (item) {
+                this.tableData = item
+            }
+
+            this.visible = true
+
+
+
+        },
+
+
+        /* 表格数据源 */
+        async datasource({ page, limit, where }) {
+            where.status = [1, 2, 3, 4, 7, 8]
+            const data = await getList({
+                ...where,
+                pageNum: page,
+                size: limit
+            });
+
+            return data;
+        },
+
+        /* 刷新表格 */
+        reload(where) {
+            this.$refs.table.reload({ page: 1, where: where });
+        },
+
+
+
+
+
+
+        handleClose() {
+            this.visible = false
+            this.$refs.table.setSelectedRows([]);
+            this.selection = []
+
+        },
+        selected() {
+
+            if (!this.selection.length) {
+                this.$message.error('请至少选择一条数据');
+                return;
+            }
+            this.$emit('selectOrder', this.selection)
+            this.handleClose()
+        },
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.btns {
+    text-align: center;
+    padding: 10px 0;
+}
+</style>

src/views/outsourcing/index.vue

@@ -0,0 +1,93 @@
+<template>
+  <div>
+    <el-card v-loading="loading">
+      <outsourceSearch ref="outsourceSearch" @search="reload"></outsourceSearch>
+      <ele-pro-table
+        ref="table"
+        key="id"
+        :initLoad="false"
+        :columns="columns"
+        :datasource="datasource"
+        row-key="code"
+        :selection.sync="selection"
+        :cache-key="`outsourcingTable`"
+        @sort-change="onSortChange"
+        autoAmendPage
+        @update:selection="handleSelectionChange">
+
+        <template v-slot:toolbar>
+          <el-button type="primary" @click="createPlan">创建计划</el-button>
+        </template>
+
+      </ele-pro-table>
+    </el-card>
+
+    <outsourceAddOrEdit ref="outsourceAddOrEdit"></outsourceAddOrEdit>
+  </div>
+</template>
+
+
+<script>
+import outsourceSearch from './components/outsourceSearch.vue'
+import outsourceAddOrEdit from './components/outsourceAddOrEdit.vue'
+export default {
+  components: {
+    outsourceSearch,
+    outsourceAddOrEdit
+  },
+  data(){
+    return {
+      loading: false,
+      columns: [
+
+      ],
+      selection: [],
+    }
+  },
+  created() {
+
+  },
+  methods: {
+    createPlan(){
+      console.log('create....')
+      this.$refs.outsourceAddOrEdit.open();
+    },
+    /* 刷新表格 */
+    reload(where) {
+      this.$nextTick(() => {
+        this.$refs.table.reload({ page: 1, where });
+      });
+    },
+    datasource(){
+
+    },
+    onSortChange(e) {
+      let sort = {
+        orderBy: e.order,
+        sortName: e.prop
+      };
+      this.sort = sort;
+      this.reload();
+    },
+    handleSelectionChange(list) {
+      if (list.length > 1) {
+        let _list = [];
+        list.forEach((e) => {
+          if (e.childList.length > 0 && e.splitBatch != 2) {
+            _list.push(...e.childList);
+          } else {
+            _list.push(e);
+          }
+        });
+        this.selection = _list;
+      } else {
+        this.selection = [];
+      }
+    },
+  }
+}
+</script>
+
+<style scoped lang="scss">
+
+</style>