收据配置

src/pages/system/receiptManage.vue

 <style>
-    .weChatConfig .Period-rules {
+  .receiptManage .Period-rules {
     display: flex;
     margin-bottom: 24px;
     padding-left: 20px;
   }
 
-    .weChatConfig .Period_Spreate {
+  .receiptManage .Period_Spreate {
     flex: 1;
     min-width: 200px;
     margin-right: 32px;
   }
 
-    .weChatConfig .Period-rule-title {
+  .receiptManage .Period-rule-title {
     color: #646a73;
     margin-bottom: 4px;
     display: flex;
     align-items: center;
   }
 
-    .weChatConfig .Period-info-icon {
+  .receiptManage .Period-info-icon {
     margin-left: 8px;
     color: #8f959e;
     line-height: 1;
@@ -83,71 +83,104 @@
     color: #1f2329;
   }
 
-    .FormItem-asterisk {
+
+
+  .addDutyUpload .ItemImgDiv {
+    width: 118px;
+    height: 118px;
     position: relative;
-      top: 3px;
-      margin-left: 3px;
-      color: #f54a45;
-      line-height: 1;
+    margin: 0 10px 10px 0;
+    display: inline-block;
   }
 
-    .baseSetForm_Dialog .el-radio {
-      display: block;
-      margin-bottom: 15px;
+  .addDutyUpload .avatar-uploader .el-upload {
+    border-radius: 6px;
+    cursor: pointer;
+    width: 100%;
+    height: 100%;
+    color: #8c939d;
+    position: relative;
+    overflow: hidden;
   }
 
-  </style>
-  <template>
+  .addDutyMain {
+    display: inline-block;
+    width: 118px;
+    height: 118px;
+    font-size: 70px;
+    border: 1px dashed #d9d9d9;
+    line-height: 120px;
+  }
+</style>
+<template>
   <div class="page-body">
-        <div class="weChatConfig">
+    <div class="receiptManage">
       <div style="text-align:right;">
-              <q-btn color="accent" size="sm" class="q-mr-md" @click="geteject" label="修改基础配置" />
+        <q-btn color="accent" size="sm" class="q-mr-md" @click="geteject" label="修改收据配置" />
       </div>
       <div class="Period-rules">
         <div class="Period_Spreate">
           <div class="Period-rule-title">流程名称</div>
-                <div v-if="baseObj.TempleteIds!=-1" v-for="(x,y) in baseObj.TempleteList" :key="y">{{x}}</div>
-                <div v-if="baseObj.TempleteIds==-1" >不限</div>
+          <div v-if="baseObj.TempleteIds!=-1">
+            <span  v-for="(x,y) in baseObj.TempleteList" :key="y">
+              {{x}}{{baseObj.TempleteList.length==y+1?'':'、'}}
+            </span>
+           </div>
+          <div v-if="baseObj.TempleteIds==-1">不限</div>
         </div>
         <div class="Period_Spreate">
           <div class="Period-rule-title">
-                  盖章图片
+            开启状态
+          </div>
+          <div>
+            {{baseObj.Enable==1?'已开启':'未开启'}}
           </div>
-                
         </div>
       </div>
       <div class="Period-rules">
         <div class="Period_Spreate">
           <div class="Period-rule-title">
-                  开启状态
+            盖章图片
           </div>
-                <div>
-                  {{baseObj.Enable==1?'已开启':'未开启'}}
+          <div >
+            <q-img :src="baseObj.Images" spinner-color="white" style="width: 150px;height:150px"  />
           </div>
+          
         </div>
+        
       </div>
 
     </div>
     <q-dialog v-model="isShowBaseSet" maximized full-height seamless position="right" @hide="closeProcess">
       <q-card style="margin-top:61px;width:500px" class="no-border-radius classinfo_Dialog">
         <div class="baseSetForm_Dialog">
-                <div class="cycle_Title">微信配置</div>
+          <div class="cycle_Title">收据配置</div>
           <div style="margin-top: 10px;">
-                    <q-input filled stack-label  :dense="false" v-model="addMsg.Name" ref="Name"
-                    class="col-12 q-pb-lg" label="企业名称" :rules="[val => !!val || '请填写企业名称']" />
+            <q-select class="col-12 q-pb-lg q-pr-lg" multiple clearable filled stack-label use-input use-chips
+              option-value="Id" option-label="Name" v-model="tempManager" 
+              :rules="[(val) => !!val || '请选择相关流程']" :options="SingleList" label="相关流程" :dense="false" emit-value
+              map-options @input="getIds">
+             
+            </q-select>
           </div>
-                <div>
-                    <q-input filled stack-label  :dense="false" v-model="addMsg.WX_CorpId" ref="WX_CorpId"
-                    class="col-12 q-pb-lg" label="企业微信ID" :rules="[val => !!val || '请填写企业微信ID']" />
+          <div class="row wrap addDutyUpload">
+            <div class="col-12">
+              <div style="display:flex;flex-wrap: wrap;">
+                <div v-if="addMsg.Images!=''" >
+                  <div class="ItemImgDiv">
+                    <q-img :src="addMsg.Images" spinner-color="white" style="width: 100%;height:100%" />
+                    <q-btn size="7px" @click="addMsg.Images=''" style="position:absolute;right:-5px;top:-5px;" round
+                      color="red" icon="iconfont icon-guanbi1" />
                   </div>
-                <div>
-                    <q-input filled stack-label  :dense="false" v-model="addMsg.Employee_Secret" ref="Employee_Secret"
-                    class="col-12 q-pb-lg" label="企业通讯录secret" :rules="[val => !!val || '请填写企业通讯录secret']" />
                 </div>
-                <div>
-                    <q-input filled stack-label  :dense="false" v-model="addMsg.Contact_Secret" ref="Contact_Secret"
-                    class="col-12 q-pb-lg" label="企业外部联系人secret" :rules="[val => !!val || '请填写企业外部联系人secret']" />
+                <el-upload class="avatar-uploader addDutyMain" action="" :before-upload="uploadFile"
+                  :show-file-list="false">
+                  <i class="el-icon-plus avatar-uploader-icon"></i>
+                </el-upload>
               </div>
+            </div>
+          </div>
+
 
 
           <div class="Okr_Length" style="margin:20px 0;display: flex;align-items: center;">
@@ -169,12 +202,15 @@
     </q-dialog>
   </div>
 
-  </template>
-  <script>
+</template>
+<script>
   import {
     getReceiptConfigInfo,
     setReceiptConfigInfo
   } from '../../api/finance/index';
+  import {
+    UploadSelfFile
+  } from "../../api/common/common"; //上传图片
   export default {
     meta: {
       title: "收据设置"
@@ -186,14 +222,17 @@
       return {
         isShowBaseSet: false,
         baseObj: {},
-          addMsg:{},
+        addMsg: {},
+        SingleList: [],//流程下来列表
+        tempManager:[],//选中的流程
       }
     },
     mounted() {
       this.getList();
+      this.getSingleList()
     },
     methods: {
-        //获取okr配置信息
+      //获取收据配置信息
       getList() {
         getReceiptConfigInfo({}).then(res => {
           if (res.Code == 1) {
@@ -201,31 +240,84 @@
           }
         })
       },
+      getSingleList() {
+        this.apipost('FinancialFlowTemplate_post_GetSingleList', {}, res => {
+          if (res.data.resultCode == 1) {
+            this.SingleList = res.data.data;
+            this.SingleList.unshift({
+              Id: -1,
+              Name: "不限",
+            });
+            this.SingleList.forEach(x => {
+              x.disable = false
+            })
+          } else { }
+        }, err => { })
+      },
 
       //关闭流程设置
       closeProcess() {
         this.isShowBaseSet = false;
       },
-        geteject(){
+      geteject() {
         this.addMsg = JSON.parse(JSON.stringify(this.baseObj))
+        this.tempManager = this.addMsg.TempleteIds.split(',').map(Number)
+        this.getIds()
         this.isShowBaseSet = true;
       },
-        setBaseInfo(){
-            this.$refs.Name.validate();
-            this.$refs.WX_CorpId.validate();
-            this.$refs.Employee_Secret.validate();
-            this.$refs.Contact_Secret.validate();
-            if(!this.$refs.Name.hasError && !this.$refs.WX_CorpId.hasError && !this.$refs.Employee_Secret.hasError && !this.$refs.Contact_Secret.hasError){
-                let msg={
-                    Id: this.addMsg.Id,
-                    Name: this.addMsg.Name,
-                    WX_CorpId: this.addMsg.WX_CorpId,
-                    Employee_Secret: this.addMsg.Employee_Secret,
-                    Contact_Secret: this.addMsg.Contact_Secret,
-                    Enable: this.addMsg.Enable,
-                    
-                }
-                setWeChatConfig(msg).then(res => {
+      getIds(){
+ 
+        if(this.tempManager && this.tempManager.length>0){
+          if(this.tempManager.indexOf(-1)!=-1){
+            this.SingleList.forEach(x=>{
+              if(x.Id!=-1){
+                x.disable = true
+              }else{
+                x.disable = false
+              }
+            })
+          }else{
+            this.SingleList.forEach(x=>{
+              if(x.Id==-1){
+                x.disable = true
+              }else{
+                x.disable = false
+              }
+            })
+          }
+        }else{
+          this.SingleList.forEach(x=>{
+              x.disable = false
+            })
+        }
+      },
+      uploadFile(files) {
+        UploadSelfFile("course", files, res => {
+          if (res.Code == 1) {
+            this.addMsg.Images=res.FileUrl;
+          }
+        });
+      },
+      setBaseInfo() {
+          let msg = JSON.parse(JSON.stringify(this.addMsg))
+          if(this.tempManager && this.tempManager.length==0){
+            this.$q.notify({
+                type: 'negative',
+                message: `请选择相关流程`,
+                position: 'top'
+            })
+            return
+          }
+          if(msg.Images==''){
+            this.$q.notify({
+                type: 'negative',
+                message: `请选择上传图章`,
+                position: 'top'
+            })
+            return
+          }
+          msg.TempleteIds = this.tempManager.join(',')
+          setReceiptConfigInfo(msg).then(res => {
             if (res.Code == 1) {
               this.$q.notify({
                 icon: 'iconfont icon-chenggong',
@@ -238,11 +330,10 @@
               this.isShowBaseSet = false;
             }
           })
-            }
+        
       }
 
     }
   }
 
-  </script>
-  
+</script>
\ No newline at end of file
\ No newline at end of file