Merge pull request 'master-模板替换' (#26) from master-模板替换 into master

Reviewed-on: http://git.xdadan.loc/tanex/emis-frontend/pulls/26

src/components/SearchForm/index.vue

@@ -12,6 +12,9 @@
           </span>
         </Button>
       </FormItem>
+      <FormItem v-if="isShowDownload">
+        <Button type="warning" icon="el-icon-download"  @click="handleExport">导出</Button>
+      </FormItem>
     </div>
   </Form>
 </template>
@@ -42,6 +45,10 @@ export default {
     isShowSearchBtn:{
       type: Boolean,
       default: true,
+    },
+    isShowDownload :{
+      type:Boolean,
+      default: false,
     }
   },
   data() {
@@ -96,6 +103,9 @@ export default {
       // this.resetForm();
       this.$emit('reset')
     },
+    handleExport() {
+      this.$emit('export')
+    },
     resetForm() {
       if (this.$refs["searchForm"]) {
           this.$refs["searchForm"].resetFields();

src/views/emis/emisCommissionQuote/emisCommissionQuoteForm.vue

@@ -329,24 +329,21 @@ export default {
         return;
       }
       let userArr=this.impEmpListStr.trim().split(/[；\;\,\，\n]/)||[];
-      let empCodeStr="";
+      let empCodeArr = [];
-      let empNameStr="";
+      let empNameArr = [];
       for(let i=0;i<userArr.length;i++){
         let user=await this.getStaffUser(userArr[i]);
-        console.log("====>user====>",user);
+        // console.log("====>user====>",user);
         if(user==null){
           this.$modal.msgError(userArr[i]+"不存在!");
           return
         }else{
-          empCodeStr=empCodeStr+user.empCode+",";
+          empCodeArr.push(user.empCode);
-          empNameStr=empNameStr+user.empName+",";
+          empNameArr.push(user.empName);
         }
       }
-
+      this.form.empCode=empCodeArr.join(",");
-      this.form.empCode=empCodeStr;
+      this.form.empName=empNameArr.join(",");
-      this.form.empName=empNameStr;
-
-
       this.openForm=false;
     },
     cancelBatchEmp(){

src/views/emis/emisCommissionQuote/index.vue

@@ -304,7 +304,7 @@ export default {
       currentQuote:null,
       openForm: false,
       titleForm: "",
-
+      isCopy:false,
       // 弹出展示层
       quoteId:null,
       titleView:"",

src/views/emis/emisTransPlanRuleTopoGraph/index.vue

@@ -2,10 +2,10 @@
     <div class="app-container">
         <!-- 查询 -->
         <SearchForm slot="pageHeader" :model="queryParams" ref="queryForm" size="mini" :maxShow="30" label-width="68px"
-            v-show="showSearch" @search="handleQuery" @reset="resetQuery">
+            v-show="showSearch" @search="handleQuery" @reset="resetQuery" :isShowDownload="true" @export="exportImage">
             <!-- 线路查询 -->  
             <el-form-item label="线路" prop="lineCode">
-                <TransLineAllPicker v-model="queryParams.lineCode" isInitiated="true"></TransLineAllPicker>
+                <TransLineAllPicker v-model="queryParams.lineCode" isInitiated="true" @onChange="onLineChange"></TransLineAllPicker>
             </el-form-item>
             <el-form-item label="产品类型" prop="productType">
                 <TransProductAllPicker placeholder="产品类型" v-model="queryParams.productType"
@@ -15,17 +15,9 @@
                 <EmisSiteSimplePicker placeholder="始发网点" v-model="queryParams.startSiteCode"></EmisSiteSimplePicker>
             </el-form-item>
         </SearchForm>
-        <div slot="toolbar">
-            <el-row :gutter="10" class="mb8">
-                <el-col :span="1.5">
-                    <el-button type="warning" plain icon="el-icon-download" size="mini"
-                        <!-- @click="exportImage">导 出</el-button> -->
-                </el-col>
-            </el-row>
-        </div>
         <div id="container">
             <!-- mini 地图 -->
-            <!-- <div class="minimap-container" id="minimap"></div> -->
+            <div class="minimap-container" id="minimap" v-show="showMinimap"></div>
         </div>
     </div>
 </template>
@@ -48,11 +40,13 @@ export default {
     data() {
         return {
             treeData: {},
+            showMinimap:false,
             graph: null,
             queryParams: {
                 pageNum: 1,
                 pageSize: 50,
                 lineCode: "",
+                lineName: '',
                 productType: "",
                 productName: '',
                 startSiteCode: ''
@@ -113,11 +107,7 @@ export default {
                 // 触摸移动逻辑...
             },
         });
-
-        // this.splitChild(this.treeData);
         this.drawTreeGraph();
-
-
     },
     beforeRouteEnter(to, from, next) {
         // 组件创建前 保存当前背景颜色
@@ -173,15 +163,14 @@ export default {
             });
 
             const minimap = new G6.Minimap({
-            container:'minimap',
+                container: 'minimap',
-            size: [190, 190],
+                size: [190, 190],
-            type: 'delegate',
+                type: 'delegate',
-               delegateStyle: {
+                delegateStyle: {
-              // 代理元素样式配置
+                    fill: '#b12d29', // 填充色（半透明白色）
-              fill: '#b12d29',     // 填充色（半透明白色）
+                }
-            //   stroke: 'black',                     // 描边色（蓝色）
+            })
-               }
+
-            });
             this.graph = new G6.TreeGraph({
                 container,
                 width: document.getElementById('container').clientWidth, //画布宽度等于浏览器宽度
@@ -190,7 +179,7 @@ export default {
                 // fitViewPadding: [10, 50, 10, 50],
                 animate: true,
                 // plugins: [this.treeTooltip(), this.contextMenu, minimap],
-                plugins: [this.treeTooltip()],
+                plugins: [this.treeTooltip(), minimap],
                 defaultNode: {
                     type: "rect",
                     size: [250, 80],
@@ -561,13 +550,17 @@ export default {
             this.edges = [];
             const res = await emisTransPlanRuleTree(this.queryParams); //测试数据
             this.treeData = res.rows;
-
+            if (res.rows.length === 0) {
+                loadingInstance.close();
+                return
+            };
+            this.showMinimap=true;
             //获取产品下的网点
             // let { list: newlist, edges: newEdges } = this.treeDataToNodelist(
             //   this.treeData,
             //   this.queryParams.productType,
             // );
-            this.treeData = { "id": '1', "label": this.queryParams.productName, "x": 500, "y": 500, "children": this.processTree(this.treeData) }
+            this.treeData = { "id": '1', "label": `${this.queryParams.lineName}\n${this.queryParams.productName}`, "children": this.processTree(this.treeData) }
             // 折叠节点
             this.splitChild(this.treeData);
             this.graph.data(this.treeData);
@@ -596,34 +589,35 @@ export default {
             return str;
         },
         async exportImage() {
-
+            this.graph.toFullDataURL((res) => {
-        this.graph.toFullDataURL((res) => {
+                // 为了防止下载的图片影响到G6显示，这里作一个深度拷贝 
-        // 为了防止下载的图片影响到G6显示，这里作一个深度拷贝 
+                const canvas = document.getElementById('container').childNodes[1].cloneNode(true);
-        const canvas = document.getElementById('container').childNodes[1].cloneNode(true);
+                const img = new Image();
-        console.log('canvas',document.getElementById('container').childNodes);
+                img.onload = function () {
-        const img = new Image();
+                    canvas.width = img.width + 32;
-        img.onload = function () {
+                    canvas.height = img.height + 32;
-            canvas.width = img.width + 32;
+                    const ctx = canvas.getContext('2d');
-            canvas.height = img.height + 32;
+                    ctx.fillStyle = '#fff';
-            const ctx = canvas.getContext('2d');
+                    ctx.fillRect(0, 0, canvas.width, canvas.height);
-            ctx.fillStyle = '#fff';
+                    ctx.drawImage(img, 16, 16);
-            ctx.fillRect(0, 0, canvas.width, canvas.height);
+                    // 下载
-            ctx.drawImage(img, 16, 16);
+                    const oA = document.createElement('a');
-            // 下载
+                    oA.download = '组批次规则图';
-            const oA = document.createElement('a');
+                    oA.href = canvas.toDataURL('image/png');
-            oA.download = '组批次规则图';
+                    document.body.appendChild(oA);
-            oA.href = canvas.toDataURL('image/png');
+                    oA.click();
-            document.body.appendChild(oA);
+                    oA.remove(); // 下载之后把创建的元素删除
-            oA.click();
+                };
-            oA.remove(); // 下载之后把创建的元素删除
+                img.src = res;
-        };
+            }, 'image/png', {
-        img.src = res;
+                imageConfig: {
-        }, 'image/png', {
+                    padding: 16
-        imageConfig: {
+                }
-            padding: 16
+            });
-        }
+        },
-        });
+        onLineChange(value) {
-        }
+            this.queryParams.lineName = value.lineName;
+        },
 
     }
 }
@@ -648,14 +642,13 @@ export default {
     border: 1px solid #ccc;
 }
 
-
 #container>>>.g6-component-tooltip {
     background: #333;
     color: #fff;
     padding: 10px;
 }
 .minimap-container >>>.g6-minimap-viewport {
-    outline: 2px solid black !important;
+    outline: 2px solid #333 !important;
 }
 /* canvas {
     cursor: pointer !important;