Merge branch 'dev' of http://172.16.100.139/new-business/drp-web into dev

.gitignore

@@ -21,3 +21,4 @@ selenium-debug.log
 
 package-lock.json
 yarn.lock
+vue.config.js

src/api/business/purchase/purchase-task.js

@@ -0,0 +1,10 @@
+import request from "@/utils/request";
+
+// 查询任务列表
+export function taskList(data) {
+  return request({
+    url: "/pu/order/generate/list",
+    method: "POST",
+    data: data,
+  });
+}

src/api/purchase/basic.js

@@ -0,0 +1,40 @@
+import request from '@/utils/request'
+
+// 获取物料分工列表
+export function getDivisionList(data) {
+  return request({
+    url: `/material/division/list?pageSize=${data.pageSize}&pageNum=${data.pageNum}`,
+    method: 'post',
+    data: data
+  })
+}
+// 物料分工新增
+export function addDivision(data) {
+  return request({
+    url: `/material/division/add`,
+    method: 'post',
+    data: data
+  })
+}
+// 物料分工编辑保存
+export function editDivision(data) {
+  return request({
+    url: `/material/division/edit`,
+    method: 'put',
+    data: data
+  })
+}
+// 物料分工详情
+export function getDivisions(id) {
+  return request({
+    url: `/material/division/detail/${id}`,
+    method: 'get',
+  })
+}
+// 物料分工删除
+export function delDivision(ids) {
+  return request({
+    url: `/material/division/delete/${ids}`,
+    method: 'DELETE',
+  })
+}

src/api/purchase/deliveryAddress.js

@@ -0,0 +1,40 @@
+import request from '@/utils/request'
+
+// 获取收货地址档案列表
+export function getAddressList(data) {
+  return request({
+    url: `/pu/delivery/address/list?pageSize=${data.pageSize}&pageNum=${data.pageNum}`,
+    method: 'post',
+    data: data
+  })
+}
+// 收货地址档案新增
+export function addAddress(data) {
+  return request({
+    url: `/pu/delivery/address/add`,
+    method: 'post',
+    data: data
+  })
+}
+// 收货地址档案修改保存
+export function editAddress(data) {
+  return request({
+    url: `/pu/delivery/address/edit`,
+    method: 'put',
+    data: data
+  })
+}
+// 收货地址档案详情
+export function getAddressDetail(id) {
+  return request({
+    url: `/pu/delivery/address/detail/${id}`,
+    method: 'get',
+  })
+}
+// 收货地址档案删除
+export function delAddress(ids) {
+  return request({
+    url: `/pu/delivery/address/delete/${ids}`,
+    method: 'DELETE',
+  })
+}

src/api/purchase/purchaseDemand.js

@@ -0,0 +1,57 @@
+import request from '@/utils/request'
+
+// 采购需求单列表
+export function getDemandList(data) {
+  return request({
+    url: `/pu/demand/list?pageSize=${data.pageSize}&pageNum=${data.pageNum}`,
+    method: 'post',
+    data: data
+  })
+}
+// 采购需求单新增
+export function addDemand(data) {
+  return request({
+    url: `/pu/demand/add`,
+    method: 'post',
+    data: data
+  })
+}
+// 采购需求单编辑
+export function editDemand(data) {
+  return request({
+    url: `/pu/demand/edit`,
+    method: 'put',
+    data: data
+  })
+}
+// 采购需求单基本信息详情
+export function getDemandDetail(id) {
+  return request({
+    url: `/pu/demand/detail/${id}`,
+    method: 'get',
+  })
+}
+// 采购需求单基本子表详情
+export function getDemandSonDetail(data) {
+  return request({
+    url: `/pu/demand/item/list/${data.id}?pageSize=${data.pageSize}&pageNum=${data.pageNum}`,
+    method: 'post',
+    data: data
+  })
+}
+// 采购需求单删除
+export function delDemand(ids) {
+  return request({
+    url: `/pu/demand/delete/${ids}`,
+    method: 'delete',
+  })
+}
+// 采购需求单模板下载
+export function downLoadDemand(data) {
+  return request({
+    url: `/pu/demand/download`,
+    method: 'post',
+    data: data,
+    responseType: 'blob'
+  })
+}

src/components/MyCollapse/collapse.vue

@@ -0,0 +1,123 @@
+<template>
+  <transition
+    :name="transitionName"
+    @before-enter="collapseBeforeEnter"
+    @enter="collapseEnter"
+    @after-enter="collapseAfterEnter"
+    @before-leave="collapseBeforeLeave"
+    @leave="collapseLeave"
+    @after-leave="collapseAfterLeave">
+    <slot></slot>
+  </transition>
+</template>
+
+<script>
+/**
+ * 元素折叠过度效果
+ */
+export default {
+  name: 'CollapseTransition',
+  props: {
+    transitionName: {
+      type: String,
+      default: 'collapse-transition'
+    }
+  },
+  data () {
+    return {
+      oldPaddingTop: '',
+      oldPaddingBottom: '',
+      oldOverflow: ''
+    }
+  },
+  methods: {
+    collapseBeforeEnter (el) {
+      // console.log('11, collapseBeforeEnter');
+      this.oldPaddingBottom = el.style.paddingBottom;
+      this.oldPaddingTop = el.style.paddingTop;
+      // 过渡效果开始前设置元素的maxHeight为0，让元素maxHeight有一个初始值
+      el.style.paddingTop = '0';
+      el.style.paddingBottom = '0';
+      el.style.maxHeight = '0';
+    },
+    collapseEnter (el, done) {
+      // console.log('22, collapseEnter');
+      //
+      this.oldOverflow = el.style.overflow;
+      let elHeight = el.scrollHeight;
+      // 过渡效果进入后将元素的maxHeight设置为元素本身的高度，将元素maxHeight设置为auto不会有过渡效果
+      if (elHeight > 0) {
+        el.style.maxHeight = elHeight + 'px';
+      } else {
+        el.style.maxHeight = '0';
+      }
+      el.style.paddingTop = this.oldPaddingTop;
+      el.style.paddingBottom = this.oldPaddingBottom;
+
+      el.style.overflow = 'hidden';
+      // done();
+      let onTransitionDone = function () {
+        done();
+        // console.log('enter onTransitionDone');
+        el.removeEventListener('transitionend', onTransitionDone, false);
+        el.removeEventListener('transitioncancel', onTransitionDone, false);
+      };
+      // 绑定元素的transition完成事件，在transition完成后立即完成vue的过度动效
+      el.addEventListener('transitionend', onTransitionDone, false);
+      el.addEventListener('transitioncancel', onTransitionDone, false);
+    },
+    collapseAfterEnter (el) {
+      // console.log('33, collapseAfterEnter');
+      // 过渡效果完成后恢复元素的maxHeight
+      el.style.maxHeight = '';
+      el.style.overflow = this.oldOverflow;
+    },
+
+    collapseBeforeLeave (el) {
+      // console.log('44, collapseBeforeLeave', el.scrollHeight);
+
+      this.oldPaddingBottom = el.style.paddingBottom;
+      this.oldPaddingTop = el.style.paddingTop;
+      this.oldOverflow = el.style.overflow;
+
+      el.style.maxHeight = el.scrollHeight + 'px';
+      el.style.overflow = 'hidden';
+    },
+    collapseLeave (el, done) {
+      // console.log('55, collapseLeave', el.scrollHeight);
+
+      if (el.scrollHeight !== 0) {
+        el.style.maxHeight = '0';
+        el.style.paddingBottom = '0';
+        el.style.paddingTop = '0';
+      }
+      // done();
+      let onTransitionDone = function () {
+        done();
+        // console.log('leave onTransitionDone');
+        el.removeEventListener('transitionend', onTransitionDone, false);
+        el.removeEventListener('transitioncancel', onTransitionDone, false);
+      };
+      // 绑定元素的transition完成事件，在transition完成后立即完成vue的过度动效
+      el.addEventListener('transitionend', onTransitionDone, false);
+      el.addEventListener('transitioncancel', onTransitionDone, false);
+    },
+    collapseAfterLeave (el) {
+      // console.log('66, collapseAfterLeave');
+      el.style.maxHeight = '';
+      el.style.overflow = this.oldOverflow;
+      el.style.paddingBottom = this.oldPaddingBottom;
+      el.style.paddingTop = this.oldPaddingTop;
+
+      this.oldOverflow = this.oldPaddingBottom = this.oldPaddingTop = '';
+    }
+  }
+};
+</script>
+
+<style lang="scss">
+.collapse-transition-enter-active,
+.collapse-transition-leave-active{
+  transition: height .3s ease-in-out, padding .3s ease-in-out, max-height .3s ease-in-out;
+}
+</style>

src/views/purchase/DemandSummary/index.vue

@@ -0,0 +1,19 @@
+<template>
+  <div id="demandSummary">
+    采购需求汇
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+  
+</style>

src/views/purchase/MaterialClassDivision/add.vue

@@ -0,0 +1,481 @@
+<template>
+  <div id="addDivision">
+    <el-form :model="basicForm" :rules="basicRules" ref="basic" label-width="auto">
+      <el-row :gutter="10">
+        <el-col :span="1.5">
+            <el-form-item label="物料分类编码">
+              <el-input :disabled="disable"  size="small" style="width: 200px" readonly v-model="basicForm.materialClassify">
+                <el-button slot="append" icon="el-icon-more" @click="chooseFourClass"></el-button>
+              </el-input>
+            </el-form-item>
+         </el-col>
+
+        <el-col :span="1.5">
+            <el-form-item label="物料分类名称">
+              <el-input
+                v-model="basicForm.materialClassifyName"
+                size="small"
+                disabled
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="一级分类编码">
+              <el-input
+                v-model="basicForm.materialClassifyOne"
+                size="small"
+                disabled
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="一级分类名称">
+              <el-input
+                v-model="basicForm.materialClassifyOneName"
+                size="small"
+                disabled
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="二级分类名称">
+              <el-input
+                v-model="basicForm.materialClassifyTwoName"
+                size="small"
+                disabled
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="三级分类名称">
+              <el-input
+                v-model="basicForm.materialClassifyThreeName"
+                size="small"
+                disabled
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="四级分类名称">
+              <el-input
+                v-model="basicForm.materialClassifyFourName"
+                size="small"
+                disabled
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="物料编码">
+              <el-input :disabled="disable" style="width: 200px" size="small" readonly v-model="basicForm.material">
+                  <el-button slot="append" icon="el-icon-more" @click="test01"></el-button>
+              </el-input>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="物料名称">
+              <el-input
+                v-model="basicForm.materialName"
+                size="small"
+                disabled
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="生产厂家">
+              <el-input
+                v-model="basicForm.manufacturer"
+                size="small"
+                :disabled="disable"
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="所属组织">
+              <el-select
+                    ref="organizations"
+                    v-model="basicForm.org"
+                    size="small"
+                    style="width: 200px"
+                    :disabled="disable"
+                    clearable
+                    @focus="chooseOrganizations"
+                  >
+                    <el-option
+                      v-for="item in organizationsOptions"
+                      :key="item.id"
+                      :label="item.label"
+                      :value="item.id"
+                    />
+                </el-select>
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="订单员">
+              <el-select
+                  ref="staffs"
+                  size="small"
+                  style="width: 200px"
+                  :disabled="disable"
+                  v-model="basicForm.orderPersonal"
+                  clearable
+                  @focus="chooseStaff"
+                >
+                  <el-option
+                    v-for="item in staffOptions"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.code"
+                  />
+              </el-select>
+            </el-form-item>
+         </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="订单部门">
+              <el-input
+                v-model="basicForm.orderDept"
+                size="small"
+                disabled
+                style="width: 200px"
+              />
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="采购员">
+              <el-select
+                  ref="staffs2"
+                  size="small"
+                  style="width: 200px"
+                  :disabled="disable"
+                  v-model="basicForm.buyer"
+                  clearable
+                  @focus="chooseStaff2"
+                >
+                  <el-option
+                    v-for="item in staff2Options"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.code"
+                  />
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="采购部门">
+              <el-input
+                v-model="basicForm.puDept"
+                size="small"
+                disabled
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="同步状态">
+              <el-input
+                v-model="basicForm.sendStatus"
+                size="small"
+                disabled
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="备注">
+              <el-input
+                v-model="basicForm.remark"
+                size="small"
+                :disabled="disable"
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+      </el-row>
+    </el-form>
+
+    <div class="btn_group">
+      <el-col :span="1.5" style="margin: 0 10px;">
+        <el-button type="primary" size="small" plain @click="save" v-if="pageStu == 'add' || pageStu == 'edit'">保存</el-button>
+      </el-col>
+      <!-- <el-col :span="1.5" style="margin: 0 10px;">
+        <el-button type="primary" size="small" plain @click="submit" v-if="pageStu == 'edit'">提交</el-button>
+      </el-col> -->
+      <el-col :span="1.5">
+        <el-button size="small" plain @click="back">返回</el-button>
+      </el-col>
+    </div>
+
+    <fourClass
+      ref="fourClass"
+      @doSubmit="acceptFourClass"
+      :single="true"
+    />
+
+    <popDialog
+      ref="contractSelect"
+      @doSubmit="selectionsToInput"
+      :single="true"
+    />
+
+    <orgs
+      ref="orgs"
+      @doSubmit="acceptOrgs"
+      :single="true"
+    />
+
+    <staff
+      ref="staff"
+      @doSubmit="acceptStaff"
+      :single="true"
+    />
+
+    <staff2
+      ref="staff2"
+      @doSubmit="acceptStaff2"
+      :single="true"
+    />
+  </div>
+</template>
+
+<script>
+import {addDivision, getDivisions, editDivision} from '@/api/purchase/basic.js'
+// 物料分类
+import fourClass from '@/components/PopDialog/fourClass.vue'
+// 调用物料分类详情接口用于数据回显
+import { getDetail } from '@/api/classify/basic';
+// 物料编码
+import popDialog from '@/components/PopDialog/index.vue'
+// 公用一个树形(组织部门传值不同)
+import orgs from '@/components/PopDialog/organization.vue'
+import staff from '@/components/PopDialog/staff.vue'
+import staff2 from '@/components/PopDialog/staff.vue'
+// 所属组织,订单员用于回显
+import { getOrgs, getStaff} from '@/api/requisition/basic'
+export default {
+  name: 'addDivision',
+  components: {
+    fourClass,
+    popDialog,
+    orgs,
+    staff,
+    staff2
+  },
+  props: ['pageStu','row', 'disable'],
+  model: {
+    prop: 'isList',
+    event: 'jugislist'
+  },
+  data() {
+    return {
+      basicForm: {
+        materialClassify: '',
+        materialClassifyName: '',
+        materialClassifyOne: '',
+        materialClassifyOneName: '',
+        materialClassifyTwoName: '',
+        materialClassifyThreeName: '',
+        materialClassifyFourName: '',
+        material: '',
+        materialName: '',
+        manufacturer: '',
+        org: '',
+        orgName: '',
+        orderPersonal: '',
+        orderPersonalName: '',
+        orderDept: '',
+        orderDeptName: '',
+        buyer: '',
+        buyerName: '',
+        puDept: '',
+        puDeptName: '',
+        sendStatus: '',
+        remark: ''
+      },
+      options: [{
+        value: 0, label: '仓库1'
+      }],
+      organizationsOptions: [],
+      staffOptions: [],
+      staff2Options: [],
+      basicRules: {}
+    }
+  },
+  mounted() {
+    if(this.pageStu == 'check') {
+      console.log('数据', this.row)
+      this.getDetails(this.row)
+    } else if(this.pageStu == 'edit') {
+      this.getDetails(this.row)
+    }
+  },
+  methods: {
+    save() {
+      if(this.pageStu == 'add') {
+        addDivision(this.basicForm).then(res => {
+          if (res.code === 200) {
+            this.$modal.msgSuccess("保存成功");
+            this.back()
+          }
+        })
+      } else if(this.pageStu == 'edit') {
+        editDivision(this.basicForm).then(res => {
+          this.$modal.msgSuccess("编辑成功");
+          this.back()
+        })
+      }
+    },
+    submit() {},
+    back() {
+      this.$emit('jugislist', true)
+      let queryParams = {
+        pageNum: 1,
+        pageSize: 10
+      }
+      this.$emit('refresh', queryParams)
+    },
+    // 如果需要回显则调用详情接口
+    getDetails(row) {
+      getDivisions(row.id).then(res => {
+        if (res.code === 200) {
+          this.basicForm = res.data
+          this.getOrgDetails(res.data.org)
+          this.getStaffDetails(res.data.orderPersonal)
+          this.getStaffDetails2(res.data.buyer)
+        }
+      })
+    },
+    // 选择物料分类
+    acceptFourClass(selections) {
+      console.log('收到的四级分类',selections)
+      this.basicForm.materialClassify = selections.code
+      this.basicForm.materialClassifyName = selections.materialType
+      this.getTreeDetails(selections.id)
+    },
+    // 物料分类显示列表
+    chooseFourClass() {
+      this.$refs.fourClass.init()
+    },
+    // 选择物料分类后需要根据id再次查询一下123级分类
+    getTreeDetails(id) {
+      getDetail(id).then(res => {
+        if (res.code === 200) {
+          this.basicForm.materialClassifyOneName = res.data.oneClass
+          this.basicForm.materialClassifyTwoName = res.data.twoClass
+          this.basicForm.materialClassifyThreeName = res.data.threeClass
+          this.basicForm.materialClassifyFourName = res.data.fourClass
+        }
+      })
+    },
+    selectionsToInput (selections) {
+      console.log('父组件拿到的：', selections)
+      this.selectData = selections
+      this.basicForm.material = selections[0].code
+      this.basicForm.materialName = selections[0].name
+    },
+    // 显示物料编码列表
+    test01() {
+      console.log('测试点击')
+      this.$refs.contractSelect.init()
+    },
+    // 选择默认采购组织
+    acceptOrgs (selections) {
+      console.log('接收的采购组织', selections)
+      this.basicForm.org = selections.id
+      this.getOrgDetails(selections.id)
+    },
+    // 默认采购组织显示列表
+    chooseOrganizations () {
+      this.$refs.organizations.blur()
+      this.$refs.orgs.init('1')
+    },
+    // 采购组织回显
+    getOrgDetails(id) {
+      getOrgs({deptId: id}).then(res => {
+        if (res.code === 200) {
+          this.organizationsOptions = res.data
+        }
+      })
+    },
+    // 选择订单员
+    acceptStaff (selections) {
+      this.staffOptions = selections
+      this.basicForm.orderPersonal = selections[0].code
+      this.getStaffDetails(selections[0].id)
+    },
+    // 订单员显示列表
+    chooseStaff () {
+      this.$refs.staffs.blur()
+      this.$refs.staff.init()
+    },
+    // 订单员回显
+    getStaffDetails(id) {
+      getStaff({id:id}).then(res => {
+        console.log('订单员', res)
+        if (res.code === 200 ) {
+          this.staffOptions = res.data.tableBody
+        }
+      })
+    },
+    // 选择采购员
+    acceptStaff2 (selections) {
+      this.staff2Options = selections
+      this.basicForm.buyer = selections[0].code
+      this.getStaffDetails2(selections[0].id)
+    },
+    // 采购员显示列表
+    chooseStaff2 () {
+      this.$refs.staffs2.blur()
+      this.$refs.staff2.init()
+    },
+    // 采购员回显
+    getStaffDetails2(id) {
+      getStaff({id:id}).then(res => {
+        console.log('采购员', res)
+        if (res.code === 200 ) {
+          this.staff2Options = res.data.tableBody
+        }
+      })
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.btn_group {
+  width: 100%;
+  margin: 20px 0;
+  display: flex;
+  justify-content: center;
+} 
+</style>

src/views/purchase/MaterialClassDivision/index.vue

@@ -0,0 +1,397 @@
+<template>
+  <div id="MaterialClassDivision">
+    <div v-if="isList">
+      <el-form class="search_area" label-width="auto">
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="物料一级大类编码">
+              <el-select v-model="queryParams.materialClassifyOne" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="物料一级大类名称">
+              <el-select v-model="queryParams.materialClassifyOneName" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="物料二级大类编码">
+              <el-select v-model="queryParams.materialClassifyTwo" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="物料二级大类名称">
+              <el-select v-model="queryParams.materialClassifyTwoName" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="" label-width="20px">
+              <el-button type="primary" size="small" icon="el-icon-search" plain>搜索</el-button>
+              <el-button size="small" icon="el-icon-refresh" plain>重置</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <CollapseTransition>
+          <div v-show="expanded">
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="物料三级大类编码">
+              <el-select v-model="queryParams.materialClassifyThree" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="物料三级大类名称">
+              <el-select v-model="queryParams.materialClassifyThreeName" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="物料四级大类编码">
+              <el-select v-model="queryParams.materialClassifyFour" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="物料四级大类名称">
+              <el-select v-model="queryParams.materialClassifyFourName" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="物料编码">
+              <el-select v-model="queryParams.material" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="物料名称">
+              <el-select v-model="queryParams.materialName" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="订单员">
+              <el-select v-model="queryParams.orderPersonal" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="采购员">
+              <el-select v-model="queryParams.buyer" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="生产厂家">
+            <el-input
+              v-model="queryParams.manufacturer"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="备注">
+            <el-input
+              v-model="queryParams.remark"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        </div>
+      </CollapseTransition>
+      </el-form>
+      <el-divider class="lines"><i style="cursor: pointer;" :class="expanded?'el-icon-arrow-up':'el-icon-arrow-down'" @click="drop"></i></el-divider>
+
+      <el-card>
+        <div class="btn_grooup">
+          <el-button type="primary" size="small" @click="addDivision">新增</el-button>
+
+          <el-dropdown size="small" @command="handleCommand">
+            <el-button size="small" type="primary" style="margin-left: 10px;">
+              导入<i class="el-icon-arrow-down el-icon--right"></i>
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item command="数据导入">数据导入</el-dropdown-item>
+              <el-dropdown-item command="模板下载">模板下载</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+
+          <el-dropdown size="small" @command="handleCommand">
+            <el-button size="small" type="primary" style="margin: 0 10px;">
+              导出<i class="el-icon-arrow-down el-icon--right"></i>
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item command="Excel导出">Excel导出</el-dropdown-item>
+              <el-dropdown-item command="导出明细">导出明细</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+
+          <el-button type="primary" size="small">同步分配</el-button>
+          <el-button type="primary" size="small">删除</el-button>
+          <el-button type="primary" size="small">打印</el-button>
+        </div>
+        <el-table 
+          :data="tableList" 
+          fit
+          max-height="680"
+          @selection-change="handleSelectionChange"
+        >
+          <el-table-column type="selection" width="55" />
+          <el-table-column label="物料分类编码" align="center" prop="materialClassify"/>
+          <el-table-column label="物料分类名称" align="center" width="200" prop="materialClassifyName" />
+          <el-table-column label="一级分类名称" align="center" prop="materialClassifyOneName" />
+          <el-table-column label="二级分类名称" align="center" width="150" prop="materialClassifyTwoName" />
+          <el-table-column label="三级分类名称" align="center" width="150" prop="materialClassifyThreeName"/>
+          <el-table-column label="四级分类名称" align="center" width="150" prop="materialClassifyFourName" />
+          <el-table-column label="物料编码" align="center" width="150" prop="material" />
+          <el-table-column label="物料名称" align="center" prop="materialName" />
+          <el-table-column label="生产厂商" align="center" width="150" prop="manufacturer" />
+          <el-table-column label="所属组织" align="center" width="120" prop="orgName" />
+          <el-table-column label="订单员" align="center" width="150" prop="orderPersonalName" />
+          <el-table-column label="采购员" align="center" width="150" prop="buyerName" />
+          <el-table-column label="订单部门" align="center" width="150" prop="orderDeptName" />
+          <el-table-column label="部门" align="center" width="150" prop="puDeptName" />
+          <el-table-column label="创建人" align="center" width="150" prop="createdByName" />
+          <el-table-column label="创建时间" align="center" width="150" prop="createdTime" />
+          <el-table-column label="修改人" align="center" width="150" prop="updatedByName" />
+          <el-table-column label="修改时间" align="center" width="150" prop="updatedTime" />
+          <el-table-column
+          fixed="right"
+          label="操作"
+          align="center"
+          width="150"
+          >
+          <template slot-scope="scope">
+            <el-button type="text" size="small" @click="check(scope.row)">查看</el-button>
+            <el-button type="text" size="small" @click="edit(scope.row)">编辑</el-button>
+            <el-button type="text" size="small" @click="deleteids(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+        </el-table>
+
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="1"
+          :page-sizes="[5, 10, 15, 20]"
+          :page-size="100"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total=total>
+        </el-pagination>
+      </el-card>
+    </div>
+
+    <Add v-model="isList" v-if="!isList" :pageStu="page" :disable="disable" :row="rowDetail" @refresh="getList"/>
+  </div>
+</template>
+
+<script>
+import Add from './add.vue'
+import CollapseTransition from '@/components/MyCollapse/collapse.vue'
+import {getDivisionList, delDivision} from '@/api/purchase/basic.js'
+export default {
+  name: 'MaterialClassDivision',
+  components: {
+    Add,
+    CollapseTransition
+  },
+  data() {
+    return {
+      expanded: false,
+      // 页面配置
+      isList: true,
+      // 页面状态
+      page: '',
+      queryParams: {
+        materialClassifyOne: '',
+        materialClassifyOneName: '',
+        materialClassifyTwo: '',
+        materialClassifyTwoName: '',
+        materialClassifyThree: '',
+        materialClassifyThreeName: '',
+        materialClassifyFour: '',
+        materialClassifyFourName: '',
+        material: '',
+        materialName: '',
+        orderPersonal: '',
+        buyer: '',
+        manufacturer: '',
+        remark: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      options: [{
+        value: 0, label: '仓库1'
+      }],
+      tableList: [],
+      total: 0,
+      rowDetail: {},
+      disable: false
+    }
+  },
+  created() {
+    this.getList(this.queryParams)
+  },
+  methods: {
+    getList(params){
+      getDivisionList(params).then(res => {
+        if (res.code === 200) {
+          this.tableList = res.rows
+          this.total = res.total
+        }
+      })
+    },
+    handleSelectionChange() {},
+    handleCommand(command) {
+      alert(command)
+    },
+    addDivision() {
+      this.isList = false
+      this.page = 'add'
+      this.disable = false
+    },
+    check(row) {
+      this.isList = false
+      this.page = 'check'
+      this.rowDetail = row
+      this.disable = true
+    },
+    edit(row) {
+      this.isList = false
+      this.page = 'edit'
+      this.rowDetail = row
+      this.disable = false
+    },
+    deleteids(row) {
+      console.log('row', row)
+      this.$modal.confirm('确认信息').then(() => {
+        delDivision(row.id).then(res => {
+          if (res.code === 200) {
+            this.$modal.msgSuccess("删除成功");
+            this.getList(this.queryParams)
+          }
+        })
+        }).catch(() => {})
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+      this.queryParams.pageSize = val
+      this.getList(this.queryParams)
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+      this.queryParams.pageNum = val
+      this.getList(this.queryParams)
+    },
+    drop() {
+      this.expanded = !this.expanded
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+#MaterialClassDivision {
+  height: calc(100vh - 84px);
+  padding: 12px;
+  box-sizing: border-box;
+}
+.btn_grooup {
+  margin-bottom: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
+.lines {
+  margin-top: 0;
+}
+</style>

src/views/purchase/PurchaseDemandList/add.vue

@@ -0,0 +1,706 @@
+<template>
+  <div id="addDemandList">
+    <span>基本信息</span>
+    <el-form :model="basicForm" :rules="basicRules" ref="basic" label-width="auto">
+      <el-row :gutter="10">
+        <el-col :span="1.5">
+            <el-form-item label="编码">
+              <el-input
+                v-model="basicForm.code"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+        <el-col :span="1.5">
+            <el-form-item label="组织">
+              <el-input
+                v-model="basicForm.org"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="需求处理方式">
+              <el-select v-model="basicForm.demandBusinessType" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="单据状态">
+              <el-select v-model="basicForm.status" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="需求客户">
+              <el-select v-model="basicForm.customer" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="需求客户名称">
+              <el-select v-model="basicForm.customerName" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="客户负责人">
+              <el-select v-model="basicForm.customerPrincipal" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="需求人员">
+              <el-select v-model="basicForm.demandPersonal" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="需求部门">
+              <el-select v-model="basicForm.demandDept" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="需求日期">
+              <el-input
+                v-model="basicForm.demandDate"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="单据来源">
+              <el-input
+                v-model="basicForm.source"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="供应仓库">
+              <el-input
+                v-model="basicForm.warehouse"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="供应货位">
+              <el-select v-model="basicForm.goodsAllocation" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="业务类型">
+              <el-select v-model="basicForm.billType" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="是否特殊需求">
+              <el-input
+                v-model="basicForm.isSpeical"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="是否处理需求">
+              <el-input
+                v-model="basicForm.isProcess"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="是否月销量计算">
+              <el-input
+                v-model="basicForm.isMonthleyCalculate"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="备注">
+              <el-input
+                v-model="basicForm.remark"
+                size="small"
+                placeholder=""
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+      </el-row>
+    
+
+    <span>明细信息</span>
+    <el-card>
+      <div class="btn_grooup">
+        <el-button type="primary" size="small" @click="addLine">增行</el-button>
+        <el-button type="primary" size="small" >批量调整</el-button>
+      </div>
+
+      <el-table 
+          :data="basicForm.puDemandItemList" 
+          fit
+          max-height="680"
+          @selection-change="handleSelectionChange"
+        >
+          <el-table-column type="selection"/>
+          <el-table-column label="序号" type="index" align="center"/>
+          <el-table-column label="行状态" align="center" prop="status" />
+          <el-table-column label="行号" align="center" >
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.index"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="一级品类" align="center" width="150">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.materialClassifyOneName"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="二级品类" align="center" width="150" prop="materialClassifyTwoName">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.materialClassifyTwoName"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="三级品类" align="center" width="150" prop="materialClassifyThreeName">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.materialClassifyThreeName"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="四级品类" align="center" width="150" prop="materialClassifyFourName">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.materialClassifyFourName"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="采购员名称" align="center" prop="buyerName" />
+          <el-table-column label="采购员" align="center" width="150" prop="buyer" />
+          <el-table-column label="物料编码" align="center" width="120" prop="material">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.material"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="物料名称" align="center" width="150" prop="materialName" />
+          <el-table-column label="规格" align="center" width="150" prop="specification" />
+          <el-table-column label="单位" align="center" width="150" prop="unit	" />
+          <el-table-column label="生产厂家/代理人" align="center" width="150" prop="registrant" />
+          <el-table-column label="注册人" align="center" width="150" prop="registrant" />
+          <el-table-column label="采购周期" align="center" width="150" prop="puPeriod">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.puPeriod"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="有效期单位" align="center" width="150" prop="expiryUnit" />
+          <el-table-column label="有效期" align="center" width="150" prop="updateTime" />
+          <el-table-column label="最小包装" align="center" width="150" prop="minPackage" />
+          <el-table-column label="最小订货量" align="center" width="150" prop="minOrderQty" />
+          <el-table-column label="最小批量" align="center" width="150" prop="minBatch	" />
+          <el-table-column label="安全库存" align="center" width="150" prop="safeStock	">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.safeStock"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="月均销量" align="center" width="150" prop="averageQtyMonth" />
+          <el-table-column label="实际(业务)需求量" align="center" width="150" prop="qty">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.qty"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="需求可用周期" align="center" width="150" prop="demandPeriod" />
+          <el-table-column label="集团预测分类" align="center" width="150" prop="forecastClassify" />
+          <el-table-column label="交货日期" align="center" width="150" prop="deliveryDate">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.deliveryDate"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="补单标识" align="center" width="150" prop="isReplenishment">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.isReplenishment"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="批号锁定标识" align="center" width="150" prop="isBatchLock">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.isBatchLock"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="业务备注" align="center" width="150" prop="remark">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.remark"/>
+              </el-form-item>
+            </template>
+          </el-table-column> 
+          <el-table-column label="采购备注" align="center" width="150" prop="puRemark" />
+          <el-table-column label="末级供应仓库存量" align="center" width="150" prop="lastWarehouseQty" />
+          <!-- <el-table-column label="调拨占有量" align="center" width="150" prop="superiorAllotQty"></el-table-column> -->
+          <el-table-column label="最终净需求量" align="center" width="150" prop="resDemandQty">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.resDemandQty"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="末级供应仓库" align="center" width="150" prop="lastWarehouseName">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.lastWarehouseName"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="收货仓库" align="center" width="150" prop="deliveryWarehouseName">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.deliveryWarehouseName"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="末级供应货位" align="center" width="150" prop="lastAllocationName">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.lastAllocationName"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="收货货位编码" align="center" width="150" prop="deliveryAllocation" />
+          <el-table-column label="收货货位" align="center" width="150" prop="deliveryAllocationName">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.deliveryAllocationName"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="紧急标识" align="center" width="150" prop="isUrgency">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.isUrgency"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="默认采购组织" align="center" width="150" prop="purOrgName" />
+          <el-table-column label="默认采购组织编码" align="center" width="150" prop="puOrg" />
+          <el-table-column label="末级供应调拨待入量" align="center" width="150" prop="lastStockQty">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.lastStockQty"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="上级供应中心现存量" align="center" width="150" prop="superiorCenterQty" />
+          <el-table-column label="上级库存被调拨占用量" align="center" width="150" prop="superiorAllotQty" />
+          <el-table-column label="可用量" align="center" width="150" prop="availableQty" />
+          <el-table-column label="调拨状态" align="center" width="150" prop="statusAllot">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.statusAllot"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="补单供应商编码" align="center" width="150" prop="additionalSupplier">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.additionalSupplier"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="补单供应商名称" align="center" width="150" prop="additionalSupplierCode">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.additionalSupplierCode"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="周期单位" align="center" width="150" prop="periodUnit">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.periodUnit"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <el-table-column label="需求客户" align="center" width="150" prop="customer">
+            <template slot-scope="scope">
+              <el-form-item class="hang">
+                <el-input v-model="scope.row.customer"/>
+              </el-form-item>
+            </template>
+          </el-table-column>
+          <!-- <el-table-column label="末级供应库存组织" align="center" width="150" prop="updateTime"></el-table-column> -->
+          <!-- <el-table-column label="上级供应中心库存组织" align="center" width="150" prop="updateTime"></el-table-column> -->
+          <!-- <el-table-column label="调拨单号" align="center" width="150" prop="updateTime"></el-table-column> -->
+          <!-- <el-table-column label="收货地址" align="center" width="150" prop="updateTime"></el-table-column> -->
+          <!-- <el-table-column label="收货地址编码" align="center" width="150" prop="updateTime" /> -->
+          <el-table-column label="联系人" align="center" width="150" prop="contacts" />
+          <!-- <el-table-column label="联系人电话" align="center" width="150" prop="updateTime" /> -->
+          <!-- <el-table-column label="详细地址" align="center" width="150" prop="updateTime" /> -->
+          <!-- <el-table-column label="价格类型" align="center" width="150" prop="updateTime"></el-table-column> -->
+          <el-table-column
+          fixed="right"
+          label="操作"
+          align="center"
+          width="150"
+          >
+          <template slot-scope="scope">
+            <el-button type="text" size="small" @click="delLine(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+  </el-form>
+
+    <div class="btn_group">
+      <el-col :span="1.5" style="margin: 0 10px;">
+        <el-button type="primary" size="small" plain @click="save" v-if="pageStu == 'add' || pageStu == 'edit'">保存</el-button>
+      </el-col>
+      <!-- <el-col :span="1.5" style="margin: 0 10px;">
+        <el-button type="primary" size="small" plain @click="submit" v-if="pageStu == 'edit'">提交</el-button>
+      </el-col> -->
+      <el-col :span="1.5">
+        <el-button size="small" plain @click="back">返回</el-button>
+      </el-col>
+    </div>
+  </div>
+</template>
+
+<script>
+import {addDemand,getDemandDetail, getDemandSonDetail, editDemand} from '@/api/purchase/purchaseDemand.js'
+export default {
+  name: 'addDemandList',
+  props: ['pageStu','row', 'disable'],
+  model: {
+    prop: 'isList',
+    event: 'jugislist'
+  },
+  data() {
+    return {
+      basicForm: {
+        code: '',
+        org: '',
+        demandBusinessType: '',
+        status: '',
+        customer: '',
+        customerName: '',
+        customerPrincipal: '',
+        demandPersonal: '',
+        demandDept: '',
+        demandDate: '',
+        source: '',
+        warehouse: '',
+        goodsAllocation: '',
+        billType: '',
+        isSpeical: '',
+        isProcess: '',
+        isMonthleyCalculate: '',
+        remark: '',
+        puDemandItemList: []
+      },
+      options: [{
+        value: '1', label: '是',
+      }, {
+        value: '0', label: '否'
+      }],
+      basicRules: {},
+      tableList: []
+    }
+  },
+  created() {
+    if(this.pageStu == 'check') {
+      console.log('数据', this.row)
+      this.getDetails(this.row)
+    } else if(this.pageStu == 'edit') {
+      this.getDetails(this.row)
+    }
+  },
+  methods: {
+    save() {
+      if(this.pageStu == 'add') {
+        addDemand(this.basicForm).then(res => {
+          if (res.code === 200) {
+            this.$modal.msgSuccess("保存成功");
+            this.back()
+          }
+        })
+      } else if (this.pageStu == 'edit') {
+        editDemand(this.basicForm).then(res => {
+          if (res.code === 200) {
+            this.$modal.msgSuccess("编辑成功");
+            this.back()
+          }
+        })
+      }
+    },
+    submit() {},
+    // 增行
+    addLine() {
+      const newLine = {
+        contacts: null,
+        id: null,
+        demandId: null,
+        status: null,
+        businessDept: null,
+        businessDeptName: null,
+        materialCategory: null,
+        buyer: null,
+        buyerName: null,
+        mateiralClassifyOne: null,
+        materialClassifyOneName: null,
+        materialClassifyTwo: null,
+        materialClassifyTwoName: null,
+        materialClassifyThree: null,
+        materialClassifyThreeName: null,
+        materialClassifyFour: null,
+        materialClassifyFourName: null,
+        material: null,
+        materialName: null,
+        specification: null,
+        unit: null,
+        registrant: null,
+        puPeriod: null,
+        expiryUnit: null,
+        minPackage: null,
+        minOrderQty: null,
+        minBatch: null,
+        safeStock: null,
+        averageQtyMonth: null,
+        qty: null,
+        adjustmentPersonal: null,
+        adjustmentTime: null,
+        manualRegulation: null,
+        updateCause: null,
+        reservedProportion: null,
+        reservedPeriod: null,
+        reservedQty: null,
+        demandPeriod: null,
+        forecastClassify: null,
+        deliveryDate: null,
+        isUrgency: null,
+        isReplenishment: null,
+        isBatchLock: null,
+        remark: null,
+        puRemark: null,
+        lastWarehouseQty: null,
+        resDemandQty: null,
+        lastWarehouse: null,
+        lastWarehouseName: null,
+        deliveryWarehouse: null,
+        deliveryWarehouseName: null,
+        lastAllocation: null,
+        lastAllocationName: null,
+        deliveryAllocation: null,
+        deliveryAllocationName: null,
+        passageOn: null,
+        puOrg: null,
+        purOrgName: null,
+        lastStockQty: null,
+        superiorCenterQty: null,
+        superiorAllotQty: null,
+        availableQty: null,
+        statusAllot: null,
+        additionalSupplier: null,
+        additionalSupplierCode: null,
+        periodUnit: null,
+        demandCustomer: null,
+        demandCustomerName: null,
+        lastStockOrg: null,
+        lastStockOrgName: null,
+        superiorStockOrg: null,
+        superiorStockOrgName: null,
+        allotCode: null,
+        deliveryAddress: null,
+        deliveryAddressName: null,
+        contacts: null,
+        contactsPhone: null,
+        address: null,
+        source: null,
+        priceType: null,
+        puManagerApprover: null,
+        puManagerApproverName: null,
+        processTime: null,
+        affirmer: null,
+        tenantId: null,
+        revision: null,
+        createBy: null,
+        createByName: null,
+        createTime: null,
+        updateBy: null,
+        updateByName: null,
+        updateTime: null,
+        delFlag: null
+      }
+      this.basicForm.puDemandItemList.push(newLine)
+    },
+    delLine(row) {
+      console.log('删除行:', row)
+      this.basicForm.puDemandItemList = this.basicForm.puDemandItemList.filter(item => {
+        return item.id !== row.id
+      })
+    },
+    back() {
+      this.$emit('jugislist', true)
+      let queryParams = {
+        pageNum: 1,
+        pageSize: 10
+      }
+      this.$emit('refresh', queryParams)
+    },
+    // 如果需要回显则调用详情接口
+    getDetails(row) {
+      getDemandDetail(row.id).then(res => {
+        if (res.code === 200) {
+          // this.basicForm = res.data
+          let reciveForm = res.data
+          let params = {...{id: row.id}, ...{pageNum:1, pageSize: 10}}
+          getDemandSonDetail(params).then(res => {
+            if (res.code === 200) {
+              reciveForm.puDemandItemList = res.rows
+              console.log('reciveForm',reciveForm)
+              this.basicForm = reciveForm
+            }
+          })
+        }
+      })
+    },
+    handleSelectionChange() {},
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.btn_group {
+  width: 100%;
+  margin: 20px 0;
+  display: flex;
+  justify-content: center;
+} 
+.btn_grooup {
+  margin-bottom: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
+.hang {
+  margin: auto;
+}
+.hang ::v-deep .el-form-item__content{
+  margin-left: 0px !important;
+}
+</style>

src/views/purchase/PurchaseDemandList/index.vue

@@ -0,0 +1,405 @@
+<template>
+  <div id="PurchaseDemandList">
+    <div v-if="isList">
+      <el-form class="search_area" label-width="auto">
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="单据编码">
+              <el-select v-model="queryParams.code" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="供应仓库">
+              <el-select v-model="queryParams.warehouse" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="需求客户">
+              <el-select v-model="queryParams.customer" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="是否已处理需求">
+              <el-select v-model="queryParams.isProcess" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="" label-width="20px">
+              <el-button type="primary" size="small" icon="el-icon-search" plain>搜索</el-button>
+              <el-button size="small" icon="el-icon-refresh" plain>重置</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      <CollapseTransition>
+        <div v-show="expanded">
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="单据类型">
+              <el-select v-model="queryParams.threeName" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="需求人员">
+              <el-select v-model="queryParams.demandPersonal" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="供应货位">
+              <el-select v-model="queryParams.goodsAllocation" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="单据来源">
+              <el-select v-model="queryParams.source" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="业务类型">
+              <el-select v-model="queryParams.billType" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="需求部门">
+              <el-select v-model="queryParams.demandDept" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="需求日期">
+            <el-input
+              v-model="queryParams.demandDate"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="备注">
+            <el-input
+              v-model="queryParams.remark"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        </div>
+      </CollapseTransition>
+      </el-form>
+      <el-divider class="lines"><i style="cursor: pointer;" :class="expanded?'el-icon-arrow-up':'el-icon-arrow-down'" @click="drop"></i></el-divider>
+
+      <el-card>
+        <div class="btn_grooup">
+          <el-button type="primary" size="small" @click="addDivision">新增</el-button>
+
+          <el-dropdown size="small" @command="handleCommand">
+            <el-button size="small" type="primary" style="margin-left: 10px;">
+              导入<i class="el-icon-arrow-down el-icon--right"></i>
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item command="数据导入">数据导入</el-dropdown-item>
+              <el-dropdown-item command="模板下载">模板下载</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+
+          <el-dropdown size="small" @command="handleCommand">
+            <el-button size="small" type="primary" style="margin: 0 10px;">
+              导出<i class="el-icon-arrow-down el-icon--right"></i>
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item command="Excel导出">Excel导出</el-dropdown-item>
+              <el-dropdown-item command="导出明细">导出明细</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+
+          <el-button type="primary" size="small" @click="delItems">删除</el-button>
+          <el-button type="primary" size="small">打印</el-button>
+        </div>
+        <el-table 
+          :data="tableList" 
+          fit
+          max-height="680"
+          @selection-change="handleSelectionChange"
+        >
+          <el-table-column type="selection" width="55" />
+          <el-table-column label="编码" align="center" prop="code"/>
+          <el-table-column label="需求日期" align="center" width="200" prop="demandDate" />
+          <el-table-column label="单据状态" align="center" prop="status" />
+          <el-table-column label="是否已处理需求" align="center" width="150" prop="isProcess" />
+          <el-table-column label="业务类型" align="center" width="150" prop="billType"/>
+          <el-table-column label="是否特殊需求" align="center" width="150" prop="isSpeical" />
+          <el-table-column label="需求人员" align="center" width="150" prop="demandPersonalName" />
+          <el-table-column label="需求客户" align="center" prop="customerName" />
+          <el-table-column label="需求部门" align="center" width="150" prop="demandDeptName" />
+          <el-table-column label="供应仓库" align="center" width="120" prop="warehouseName" />
+          <el-table-column label="供应货位" align="center" width="150" prop="goodsAllocationName" />
+          <el-table-column label="单据来源" align="center" width="150" prop="source" />
+          <el-table-column label="组织" align="center" width="150" prop="orgName" />
+          <el-table-column label="备注" align="center" width="150" prop="remark" />
+          <el-table-column
+          fixed="right"
+          label="操作"
+          align="center"
+          width="150"
+          >
+          <template slot-scope="scope">
+            <el-button type="text" size="small" @click="check(scope.row)">查看</el-button>
+            <el-button type="text" size="small" @click="edit(scope.row)">编辑</el-button>
+            <el-button type="text" size="small" @click="deleteids(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+        </el-table>
+
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="1"
+          :page-sizes="[5, 10, 15, 20]"
+          :page-size="100"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total=total>
+        </el-pagination>
+      </el-card>
+    </div>
+
+    <Add v-model="isList" v-if="!isList" :pageStu="page" :disable="disable" :row="rowDetail" @refresh="getList"/>
+  </div>
+</template>
+
+<script>
+import Add from './add.vue'
+import CollapseTransition from '@/components/MyCollapse/collapse.vue'
+import {getDemandList, delDemand, downLoadDemand} from '@/api/purchase/purchaseDemand.js'
+export default {
+  name: 'PurchaseDemandList',
+  components: {
+    Add,
+    CollapseTransition
+  },
+  data() {
+    return {
+      expanded: false,
+      // 页面配置
+      isList: true,
+      // 页面状态
+      page: '',
+      queryParams: {
+        code: '',
+        warehouse: '',
+        customer: '',
+        isProcess: '',
+        threeName: '',
+        demandPersonal: '',
+        goodsAllocation: '',
+        source: '',
+        billType: '',
+        demandDept: '',
+        demandDate: '',
+        remark: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      options: [{
+        value: '1', label: '是',
+      }, {
+        value: '0', label: '否'
+      }],
+      tableList: [],
+      total: 0,
+      rowDetail: {},
+      disable: false,
+      ids: []
+    }
+  },
+  created() {
+    this.getList(this.queryParams)
+  },
+  methods: {
+    getList(params){
+      getDemandList(params).then(res => {
+        if (res.code === 200) {
+          this.tableList = res.rows
+          this.total = res.total
+        }
+      })
+    },
+    handleSelectionChange(selection) {
+      console.log('选中', selection)
+      this.ids = selection.map(item => item.id)
+      console.log('选中数组', this.ids.join())
+    },
+    handleCommand(command) {
+      // alert(command)
+      if(command == '模板下载') {
+        downLoadDemand({}).then(res => {
+          console.log('下载的文件流', res)
+          const blob = new Blob([res], {
+            type: "application/vnd.ms-excel;charset=UTF-8",
+          });// 创建一个类文件对象：Blob对象表示一个不可变的、原始数据的类文件对象
+          const downloadElement = document.createElement("a"); //创建a标签
+          const href = window.URL.createObjectURL(blob); // 创建下载的链接
+          // var temp = res.headers["content-disposition"]; 
+          // var fileName = decodeURIComponent(temp.split("filename=")[1]); // 中文需要转码 (前端乱码）
+          // var name = fileName.split(";")[0]; //切割成文件名
+          downloadElement.href = href;  //下载地址
+          downloadElement.download = '模板'; // 下载后文件名
+          document.body.appendChild(downloadElement);
+          downloadElement.click(); // 点击下载
+          document.body.removeChild(downloadElement); // 下载完成移除元素
+          window.URL.revokeObjectURL(href); // 释放blob对象
+        })
+      }
+    },
+    addDivision() {
+      this.isList = false
+      this.page = 'add'
+      this.disable = false
+    },
+    check(row) {
+      this.isList = false
+      this.page = 'check'
+      this.rowDetail = row
+      this.disable = true
+    },
+    edit(row) {
+      this.isList = false
+      this.page = 'edit'
+      this.rowDetail = row
+      this.disable = false
+    },
+    // 行内删除
+    deleteids(row) {
+      console.log('row', row)
+      this.$modal.confirm('确认信息').then(() => {
+        delDemand(row.id).then(res => {
+          if (res.code === 200) {
+            this.$modal.msgSuccess("删除成功");
+            this.getList(this.queryParams)
+          }
+        })
+        }).catch(() => {})
+    },
+    // 批量删除按钮
+    delItems() {
+      if(this.ids.length == 0) {
+        this.$modal.msgWarning("请选中至少一条数据");
+      } else {
+        let param = this.ids.join()
+        this.$modal.confirm('确认信息').then(() => {
+        delDemand(param).then(res => {
+          if (res.code === 200) {
+            this.$modal.msgSuccess("删除成功");
+            this.getList(this.queryParams)
+          }
+        })
+        }).catch(() => {})
+      }
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+      this.queryParams.pageSize = val
+      this.getList(this.queryParams)
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+      this.queryParams.pageNum = val
+      this.getList(this.queryParams)
+    },
+    drop() {
+      this.expanded = !this.expanded
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+#PurchaseDemandList {
+  height: calc(100vh - 84px);
+  padding: 12px;
+  box-sizing: border-box;
+}
+.btn_grooup {
+  margin-bottom: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
+.lines {
+  margin-top: 0;
+}
+</style>

src/views/purchase/deliveryAddress/add.vue

@@ -0,0 +1,246 @@
+<template>
+  <div id="addAddress">
+    <el-form :model="basicForm" :rules="basicRules" ref="basic" label-width="auto">
+      <el-row :gutter="10">
+        <el-col :span="1.5">
+            <el-form-item label="收货仓库编码">
+              <el-input
+                v-model="basicForm.code"
+                size="small"
+                disabled
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+        <el-col :span="1.5">
+            <el-form-item label="收货仓库名称">
+              <el-input
+                v-model="basicForm.name"
+                size="small"
+                :disabled="disable"
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+        <el-col :span="1.5">
+            <el-form-item label="仓库档案名称">
+              <el-input
+                v-model="basicForm.warehouseCode"
+                size="small"
+                :disabled="disable"
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="仓库属性">
+              <el-select v-model="basicForm.warehouseProperty" size="small" style="width: 200px" clearable :disabled="disable">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="地址信息">
+              <el-input
+                v-model="basicForm.address"
+                size="small"
+                :disabled="disable"
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="联系人">
+              <el-input
+                v-model="basicForm.contactsName"
+                size="small"
+                :disabled="disable"
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="联系人电话">
+              <el-input
+                v-model="basicForm.contactsPhone"
+                size="small"
+                :disabled="disable"
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="物料分类">
+              <el-input
+                v-model="basicForm.materialClassify"
+                size="small"
+                :disabled="disable"
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="启用">
+              <el-select v-model="basicForm.status" size="small" style="width: 200px" clearable :disabled="disable">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+         <el-col :span="1.5">
+            <el-form-item label="同步状态">
+              <el-select v-model="basicForm.sendStatus" size="small" style="width: 200px" clearable :disabled="disable">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="备注">
+              <el-input
+                v-model="basicForm.remark"
+                size="small"
+                :disabled="disable"
+                clearable
+                style="width: 200px"
+              />
+            </el-form-item>
+         </el-col>
+
+      </el-row>
+    </el-form>
+
+    <div class="btn_group">
+      <el-col :span="1.5" style="margin: 0 10px;">
+        <el-button type="primary" size="small" plain @click="save" v-if="pageStu == 'add' || pageStu == 'edit'">保存</el-button>
+      </el-col>
+      <!-- <el-col :span="1.5" style="margin: 0 10px;">
+        <el-button type="primary" size="small" plain @click="submit" v-if="pageStu == 'edit'">提交</el-button>
+      </el-col> -->
+      <el-col :span="1.5">
+        <el-button size="small" plain @click="back">返回</el-button>
+      </el-col>
+    </div>
+  </div>
+</template>
+
+<script>
+import {addAddress, getAddressDetail, editAddress} from '@/api/purchase/deliveryAddress.js'
+export default {
+  name: 'addAddress',
+  props: ['pageStu','row', 'disable'],
+  model: {
+    prop: 'isList',
+    event: 'jugislist'
+  },
+  data() {
+    return {
+      basicForm: {
+        code: '',
+        name: '',
+        warehouse: '',
+        warehouseCode: '',
+        warehouseProperty: '',
+        address: '',
+        contacts: '',
+        contactsName: '',
+        contactsPhone: '',
+        materialClassify: '',
+        materialClassifyName: '',
+        status: '',
+        sendStatus: '',
+        remark: '',
+      },
+      options: [{
+        value: '1', label: '是',
+      }, {
+        value: '0', label: '否'
+      }],
+      basicRules: {}
+    }
+  },
+  mounted() {
+    if(this.pageStu == 'check') {
+      console.log('数据', this.row)
+      this.getDetails(this.row)
+    } else if(this.pageStu == 'edit') {
+      this.getDetails(this.row)
+    }
+  },
+  methods: {
+    save() {
+      if(this.pageStu == 'add') {
+        addAddress(this.basicForm).then(res => {
+          if (res.code === 200) {
+            this.$modal.msgSuccess("保存成功");
+            this.back()
+          }
+        })
+      } else if (this.pageStu == 'edit') {
+        editAddress(this.basicForm).then(res => {
+          if (res.code === 200) {
+            this.$modal.msgSuccess("编辑成功");
+            this.back()
+          }
+        })
+      }
+    },
+    submit() {},
+    back() {
+      this.$emit('jugislist', true)
+      let queryParams = {
+        pageNum: 1,
+        pageSize: 10
+      }
+      this.$emit('refresh', queryParams)
+    },
+    // 如果需要回显则调用详情接口
+    getDetails(row) {
+      getAddressDetail(row.id).then(res => {
+        if (res.code === 200) {
+          this.basicForm = res.data
+        }
+      })
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.btn_group {
+  width: 100%;
+  margin: 20px 0;
+  display: flex;
+  justify-content: center;
+} 
+</style>

src/views/purchase/deliveryAddress/index.vue

@@ -0,0 +1,358 @@
+<template>
+  <div id="deliveryAddressList">
+    <div v-if="isList">
+      <el-form class="search_area" label-width="auto">
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="仓库属性">
+              <el-select v-model="queryParams.warehouseProperty" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="仓库档案名称">
+              <el-select v-model="queryParams.warehouseCode" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="收货仓库编码">
+              <el-input
+              v-model="queryParams.code"
+              size="small"
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="收货仓库名称">
+              <el-input
+              v-model="queryParams.name"
+              size="small"
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+          <el-col :span="1.5">
+            <el-form-item label="" label-width="20px">
+              <el-button type="primary" size="small" icon="el-icon-search" plain>搜索</el-button>
+              <el-button size="small" icon="el-icon-refresh" plain>重置</el-button>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <CollapseTransition>
+          <div v-show="expanded">
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="物料分类">
+              <el-select v-model="queryParams.materialClassify" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="详细地址">
+            <el-input
+              v-model="queryParams.address"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="联系人">
+            <el-input
+              v-model="queryParams.contactsName"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="联系人电话">
+            <el-input
+              v-model="queryParams.contactsPhone"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row :gutter="10">
+          <el-col :span="1.5">
+            <el-form-item label="备注">
+            <el-input
+              v-model="queryParams.remark"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="同步状态">
+            <el-input
+              v-model="queryParams.sendStatus"
+              size="small"
+              placeholder=""
+              clearable
+              style="width: 200px"
+            />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="1.5">
+            <el-form-item label="启用">
+              <el-select v-model="queryParams.status" size="small" style="width: 200px" clearable placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        </div>
+      </CollapseTransition>
+      </el-form>
+      <el-divider class="lines"><i style="cursor: pointer;" :class="expanded?'el-icon-arrow-up':'el-icon-arrow-down'" @click="drop"></i></el-divider>
+
+      <el-card>
+        <div class="btn_grooup">
+          <el-button type="primary" size="small" @click="addAddress">新增</el-button>
+
+          <el-dropdown size="small" @command="handleCommand">
+            <el-button size="small" type="primary" style="margin-left: 10px;">
+              导入<i class="el-icon-arrow-down el-icon--right"></i>
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item command="数据导入">数据导入</el-dropdown-item>
+              <el-dropdown-item command="模板下载">模板下载</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+
+          <el-dropdown size="small" @command="handleCommand">
+            <el-button size="small" type="primary" style="margin: 0 10px;">
+              导出<i class="el-icon-arrow-down el-icon--right"></i>
+            </el-button>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item command="Excel导出">Excel导出</el-dropdown-item>
+              <el-dropdown-item command="导出明细">导出明细</el-dropdown-item>
+            </el-dropdown-menu>
+          </el-dropdown>
+
+          <el-button type="primary" size="small">启用</el-button>
+          <el-button type="primary" size="small">停用</el-button>
+          <el-button type="primary" size="small">同步NC</el-button>
+          <el-button type="primary" size="small">删除</el-button>
+          <el-button type="primary" size="small">打印</el-button>
+        </div>
+        <el-table 
+          :data="tableList" 
+          fit
+          max-height="680"
+          @selection-change="handleSelectionChange"
+        >
+          <el-table-column type="selection" width="55" />
+          <el-table-column label="仓库属性" align="center" prop="warehouseProperty"/>
+          <el-table-column label="仓库档案名称" align="center" width="200" prop="warehouseCode"/>
+          <el-table-column label="收货仓库编码" align="center" prop="code" />
+          <el-table-column label="收货仓库名称" align="center" width="150" prop="name"/>
+          <el-table-column label="详细地址" align="center" width="150" prop="address"/>
+          <el-table-column label="物料分类" align="center" width="150" prop="materialClassifyName" />
+          <el-table-column label="联系人" align="center" width="150" prop="contactsName" />
+          <el-table-column label="联系人电话" align="center" prop="contactsPhone" />
+          <el-table-column label="NC档案ID" align="center" width="150" prop="createTime" />
+          <el-table-column label="备注" align="center" width="120" prop="remark" />
+          <el-table-column label="创建人" align="center" width="150" prop="createByName" />
+          <el-table-column label="创建时间" align="center" width="150" prop="createTime" />
+          <el-table-column label="修改人" align="center" width="150" prop="updateByName" />
+          <el-table-column label="修改时间" align="center" width="150" prop="updateTime" />
+          <el-table-column label="同步状态" align="center" width="150" prop="sendStatus" />
+          <el-table-column label="启用" align="center" width="150" prop="status" />
+          <el-table-column
+          fixed="right"
+          label="操作"
+          align="center"
+          width="150"
+          >
+          <template slot-scope="scope">
+            <el-button type="text" size="small" @click="check(scope.row)">查看</el-button>
+            <el-button type="text" size="small" @click="edit(scope.row)">编辑</el-button>
+            <el-button type="text" size="small" @click="deleteids(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+        </el-table>
+
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="1"
+          :page-sizes="[5, 10, 15, 20]"
+          :page-size="100"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total=total>
+        </el-pagination>
+      </el-card>
+    </div>
+    <Add v-model="isList" v-if="!isList" :pageStu="page" :disable="disable" :row="rowDetail" @refresh="getList"/>
+  </div>
+</template>
+
+<script>
+import Add from './add.vue'
+import CollapseTransition from '@/components/MyCollapse/collapse.vue'
+import {getAddressList, delAddress} from '@/api/purchase/deliveryAddress.js'
+export default {
+  name: 'deliveryAddress',
+  components: {
+    Add,
+    CollapseTransition
+  },
+  data() {
+    return {
+      expanded: false,
+      // 页面配置
+      isList: true,
+      // 页面状态
+      page: '',
+      // 搜索框参数
+      queryParams: {
+        code: '',
+        name: '',
+        warehouse: '',
+        warehouseCode: '',
+        warehouseProperty: '',
+        address: '',
+        contacts: '',
+        contactsName: '',
+        contactsPhone: '',
+        materialClassify: '',
+        materialClassifyName: '',
+        status: '',
+        sendStatus: '',
+        remark: '',
+        pageNum: 1,
+        pageSize: 10
+      },
+      options: [{
+        value: '1', label: '是',
+      }, {
+        value: '0', label: '否'
+      }],
+      tableList: [],
+      total: 0,
+      rowDetail: {},
+      disable: false
+    }
+  },
+  created() {
+    this.getList(this.queryParams)
+  },
+  methods: {
+    getList(params){
+      getAddressList(params).then(res => {
+        if (res.code === 200) {
+          this.tableList = res.rows
+          this.total = res.total
+        }
+      })
+    },
+    handleSelectionChange() {},
+    handleCommand(command) {
+      alert(command)
+    },
+    addAddress() {
+      this.isList = false
+      this.page = 'add'
+      this.disable = false
+    },
+    check(row) {
+      this.isList = false
+      this.page = 'check'
+      this.rowDetail = row
+      this.disable = true
+    },
+    edit(row) {
+      this.isList = false
+      this.page = 'edit'
+      this.rowDetail = row
+      this.disable = false
+    },
+    deleteids(row) {
+      console.log('row', row)
+      this.$modal.confirm('确认信息').then(() => {
+        delAddress(row.id).then(res => {
+          if (res.code === 200) {
+            this.$modal.msgSuccess("删除成功");
+            this.getList(this.queryParams)
+          }
+        })
+        }).catch(() => {})
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`);
+      this.queryParams.pageSize = val
+      this.getList(this.queryParams)
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`);
+      this.queryParams.pageNum = val
+      this.getList(this.queryParams)
+    },
+    drop() {
+      this.expanded = !this.expanded
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+#deliveryAddressList {
+  height: calc(100vh - 84px);
+  padding: 12px;
+  box-sizing: border-box;
+}
+.btn_grooup {
+  margin-bottom: 10px;
+  display: flex;
+  justify-content: flex-end;
+}
+.lines {
+  margin-top: 0;
+}
+</style>

src/views/purchase/purchase-task/add-purchase-task.vue

@@ -0,0 +1,257 @@
+<script>
+export default {
+  name: "AddPurchaseTaskDrawer",
+  data() {
+    const arr2Obj = function (data, keyName, valueName) {
+      return Object.fromEntries(
+        data.map((item) => [item[keyName], item[valueName]])
+      );
+    };
+    const pickerOptions = {
+      disabledDate(time) {
+        return time.getTime() > Date.now();
+      },
+      shortcuts: [
+        {
+          text: "今天",
+          onClick(picker) {
+            picker.$emit("pick", new Date());
+          },
+        },
+        {
+          text: "昨天",
+          onClick(picker) {
+            const date = new Date();
+            date.setTime(date.getTime() - 3600 * 1000 * 24);
+            picker.$emit("pick", date);
+          },
+        },
+        {
+          text: "一周前",
+          onClick(picker) {
+            const date = new Date();
+            date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
+            picker.$emit("pick", date);
+          },
+        },
+      ],
+    };
+    const columns = [
+      {
+        title: "采购组织",
+        key: "puOrg",
+        type: "TagSelect",
+        value: [],
+        required: true,
+      },
+      { title: "需求来源", key: "source", type: "Input", value: "采购创建" },
+      { title: "采购员", key: "buyer", value: [], type: "TagSelect" },
+      { title: "交易类型", key: "billYpe", value: [], type: "TagSelect" },
+      { title: "物料编码", key: "material", type: "Input", required: true },
+      {
+        title: "物料名称",
+        key: "materialName",
+        type: "TagSelect",
+        value: [],
+        required: true,
+      },
+      {
+        title: "物料/物料描述",
+        key: "materialDesc",
+        type: "TagSelect",
+        value: [],
+        required: true,
+      },
+      { title: "生产厂家", key: "manufacturer", type: "Input" },
+      { title: "收货客户", key: "customer", type: "TagSelect", value: [] },
+      {
+        title: "采购单位",
+        key: "puUnit",
+        type: "TagSelect",
+        value: [],
+        required: true,
+      },
+      {
+        title: "采购数量",
+        key: "puQty",
+        type: "InputNumber",
+        required: true,
+      },
+      {
+        title: "需求时间",
+        key: "demandDate",
+        type: "DatePicker",
+        config: { type: "date", pickerOptions: pickerOptions },
+      },
+      { title: "项目名称", key: "projectName", type: "TagSelect", value: [] },
+      { title: "需求人", key: "demandPersonal", type: "TagSelect", value: [] },
+      {
+        title: "需求组织",
+        key: "demandOrg",
+        type: "TagSelect",
+        value: [],
+        require: true,
+      },
+      { title: "需求部门", key: "demandDept", type: "TagSelect", value: [] },
+      { title: "建议供应商", key: "supplier", type: "TagSelect", value: [] },
+      { title: "收货人", key: "a", type: "TagSelect", value: [] },
+      { title: "收货组织", key: "b", type: "TagSelect", value: [] },
+      { title: "收货人联系方式", key: "c", type: "Input" },
+      { title: "收货地址", key: "d", type: "Input" },
+      { title: "收货仓库", key: "e", type: "TagSelect", value: [] },
+      {
+        title: "指定供应商",
+        key: "assignSupplier",
+        type: "TagSelect",
+        value: [],
+      },
+      { title: "单位", key: "unit", type: "TagSelect", value: [] },
+      { title: "收货地址", key: "f", type: "TagSelect", value: [] },
+    ];
+    const initColumns = () => columns;
+    const initParams = () => arr2Obj(initColumns(), "key", "value");
+    return {
+      visible: false,
+      columns: initColumns(),
+      params: initParams(),
+      options: [
+        {
+          value: "选项1",
+          label: "黄金糕",
+        },
+        {
+          value: "选项2",
+          label: "双皮奶",
+        },
+        {
+          value: "选项3",
+          label: "蚵仔煎",
+        },
+        {
+          value: "选项4",
+          label: "龙须面",
+        },
+        {
+          value: "选项5",
+          label: "北京烤鸭",
+        },
+      ],
+    };
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    setVisible(prop) {
+      this.visible = prop;
+    },
+  },
+  created() {
+    console.log(this.params);
+  },
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<template>
+  <el-drawer
+    title="我是标题"
+    direction="btt"
+    size="100%"
+    :with-header="false"
+    :visible.sync="visible"
+    :before-close="handleClose"
+  >
+    <el-form
+      size="mini"
+      label-position="right"
+      label-width="125px"
+      :model="params"
+    >
+      <el-card
+        :body-style="{
+          padding: '20px',
+          display: 'flex',
+          'flex-wrap': 'wrap',
+        }"
+        style="margin: 10px"
+      >
+        <el-form-item
+          v-for="(column, index) in columns"
+          :key="index"
+          :prop="column.key"
+          :label="column.title"
+          :required="column.required"
+          style="width: 33%"
+        >
+          <el-input
+            v-if="column.type === 'Input'"
+            v-model="params[column.key]"
+            :placeholder="column.placeholder"
+            style="width: 90%"
+          ></el-input>
+          <el-input-number
+            v-if="column.type === 'InputNumber'"
+            v-model="params[column.key]"
+            controls-position="right"
+            :placeholder="column.placeholder"
+            style="width: 90%"
+          ></el-input-number>
+          <el-select
+            v-if="column.type === 'TagSelect'"
+            v-model="params[column.key]"
+            multiple
+            clearable
+            collapse-tags
+            :placeholder="column.placeholder"
+            style="width: 90%"
+          >
+            <template #prefix>
+              <el-icon
+                class="el-icon-s-operation"
+                style="cursor: pointer"
+                @click.stop="$message.info(234)"
+              ></el-icon>
+            </template>
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+          <el-date-picker
+            v-if="column.type === 'DatePicker'"
+            v-model="params[column.key]"
+            :type="column.config.type"
+            :placeholder="column.placeholder"
+            :picker-options="column.pickerOptions"
+            style="width: 90%"
+          >
+          </el-date-picker>
+        </el-form-item>
+      </el-card>
+      <el-card
+        :body-style="{
+          'text-align': 'right',
+          padding: '10px 20px',
+        }"
+        style="
+          position: fixed;
+          left: 0;
+          bottom: 0;
+          margin: 10px;
+          width: calc(100% - 20px);
+        "
+      >
+        <el-button size="mini" @click="setVisible(false)">取消</el-button>
+        <el-button size="mini" type="info" @click="setVisible(false)"
+          >保存并新增</el-button
+        >
+        <el-button size="mini" type="danger" @click="setVisible(false)"
+          >保存</el-button
+        >
+      </el-card>
+    </el-form>
+  </el-drawer>
+</template>

src/views/purchase/purchase-task/direct-sourcing.vue

@@ -0,0 +1,386 @@
+<script>
+export default {
+  name: "DirectSourcing",
+  components: {},
+  data() {
+    const tableColumns = [
+      { title: "价格来源", key: "a" },
+      { title: "供应商", key: "b" },
+      { title: "采购组织", key: "c" },
+      { title: "客户", key: "d" },
+      { title: "价格类型", key: "e" },
+      { title: "配送价", key: "f" },
+      { title: "币种", key: "g" },
+      { title: "价格有效期", key: "h" },
+      { title: "税率", key: "i" },
+      { title: "协议单价", key: "j" },
+      {
+        title: "未执行量",
+        key: "k",
+        edit: true,
+        editConfig: { type: "InputNumber", controlsPosition: "right" },
+      },
+      {
+        title: "采购量",
+        key: "l",
+        edit: true,
+        editConfig: { type: "InputNumber", controlsPosition: "right" },
+      },
+      {
+        title: "计划到货",
+        key: "m",
+        edit: true,
+        editConfig: { type: "DatePicker", showType: "date" },
+      },
+      {
+        title: "期望到货",
+        key: "n",
+        edit: true,
+        editConfig: { type: "DatePicker", showType: "date" },
+      },
+      {
+        title: "备注",
+        key: "o",
+        edit: true,
+        editConfig: { type: "Textarea" },
+      },
+    ];
+    const initTableColumns = () => tableColumns;
+    return {
+      tableColumns: initTableColumns(),
+      data: [
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+        {
+          a: 1,
+          b: 1,
+          c: 1,
+          d: 1,
+          e: 1,
+          f: 1,
+          g: 1,
+          h: 1,
+          i: 1,
+          j: 1,
+          k: 1,
+          l: 1,
+          m: 1,
+          n: 1,
+          o: 1,
+        },
+      ],
+      page: { pageNum: 1, pageSize: 25 },
+      total: 0,
+      pageSizes: [25, 50, 100],
+    };
+  },
+  computed: {},
+  watch: {
+    data: {
+      handler: function (n) {
+        console.log(n);
+      },
+      deep: true,
+    },
+  },
+  methods: {},
+  created() {},
+  mounted() {},
+  destroyed() {},
+};
+</script>
+
+<template>
+  <div class="directSourcing" style="height: 50vh">
+    <el-table :data="data" height="calc(50vh)" style="width: 100%">
+      <el-table-column
+        v-for="(column, index) in tableColumns"
+        :key="index"
+        :prop="column.key"
+        :label="column.title"
+        :width="column.width || 180"
+        :show-overflow-tooltip="column.showOverflowTooltip || true"
+      >
+        <template slot-scope="scope">
+          <el-input-number
+            v-if="column.edit && column.editConfig.type === 'InputNumber'"
+            v-model="scope.row[column.key]"
+            :controls-position="column.editConfig.controlsPosition"
+            :min="column.editConfig.min"
+            :max="column.editConfig.max"
+            :size="column.editConfig.size || 'mini'"
+            :placeholder="column.editConfig.placeholder"
+            style="width: 90%"
+          ></el-input-number>
+          <el-date-picker
+            v-else-if="column.edit && column.editConfig.type === 'DatePicker'"
+            v-model="scope.row[column.key]"
+            :type="column.editConfig.showType"
+            :picker-options="column.editConfig.pickerOptions"
+            :size="column.editConfig.size || 'mini'"
+            :placeholder="column.editConfig.placeholder"
+            style="width: 90%"
+          ></el-date-picker>
+          <el-input
+            v-else-if="column.edit && column.editConfig.type === 'Textarea'"
+            v-model="scope.row[column.key]"
+            type="textarea"
+            :autosize="column.editConfig.autosize || true"
+            :size="column.editConfig.size || 'mini'"
+            style="width: 90%"
+          ></el-input>
+          <span v-else>{{ scope.row[column.key] }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+    <el-pagination
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+      :total="total"
+      :page-sizes="pageSizes"
+      :page-size="page.pageSize"
+      :current-page="page.pageNum"
+      hide-on-single-page
+      layout="total, prev, pager, next, sizes, jumper"
+    >
+    </el-pagination>
+  </div>
+</template>
+
+<style scoped></style>

src/views/purchase/purchase-task/index.vue

@@ -0,0 +1,591 @@
+<script>
+import { taskList } from "@/api/business/purchase/purchase-task";
+import AddPurchaseTaskDrawer from "./add-purchase-task.vue";
+import SeePurchaseTaskDrawer from "./see-purchase-task.vue";
+import DirectSourcingTable from "./direct-sourcing.vue";
+export default {
+  name: "PuchaseTask",
+  components: {
+    AddPurchaseTaskDrawer,
+    SeePurchaseTaskDrawer,
+    DirectSourcingTable,
+  },
+  data() {
+    const arr2Obj = function (data, keyName, valueName) {
+      return Object.fromEntries(
+        data.map((item) => [item[keyName], item[valueName]])
+      );
+    };
+    const searchColumns = [
+      { title: "物料分类", key: "", type: "TagSelect" },
+      { title: "物料", key: "", type: "TagSelect" },
+      { title: "物料编码", key: "material", type: "Input" },
+      { title: "物料描述", key: "materialDesc", type: "Input" },
+      { title: "需求组织", key: "", type: "TagSelect" },
+      { title: "需求日期", key: "", type: "DatePicker" },
+      { title: "计划人员", key: "", type: "TagSelect" },
+      { title: "采购组织", key: "", type: "TagSelect" },
+      { title: "创建时间", key: "", type: "DatePicker" },
+      { title: "采购员", key: "", type: "TagSelect" },
+      { title: "状态", key: "", type: "Select" },
+      {
+        title: "来源单据号",
+        key: "",
+        type: "Input",
+        placeholder: "请输入来源单据号，多个用英文逗号分割",
+      },
+      { title: "收货组织", key: "", type: "TagSelect" },
+      { title: "采购分类", key: "", type: "Input" },
+      // { title: "受理人", key: "", type: "TagSelect" },
+      { title: "项目", key: "", type: "TagSelect" },
+      { title: "需求部门", key: "", type: "TagSelect" },
+      { title: "需求人", key: "", type: "TagSelect" },
+      { title: "ERP信息", key: "", type: "Input" },
+    ];
+    const initSearchColumns = () => searchColumns;
+    const initSearchParams = () => arr2Obj(initSearchColumns(), "key", "value");
+    const tableColumns = [
+      {
+        title: "物料名称",
+        key: "materialName",
+      },
+      {
+        title: "物料编码",
+        key: "material",
+      },
+      {
+        title: "来源单据号",
+        key: "material",
+      },
+      {
+        title: "来源单据行号",
+        key: "material",
+      },
+      {
+        title: "采购数量",
+        key: "material",
+      },
+      {
+        title: "采购单位",
+        key: "material",
+      },
+      {
+        title: "采购换算率",
+        key: "material",
+      },
+      {
+        title: "主数量",
+        key: "material",
+      },
+      {
+        title: "主计量单位",
+        key: "material",
+      },
+      {
+        title: "计价单位",
+        key: "material",
+      },
+      {
+        title: "计价换算率",
+        key: "material",
+      },
+      {
+        title: "计价数量",
+        key: "material",
+      },
+      {
+        title: "未执行数量",
+        key: "material",
+      },
+      {
+        title: "主未执行数量",
+        key: "material",
+      },
+      {
+        title: "计价未执行数量",
+        key: "material",
+      },
+      {
+        title: "已执行数量",
+        key: "material",
+      },
+      {
+        title: "交易类型",
+        key: "material",
+      },
+      {
+        title: "分配日期",
+        key: "material",
+      },
+      {
+        title: "SKU编码",
+        key: "material",
+      },
+      {
+        title: "SKU名称",
+        key: "material",
+      },
+      {
+        title: "SKU规格说明",
+        key: "material",
+      },
+      {
+        title: "SKU型号",
+        key: "material",
+      },
+      {
+        title: "SKU规格",
+        key: "material",
+      },
+      {
+        title: "产品规格",
+        key: "material",
+      },
+      {
+        title: "产品型号",
+        key: "material",
+      },
+      {
+        title: "物料描述",
+        key: "material",
+      },
+      {
+        title: "品牌",
+        key: "material",
+      },
+      {
+        title: "计划价",
+        key: "material",
+      },
+      {
+        title: "需求附件",
+        key: "material",
+      },
+      {
+        title: "物料附件",
+        key: "material",
+      },
+      {
+        title: "项目",
+        key: "material",
+      },
+      {
+        title: "建议供应商",
+        key: "material",
+      },
+      {
+        title: "需求组织",
+        key: "material",
+      },
+      {
+        title: "需求部门",
+        key: "material",
+      },
+      {
+        title: "需求人",
+        key: "material",
+      },
+      {
+        title: "已下单采购数量",
+        key: "material",
+      },
+      {
+        title: "采购组织",
+        key: "material",
+      },
+      {
+        title: "采购员",
+        key: "material",
+      },
+      {
+        title: "计划员",
+        key: "material",
+      },
+      {
+        title: "计划部门",
+        key: "material",
+      },
+      {
+        title: "联系电话",
+        key: "material",
+      },
+      {
+        title: "采购分类",
+        key: "material",
+      },
+      {
+        title: "收货人",
+        key: "material",
+      },
+      {
+        title: "收货地址",
+        key: "material",
+      },
+      {
+        title: "收货人电话",
+        key: "material",
+      },
+      {
+        title: "需求时间",
+        key: "material",
+      },
+      // {
+      //   title: "受理状态",
+      //   key: "material",
+      // },
+      {
+        title: "状态",
+        key: "material",
+      },
+      // {
+      //   title: "受理人",
+      //   key: "material",
+      // },
+      {
+        title: "委托受理人",
+        key: "material",
+      },
+      {
+        title: "弹性分单条件",
+        key: "material",
+      },
+      {
+        title: "备注",
+        key: "material",
+      },
+      {
+        title: "ERP相关信息",
+        key: "material",
+      },
+      {
+        title: "创建时间",
+        key: "material",
+      },
+      {
+        title: "最新价格",
+        key: "material",
+      },
+      {
+        title: "生产厂家",
+        key: "material",
+      },
+      {
+        title: "报价供应商",
+        key: "material",
+      },
+      {
+        title: "历史最低价",
+        key: "material",
+      },
+      {
+        title: "生产订单状态",
+        key: "material",
+      },
+      // {
+      //   title: "寻源退回原因",
+      //   key: "material",
+      // },
+      {
+        title: "收货仓库档案编码",
+        key: "material",
+      },
+      {
+        title: "自定义项16",
+        key: "material",
+      },
+      {
+        title: "收货客户",
+        key: "material",
+      },
+      {
+        title: "入库仓库",
+        key: "material",
+      },
+      {
+        title: "货位",
+        key: "material",
+      },
+      {
+        title: "指定供应商",
+        key: "material",
+      },
+      {
+        title: "单位",
+        key: "material",
+      },
+      {
+        title: "自定义项15",
+        key: "material",
+      },
+      {
+        title: "收货地址",
+        key: "material",
+      },
+      {
+        title: "收货联系人",
+        key: "material",
+      },
+      {
+        title: "需求来源",
+        key: "material",
+      },
+    ];
+    const initTableColumns = () => tableColumns;
+    return {
+      loading: false,
+      isSimpleSearch: true,
+      searchColumns: initSearchColumns(),
+      searchParams: {
+        isAsc: "desc",
+        reasonable: "",
+        orderByColumn: "",
+        ...initSearchParams(),
+      },
+      tableColumns: initTableColumns(),
+      tableData: [{ materialName: 1 }],
+      page: { pageNum: 1, pageSize: 25 },
+      total: 0,
+      pageSizes: [25, 50, 100],
+    };
+  },
+  computed: {
+    showSearchColumns() {
+      return this.isSimpleSearch
+        ? this.searchColumns.slice(0, 4)
+        : this.searchColumns;
+    },
+  },
+  //   watch: {
+  //     $route: {
+  //       handler: function (route) {
+  //         this.redirect = route.query && route.query.redirect;
+  //       },
+  //       immediate: true,
+  //     },
+  //   },
+  created() {
+    this.fetchTaskList();
+    console.log("Vue", this);
+  },
+  methods: {
+    async fetchTaskList() {
+      this.loading = true;
+      try {
+        const { code, msg, rows, total } = await taskList({
+          ...this.page,
+          ...this.searchParams,
+        });
+        if (code === 200) {
+          this.total = total;
+          this.tableData = rows;
+          this.$notify.success({ title: msg });
+        } else {
+          this.$notify.warning({ title: msg });
+        }
+      } catch (err) {
+        this.$notify.error({ title: "error", message: err });
+      } finally {
+        this.loading = false;
+      }
+    },
+    handleSearchChange() {
+      this.isSimpleSearch = !this.isSimpleSearch;
+      this.$notify.info({
+        title: this.isSimpleSearch ? "Simple Search" : "All Search",
+      });
+    },
+    handleSizeChange() {},
+    handleCurrentChange() {},
+    handleOpenAddDrawer() {
+      const { setVisible } = this.$refs.addDrawerFef;
+      setVisible(true);
+      setTimeout(() => {
+        this.$notify.info("Open Add Drawer");
+      }, 250);
+    },
+    handleOpenSeeDrawer() {
+      const { setVisible } = this.$refs.seeDrawerFef;
+      setVisible(true);
+      setTimeout(() => {
+        this.$notify.info("Open See Drawer");
+      }, 250);
+    },
+  },
+};
+</script>
+
+<template>
+  <el-card
+    v-loading="loading"
+    style="width: calc(100% - 24px); height: 100%; margin: 10px"
+    :body-style="{ padding: 0 }"
+  >
+    <AddPurchaseTaskDrawer ref="addDrawerFef"></AddPurchaseTaskDrawer>
+    <SeePurchaseTaskDrawer ref="seeDrawerFef"></SeePurchaseTaskDrawer>
+    <el-form
+      size="mini"
+      label-position="right"
+      label-width="85px"
+      :model="searchParams"
+      style="padding: 20px 0 0 0"
+    >
+      <el-row :gutter="24">
+        <el-col :span="22">
+          <el-row :gutter="20">
+            <el-col
+              v-for="column in showSearchColumns"
+              :key="column.title"
+              :xl="6"
+              :lg="6"
+              :md="8"
+              :sm="12"
+              :xs="24"
+            >
+              <el-form-item :prop="column.key" :label="column.title">
+                <el-input
+                  v-model="searchParams[column.key]"
+                  :placeholder="column.placeholder"
+                ></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-col>
+        <el-col :span="2">
+          <el-row :gutter="24">
+            <el-col :span="24">
+              <el-button type="primary" size="mini">搜索</el-button>
+            </el-col>
+            <el-col
+              v-show="!isSimpleSearch"
+              :span="24"
+              style="margin: 10px 0 0"
+            >
+              <el-button size="mini">重置</el-button>
+            </el-col>
+          </el-row>
+        </el-col>
+      </el-row>
+    </el-form>
+    <el-divider>
+      <i
+        :class="isSimpleSearch ? 'el-icon-arrow-down' : 'el-icon-arrow-up'"
+        style="cursor: pointer"
+        @click="handleSearchChange"
+      ></i>
+    </el-divider>
+    <el-row :gutter="24" style="padding: 0 20px">
+      <el-col :span="6">123</el-col>
+      <el-col :span="18" style="text-align: right">
+        <el-button
+          size="mini"
+          type="danger"
+          style="margin: 0 10px 0 0"
+          @click="handleOpenAddDrawer"
+        >
+          新增
+        </el-button>
+        <el-dropdown placement="bottom-start">
+          <el-button size="mini" style="margin: 0 10px 0 0">
+            发布
+            <i class="el-icon-arrow-down el-icon--right"></i>
+          </el-button>
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item>发布寻源</el-dropdown-item>
+            <el-dropdown-item>发布委托</el-dropdown-item>
+            <el-dropdown-item>采购方案</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+
+        <el-dropdown placement="bottom-start">
+          <el-button
+            size="mini"
+            style="border-right: 0; border-radius: 3px 0 0 3px"
+          >
+            首次协议直采
+            <i class="el-icon-arrow-down el-icon--right"></i>
+          </el-button>
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item>首次协议直采</el-dropdown-item>
+            <el-dropdown-item>余量协议直采</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+        <el-dropdown placement="bottom-start">
+          <el-button size="mini" style="border-right: 0; border-radius: 0">
+            跟单采购
+            <i class="el-icon-arrow-down el-icon--right"></i>
+          </el-button>
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item>按合同（普通）取价</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+        <el-button size="mini" style="border-right: 0; border-radius: 0">
+          Excel导出
+        </el-button>
+        <el-button
+          size="mini"
+          style="margin: 0; border-right: 0; border-radius: 0"
+        >
+          退回请购
+        </el-button>
+        <el-dropdown placement="bottom-start">
+          <el-button size="mini" style="border-right: 0; border-radius: 0">
+            清单采购
+            <i class="el-icon-arrow-down el-icon--right"></i>
+          </el-button>
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item>商超匹配下单</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+        <el-button
+          size="mini"
+          disabled
+          style="margin: 0 10px 0 0; border-radius: 0 3px 3px 0"
+        >
+          一键合同下单
+        </el-button>
+        <el-button size="mini" style="margin: 0 10px 0 0">删除</el-button>
+        <el-dropdown placement="bottom-end">
+          <el-button size="mini">
+            更多
+            <i class="el-icon-arrow-down el-icon--right"></i>
+          </el-button>
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item>抢单</el-dropdown-item>
+            <el-dropdown-item>批量修改收货组织</el-dropdown-item>
+            <el-dropdown-item>批量退回</el-dropdown-item>
+            <el-dropdown-item>退回需求申请</el-dropdown-item>
+            <el-dropdown-item>刷新缓存</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+      </el-col>
+    </el-row>
+    <el-table
+      @row-dblclick="handleOpenSeeDrawer"
+      :data="tableData"
+      size="mini"
+      style="width: 100%; margin: 20px 0 0 0"
+    >
+      <el-table-column
+        v-for="(column, index) in tableColumns"
+        :key="index"
+        :prop="column.key"
+        :label="column.title"
+        :width="column.width || 180"
+        :show-overflow-tooltip="column.showOverflowTooltip || true"
+      >
+      </el-table-column>
+    </el-table>
+    <el-pagination
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+      :total="total"
+      :page-sizes="pageSizes"
+      :page-size="page.pageSize"
+      :current-page="page.pageNum"
+      hide-on-single-page
+      layout="total, prev, pager, next, sizes, jumper"
+    >
+    </el-pagination>
+    <DirectSourcingTable></DirectSourcingTable>
+  </el-card>
+</template>

src/views/purchase/purchase-task/see-purchase-task.vue

@@ -0,0 +1,158 @@
+<script>
+export default {
+  name: "SeePurchaseTaskDrawer",
+  data() {
+    const arr2Obj = function (data, keyName, valueName) {
+      return Object.fromEntries(
+        data.map((item) => [item[keyName], item[valueName]])
+      );
+    };
+    const columns = [
+      {
+        title: "采购组织",
+        key: "puOrg",
+        type: "TagSelect",
+        value: [],
+        required: true,
+      },
+      { title: "需求来源", key: "source", type: "Input", value: "采购创建" },
+      { title: "采购员", key: "buyer", value: [], type: "TagSelect" },
+      { title: "交易类型", key: "billYpe", value: [], type: "TagSelect" },
+      { title: "物料编码", key: "material", type: "Input", required: true },
+      {
+        title: "物料名称",
+        key: "materialName",
+        type: "TagSelect",
+        value: [],
+        required: true,
+      },
+      {
+        title: "物料/物料描述",
+        key: "materialDesc",
+        type: "TagSelect",
+        value: [],
+        required: true,
+      },
+      { title: "生产厂家", key: "manufacturer", type: "Input" },
+      { title: "收货客户", key: "customer", type: "TagSelect", value: [] },
+      {
+        title: "采购单位",
+        key: "puUnit",
+        type: "TagSelect",
+        value: [],
+        required: true,
+      },
+      {
+        title: "采购数量",
+        key: "puQty",
+        type: "InputNumber",
+        required: true,
+      },
+      {
+        title: "需求时间",
+        key: "demandDate",
+        type: "DatePicker",
+        config: { type: "date" },
+      },
+      { title: "项目名称", key: "projectName", type: "TagSelect", value: [] },
+      { title: "需求人", key: "demandPersonal", type: "TagSelect", value: [] },
+      {
+        title: "需求组织",
+        key: "demandOrg",
+        type: "TagSelect",
+        value: [],
+        require: true,
+      },
+      { title: "需求部门", key: "demandDept", type: "TagSelect", value: [] },
+      { title: "建议供应商", key: "supplier", type: "TagSelect", value: [] },
+      { title: "收货人", key: "a", type: "TagSelect", value: [] },
+      { title: "收货组织", key: "b", type: "TagSelect", value: [] },
+      { title: "收货人联系方式", key: "c", type: "Input" },
+      { title: "收货地址", key: "d", type: "Input" },
+      { title: "收货仓库", key: "e", type: "TagSelect", value: [] },
+      {
+        title: "指定供应商",
+        key: "assignSupplier",
+        type: "TagSelect",
+        value: [],
+      },
+      { title: "单位", key: "unit", type: "TagSelect", value: [] },
+      { title: "收货地址", key: "f", type: "TagSelect", value: [] },
+    ];
+    const initColumns = () => columns;
+    const initParams = () => arr2Obj(initColumns(), "key", "value");
+    return {
+      visible: false,
+      loading: false,
+      columns: initColumns(),
+      params: initParams(),
+    };
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    setVisible(prop) {
+      this.visible = prop;
+    },
+    async fetchTaskItem() {
+      this.loading = true;
+      try {
+        // do something
+      } catch (err) {
+        this.$notify.error({ title: "error", message: err });
+      } finally {
+        this.loading = false;
+      }
+    },
+  },
+  created() {
+    console.log(this.params);
+  },
+  mounted() {},
+  destroyed() {},
+};
+</script>
+<template>
+  <el-drawer
+    title="我是标题"
+    direction="btt"
+    size="100%"
+    :with-header="false"
+    :visible.sync="visible"
+    :before-close="handleClose"
+  >
+    <el-card
+      :body-style="{
+        padding: '20px',
+        display: 'flex',
+        'flex-wrap': 'wrap',
+      }"
+      style="margin: 10px"
+    >
+      <el-descriptions title="采购任务详情" direction="vertical" :column="3">
+        <el-descriptions-item
+          v-for="(column, index) in columns"
+          :key="index"
+          :label="column.title"
+        >
+          {{ params[column.key] }}
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-card>
+    <el-card
+      :body-style="{
+        'text-align': 'right',
+        padding: '10px 20px',
+      }"
+      style="
+        position: fixed;
+        left: 0;
+        bottom: 0;
+        margin: 10px;
+        width: calc(100% - 20px);
+      "
+    >
+      <el-button size="mini" @click="setVisible(false)">返回</el-button>
+    </el-card>
+  </el-drawer>
+</template>

vue.config.js

@@ -37,7 +37,8 @@ module.exports = {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
         // target: `http://172.16.100.107:8080/drp-admin`, //测试
-        target: `http://release-sy.derom.com/drp-admin`, //测试
+        // target: `http://test-sy.derom.com/drp-admin`, //测试
+        target: `http://release-sy.derom.com/drp-admin`, //预发
         // target: `http://sy.derom.com/drp-admin`, //生产
         // target: `http://172.16.63.202:8000/drp-admin`, // D本地
         // target: `http://172.16.62.241:8000/drp-admin`, //笑寒本地
@@ -49,6 +50,11 @@ module.exports = {
           ["^" + process.env.VUE_APP_BASE_API]: "",
         },
       },
+      "/drp-admin/mock34": {
+        target: `http://172.16.100.123:3030/mock/34`,
+        changeOrigin: true,
+        pathRewrite: { [`^/drp-admin/mock34`]: "" },
+      },
     },
     disableHostCheck: true,
   },