Browse Source

封装客户组件

QuKatie 3 years ago
parent
commit
77475e7683

+ 8 - 0
src/api/basicData/customerInformation.js

@@ -8,6 +8,14 @@ export function customerList(data) {
         params: data
     })
 }
+//客户资料列表查询
+export function allCropList(data) {
+    return request({
+        url: '/api/blade-client/corpsdesc/corpsDescList',
+        method: 'get',
+        params: data
+    })
+}
 //客户资料列表修改和新增
 export function typeSave(data) {
     return request({

+ 6 - 2
src/components/crop-dialog/configuration/mainList.json

@@ -1,4 +1,6 @@
 {
+    "searchShow": true,
+    "searchMenuSpan": 16,
     "lazy": true,
     "align": "center",
     "border": true,
@@ -11,13 +13,15 @@
     "header":false,
     "column":[
         {
-            "label": "客户编码",
+            "label": "编码",
             "prop": "code",
             "index": 1,
             "width":100
         },{
-            "label": "客户全称",
+            "label": "称",
             "prop": "cname",
+            "search": true,
+            "searchSpan": 8,
             "index": 2,
             "width":180
         },{

+ 2 - 1
src/components/crop-dialog/main.vue

@@ -81,7 +81,7 @@ export default {
         lazy: true,
         treeLoad: function(node, resolve) {
           const parentId = node.level === 0 ? 0 : node.data.id;
-          getDeptLazyTree(parentId).then(res => {
+          getDeptLazyTree({ parentId: parentId, corpType: "KH"}).then(res => {
             resolve(
               res.data.data.map(item => {
                 return {
@@ -132,6 +132,7 @@ export default {
         size: page.pageSize,
         current: page.currentPage,
         corpsTypeId: this.treeDeptId,
+        corpType: "KH"
       });
       customerList(queryParams).then(res => {
         this.dataList = res.data.data.records;

+ 53 - 0
src/components/crop-select/configuration/mainList.json

@@ -0,0 +1,53 @@
+{
+    "searchShow": true,
+    "searchMenuSpan": 16,
+    "lazy": true,
+    "align": "center",
+    "border": true,
+    "index": true,
+    "tree": true,
+    "addBtn": false,
+    "menu":false,
+    "selection":true,
+    "tip":false,
+    "column":[
+        {
+            "label": "编码",
+            "prop": "code",
+            "index": 1,
+            "width":100
+        },{
+            "label": "名称",
+            "prop": "cname",
+            "search": true,
+            "searchSpan": 8,
+            "index": 2,
+            "width":180
+        },{
+            "label": "区域",
+            "prop": "belongtoarea",
+            "index": 4,
+            "width":180
+        },{
+            "label": "所属公司",
+            "prop": "belongtocompany",
+            "index": 5,
+            "width":100
+        },{
+            "label": "联系人",
+            "prop": "attn",
+            "index": 6,
+            "width":100
+        },{
+            "label": "代理品牌",
+            "prop": "goodtypes",
+            "index": 7,
+            "width":100
+        },{
+            "label": "等级",
+            "prop": "creditLevel",
+            "index": 8,
+            "width":100
+        }
+    ]
+}

+ 261 - 0
src/components/crop-select/main.vue

@@ -0,0 +1,261 @@
+<template>
+  <div>
+    <div style="display:flex">
+      <el-select
+        size="small"
+        v-model="value"
+        placeholder="请选择"
+        @input="$emit('balabala', value)"
+        :disabled="disabled"
+        filterable
+        clearable
+        @change="corpChange"
+      >
+        <el-option
+          v-for="item in corpList"
+          :key="item.id"
+          :label="item.cname"
+          :value="item.id"
+        >
+        </el-option>
+      </el-select>
+      <el-button
+        icon="el-icon-search"
+        size="mini"
+        :disabled="disabled"
+        @click="openDialog()"
+      ></el-button>
+    </div>
+    <el-dialog
+      :title="title"
+      :visible.sync="corpVisible"
+      width="60%"
+      top="5vh"
+      append-to-body
+      @closed="closed"
+      class="el-dialogDeep"
+      v-dialog-drag
+    >
+      <span>
+        <el-row>
+          <el-col :span="5">
+            <el-scrollbar>
+              <basic-container>
+                <avue-tree
+                  :option="treeOption"
+                  :data="treeData"
+                  @node-click="nodeClick"
+                />
+              </basic-container>
+            </el-scrollbar>
+          </el-col>
+          <el-col :span="19">
+            <avue-crud
+              :option="tableOption"
+              :data="data"
+              ref="crud"
+              v-model="form"
+              :page.sync="page"
+              :search.sync="search"
+              @search-change="searchChange"
+              @search-reset="searchReset"
+              @selection-change="selectionChange"
+              @on-load="onLoad"
+              @tree-load="treeLoad"
+              @saveColumn="saveColumn"
+              @refresh-change="refreshChange"
+              :table-loading="loading"
+            >
+            </avue-crud>
+          </el-col>
+        </el-row>
+      </span>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="corpVisible = false">取 消</el-button>
+        <el-button
+          type="primary"
+          @click="importCorp"
+          :disabled="selectionList.length != 1"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import option from "./configuration/mainList.json";
+import {
+  customerList,
+  allCropList,
+  getDeptLazyTree
+} from "@/api/basicData/customerInformation";
+import { getCustomerCode, getCustomerName } from "@/enums/management-type";
+export default {
+  data() {
+    return {
+      corpList: [],
+      loading: false,
+      data: [],
+      tableOption: {},
+      form: {},
+      search: {},
+      treeDeptId: "",
+      treeDeptName: "",
+      page: {
+        currentPage: 1,
+        pageSize: 10,
+        total: 0
+      },
+      treeOption: {
+        nodeKey: "id",
+        lazy: true,
+        addBtn: false,
+        menu: false,
+        size: "small",
+        props: {
+          labelText: "标题",
+          label: "title",
+          value: "value",
+          children: "children"
+        }
+      },
+      corpVisible: false,
+      selectionList: [],
+      title: null
+    };
+  },
+  props: {
+    value: String,
+    disabled: Boolean,
+    cropIndex: Number,
+    corpType: String
+  },
+  model: {
+    prop: "value",
+    event: "balabala"
+  },
+  async created() {
+    this.tableOption = await this.getColumnData(this.getColumnName(51), option);
+    this.title = getCustomerName(this.corpType);
+    allCropList({
+      corpType: getCustomerCode(this.corpType)
+    }).then(res => {
+      this.corpList = res.data.data;
+    });
+  },
+  mounted() {},
+  methods: {
+    init() {
+      this.openDialog();
+    },
+    openDialog() {
+      let _this = this;
+      this.treeOption.treeLoad = function(node, resolve) {
+        const parentId = node.level === 0 ? 0 : node.data.id;
+        getDeptLazyTree({
+          parentId: parentId,
+          corpType: getCustomerCode(_this.corpType)
+        }).then(res => {
+          resolve(
+            res.data.data.map(item => {
+              return {
+                ...item,
+                leaf: !item.hasChildren
+              };
+            })
+          );
+        });
+      };
+      this.corpVisible = true;
+    },
+    closed() {
+      this.$refs.crud.toggleSelection();
+    },
+    importCorp() {
+      this.$emit("balabala", this.selectionList[0].id);
+      this.$emit("getCorpData", {
+        ...this.selectionList[0],
+        index: this.cropIndex
+      });
+      this.corpVisible = false;
+    },
+    corpChange(row) {
+      this.corpList.forEach(e => {
+        if (row == e.id) {
+          this.$emit("getCorpData", { ...e, index: this.cropIndex });
+        }
+      });
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.search);
+    },
+    onLoad(page, params = { parentId: 0 }) {
+      let queryParams = Object.assign({}, params, {
+        size: page.pageSize,
+        current: page.currentPage,
+        corpsTypeId: this.treeDeptId,
+        corpType: getCustomerCode(this.corpType)
+      });
+      this.loading = true;
+      customerList(queryParams)
+        .then(res => {
+          this.data = res.data.data.records;
+          this.page.total = res.data.data.total;
+          if (this.page.total) {
+            this.tableOption.height = window.innerHeight - 350;
+          }
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    sizeChange(val) {
+      this.page.pageSize = val;
+      this.onLoad();
+    },
+    currentChange(val) {
+      this.page.currentPage = val;
+      this.onLoad();
+    },
+    //列表内展开树节点
+    treeLoad(tree, treeNode, resolve) {
+      const parentId = tree.id;
+      customerList({ parentId: parentId }).then(res => {
+        resolve(res.data.data.records);
+      });
+    },
+    //点击搜索按钮触发
+    searchChange(params, done) {
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    searchReset() {
+      this.treeDeptId = null;
+    },
+    nodeClick(data) {
+      this.treeDeptId = data.id;
+      this.page.currentPage = 1;
+      this.onLoad(this.page);
+    },
+    //列保存触发
+    async saveColumn() {
+      const inSave = await this.saveColumnData(
+        this.getColumnName(51),
+        this.option
+      );
+      if (inSave) {
+        this.$message.success("保存成功");
+        //关闭窗口
+        this.$refs.crud.$refs.dialogColumn.columnBox = false;
+      }
+    }
+  }
+};
+</script>
+
+<style scoped lang="scss"></style>

+ 50 - 46
src/components/fee-info/main.vue

@@ -7,7 +7,7 @@
         :data="feeData"
         :option="feeOption"
         @saveColumn="saveColumn"
-        @selection-change="selectionCrud"
+        @selection-change="selectionChange"
         :summary-method="summaryMethod"
         :cell-style="cellStyle"
       >
@@ -21,8 +21,18 @@
             >新增</el-button
           >
           <el-button-group>
-            <el-button type="receivableButton" :disabled="selectionCrudList.length ==0"  @click="receivable">应收</el-button>
-            <el-button type="copeWithButton" :disabled="selectionCrudList.length ==0"   @click="copeWith">应付</el-button>
+            <el-button
+              type="receivableButton"
+              :disabled="selectionList.length == 0"
+              @click="receivable"
+              >应收</el-button
+            >
+            <el-button
+              type="copeWithButton"
+              :disabled="selectionList.length == 0"
+              @click="copeWith"
+              >应付</el-button
+            >
           </el-button-group>
         </template>
         <template slot="menu" slot-scope="{ row, index }">
@@ -44,13 +54,14 @@
           >
         </template>
         <template slot="corpId" slot-scope="{ row, index }">
-          <customer-dialog
-            v-if="row.$cellEdit"
-            v-model="row.corpName"
+          <crop-select
+            v-show="row.$cellEdit"
+            v-model="row.corpId"
             :cropIndex="index"
-            @getcorpId="getcorpId"
-          ></customer-dialog>
-          <span v-else>{{ row.corpName }}</span>
+            @getCorpData="getCorpData"
+            corpType="KH"
+          ></crop-select>
+          <span  v-show="!row.$cellEdit">{{ row.corpName }}</span>
         </template>
         <template slot="feeName" slot-scope="{ row, index }">
           <el-button
@@ -184,7 +195,7 @@ import option from "./config/feeList.json";
 import { getDeptLazyTree, customerList } from "@/api/basicData/basicFeesDesc";
 import { delItem } from "@/api/feeInfo/fee-info";
 import { isPercentage, micrometerFormat } from "@/util/validate";
-import customerDialog from "@/components/customer-dialog/main";
+// import customerDialog from "@/components/customer-dialog/main";
 import cropDialog from "@/components/crop-dialog/main";
 import _ from "lodash";
 export default {
@@ -227,11 +238,10 @@ export default {
       },
       treeDeptId: null,
       loading: false,
-      receivableButton:"primary",
-      copeWithButton:"",
+      receivableButton: "primary",
+      copeWithButton: "",
       data: [],
       feeData: [],
-      selectionCrudList:[],
       selectionList: [],
       reData: null,
       currencyList: []
@@ -266,7 +276,6 @@ export default {
     });
   },
   components: {
-    customerDialog,
     cropDialog
   },
   methods: {
@@ -289,9 +298,6 @@ export default {
         $cellEdit: true
       });
     },
-    getcorpId(row) {
-      this.feeData[row.index].corpId = row.id;
-    },
     currencyChange(row) {
       if (row.currency == "CNY") {
         row.exchangeRate = 1;
@@ -325,6 +331,9 @@ export default {
         }
       });
     },
+    getCorpData(row) {
+      this.feeData[row.index].corpName = row.cname;
+    },
     priceChange(row) {
       if (!row.price) {
         row.price = 0;
@@ -362,10 +371,6 @@ export default {
     selectionChange(list) {
       this.selectionList = list;
     },
-    //列表多选
-    selectionCrud(list){
-      this.selectionCrudList = list
-    },
     rePick(row, index) {
       this.reData = {
         ...row,
@@ -445,23 +450,23 @@ export default {
           });
         }
       }
-      // else {
-      //   this.selectionList.forEach(e => {
-      //     this.feeData.push({
-      //       itemId: e.id,
-      //       corpId: null,
-      //       feeName: e.cname,
-      //       price: 0,
-      //       unit: e.unitno,
-      //       quantity: 0,
-      //       amount: 0,
-      //       currency: e.fcyno,
-      //       exchangeRate: null,
-      //       remarks: null,
-      //       $cellEdit: true
-      //     });
-      //   });
-      // }
+      else {
+        this.selectionList.forEach(e => {
+          this.feeData.push({
+            itemId: e.id,
+            corpId: null,
+            feeName: e.cname,
+            price: 0,
+            unit: e.unitno,
+            quantity: 0,
+            amount: 0,
+            currency: e.fcyno,
+            exchangeRate: null,
+            remarks: null,
+            $cellEdit: true
+          });
+        });
+      }
       this.feeDialog = false;
     },
     submitData() {
@@ -469,18 +474,17 @@ export default {
     },
 
     //应收
-    receivable(){
+    receivable() {
       //切换
-      this.receivableButton = "primary"
-      this.copeWithButton = ""
-
-      this.selectionCrudList;
+      this.receivableButton = "primary";
+      this.copeWithButton = "";
 
+      this.selectionList;
     },
     //应付
-    copeWith(){
-      this.receivableButton = ""
-      this.copeWithButton = "primary"
+    copeWith() {
+      this.receivableButton = "";
+      this.copeWithButton = "primary";
     },
 
     summaryMethod({ columns, data }) {

+ 2 - 3
src/components/selectComponent/configuration/mainList.json

@@ -2,7 +2,6 @@
   "height": "auto",
   "lazy": true,
   "tip": false,
-  "simplePage": true,
   "searchSpan": 12,
   "searchMenuSpan": 12,
   "searchMenuPosition": "right",
@@ -22,7 +21,7 @@
   "dialogClickModal": false,
   "column": [
     {
-      "label": "客户编码",
+      "label": "编码",
       "prop": "code",
       "search": false,
       "index": 1,
@@ -36,7 +35,7 @@
       ]
     },
     {
-      "label": "客户全称",
+      "label": "称",
       "prop": "cname",
       "search": true,
       "index": 2,

+ 4 - 0
src/enums/column-name.js

@@ -154,6 +154,10 @@ const columnName = [{
   {
     code: 50,
     name: '出口价格库列表'
+  },
+  {
+    code: 51,
+    name: '客户、供应商、公司'
   }
 
 ]

+ 17 - 0
src/enums/management-type.js

@@ -31,3 +31,20 @@ export const getCustomerCode = (row) => {
   }
   return code
 }
+export const getCustomerName = (row) => {
+  let name = null;
+  switch (row) {
+    case 'KH':
+      name = customerParameter.name
+      break;
+    case 'GYS':
+      name = supplierParameter.name
+      break;
+    case 'GS':
+      name = companyParameter.name
+      break;
+    default:
+      name = customerParameter.name
+  }
+  return name
+}

+ 3 - 0
src/main.js

@@ -37,6 +37,8 @@ import warehouseSelect from '@/components/warehouseSelect/index';
 import goodsSelect from '@/components/goodsSelect/index';
 //费用选择组件
 import breakdownSelect from '@/components/costBreakdown/costBreakdown';
+//重新封装了客户选择组件
+import cropSelect from "@/components/crop-select/main";
 //枚举列设置名称管理
 import {
   getColumnName
@@ -51,6 +53,7 @@ Vue.component('selectComponent', selectComponent);
 Vue.component('warehouseSelect', warehouseSelect);
 Vue.component('goodsSelect', goodsSelect);
 Vue.component('breakdownSelect', breakdownSelect);
+Vue.component('cropSelect', cropSelect);
 import portInfo from "@/components/port-info/index";
 Vue.component('portInfo', portInfo);
 // 注册全局crud驱动

+ 0 - 0
src/views/exportTrade/customerInquiry/components/goods-info.vue


+ 11 - 7
src/views/exportTrade/customerInquiry/detailsPage.vue

@@ -50,12 +50,12 @@
             />
           </template>
           <template slot="corpId">
-            <select-component
+            <crop-select
               v-model="form.corpId"
-              :configuration="configuration"
+              @getCorpData="getCorpData"
+              corpType="KH"
               :disabled="detailData.status == 1"
-              @getRow="rowCorpdata"
-            ></select-component>
+            ></crop-select>
           </template>
           <template slot="priceTerms">
             <el-select
@@ -468,6 +468,7 @@ import priceLibrary from "@/components/price-Library/main";
 import { isDiscount, isPercentage, micrometerFormat } from "@/util/validate";
 import { contrastObj, contrastList } from "@/util/contrastData";
 import { dateFormat } from "@/util/date";
+
 import _ from "lodash";
 export default {
   name: "detailsPageEdit",
@@ -859,6 +860,9 @@ export default {
     cellStyle() {
       return "padding:0;height:40px;";
     },
+    getCorpData(row){
+      this.form.coefficient=row.coefficient
+    },
     priceTermsChange(row) {
       this.priceTermsList.forEach(e => {
         if (row == e.dictValue) {
@@ -996,9 +1000,9 @@ export default {
         this.partType = false;
       }
     },
-    getcorpId(row) {
-      this.data[row.index].corpId = row.id;
-    },
+    // getcorpId(row) {
+    //   this.data[row.index].corpId = row.id;
+    // },
     rowCell(row, index) {
       if (row.$cellEdit == true) {
         this.$set(row, "$cellEdit", false);

+ 15 - 10
src/views/exportTrade/customerInquiry/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <basic-container v-if="show" class="page-crad">
+    <basic-container v-show="show" class="page-crad">
       <avue-crud
         ref="crud"
         :option="option"
@@ -76,11 +76,10 @@
           <el-button type="info" size="small">报表</el-button>
         </template>
         <template slot="corpIdSearch">
-          <select-component
+          <crop-select
             v-model="search.corpId"
-            :configuration="configuration"
-            typeData="KH"
-          ></select-component>
+            corpType="KH"
+          ></crop-select>
         </template>
         <template slot-scope="scope" slot="corpId">
           {{ scope.row.corpsName }}
@@ -106,7 +105,11 @@
         </template>
       </avue-crud>
     </basic-container>
-    <detail-page @goBack="goBack" :detailData="detailData" v-else></detail-page>
+    <detail-page
+      @goBack="goBack"
+      :detailData="detailData"
+      v-if="!show"
+    ></detail-page>
   </div>
 </template>
 
@@ -140,12 +143,13 @@ export default {
         pageSize: 10,
         currentPage: 1,
         total: 0,
-        pageSizes:[10,50,100,200,300,400,500]
+        pageSizes: [10, 50, 100, 200, 300, 400, 500]
       },
       show: true,
       detailData: {},
       loading: false,
-      selectionList:[]
+      searchShow: true,
+      selectionList: []
     };
   },
   components: { detailPage },
@@ -186,8 +190,8 @@ export default {
         });
       });
     },
-    selectionChange(list){
-      this.selectionList=list
+    selectionChange(list) {
+      this.selectionList = list;
     },
     //查看跳转页面
     beforeOpenPage(row, status) {
@@ -298,6 +302,7 @@ export default {
     goBack() {
       this.detailData = this.$options.data().detailData;
       this.show = true;
+      this.onLoad(this.page, this.search);
     },
     async saveColumn() {
       /**

+ 2 - 2
src/views/exportTrade/invoice/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <basic-container v-if="show" class="page-crad">
+    <basic-container v-show="show" class="page-crad">
       <avue-crud
         ref="crud"
         :option="option"
@@ -95,7 +95,7 @@
         </template>
       </avue-crud>
     </basic-container>
-    <detail-page @goBack="goBack" :detailData="detailData" v-else></detail-page>
+    <detail-page @goBack="goBack" :detailData="detailData" v-show="!show"></detail-page>
   </div>
 </template>