style:材料上传

@@ -5,4 +5,4 @@ NODE_ENV=development
 VUE_APP_BASE_API = '/bdcdj'
 
 # 开发环境
-VUE_APP_API_BASE_URL = 'http://192.168.2.95:8018'
+VUE_APP_API_BASE_URL = 'http://192.168.2.88:8018'

@@ -56,4 +56,19 @@ export function getWorkFlowImage (bsmSlsq) {
             bsmSlsq: bsmSlsq
         }
     })
+}
+// 上传单个文件 
+export function sjClmxUpload (data) {
+    return request({
+        url: 'zhcx/sjClmx/upload',
+        method: 'post',
+        data
+    })
+}
+// 删除上传文件
+export function sjClmxDelete (bsmClmx) {
+    return request({
+        url: 'zhcx/sjClmx/delete?bsmClmx=' + bsmClmx,
+        method: 'delete'
+    })
 }
\ No newline at end of file

@@ -3,7 +3,6 @@ import Popup from './index.vue'
 
 const PopupBox = Vue.extend(Popup)
 Popup.install = function (data) {
-  console.log(data)
   let instance = new PopupBox({
     data
   }).$mount()

 <template>
-    <transition name="fade" mode="out-in" v-if="isShow">
-      <div class="ls-mask" v-loading="loading">
-        <div class="ls-mask-window" :style="{'width':width,'height':height}">
-          <div :style="{'text-align':titleStyle}"><b >{{title}}</b></div>
-          <i class="el-icon-close" @click="onCancel" ></i>
-          <div class="ls-mask-content">
-            <component :is="editItem" ref='childRef' @loading='loadingFn' :formData='formData' />
-          </div>
-          <div class="ls-mask-footer">
-            <el-button type="primary" @click="onConfirm">{{confirmText}}</el-button>
-            <el-button @click="onCancel">{{cancelText}}</el-button>
-          </div>
+  <transition name="fade" mode="out-in" v-if="isShow">
+    <div class="ls-mask" v-loading="loading">
+      <div class="ls-mask-window" :style="{'width':width,'height':height}">
+        <div :style="{'text-align':titleStyle}"><b>{{title}}</b></div>
+        <i class="el-icon-close" @click="onCancel"></i>
+        <div class="ls-mask-content">
+          <component :is="editItem" ref='childRef' @loading='loadingFn' :formData='formData' />
+        </div>
+        <div class="ls-mask-footer">
+          <el-button type="primary" @click="onConfirm">{{confirmText}}</el-button>
+          <el-button @click="onCancel">{{cancelText}}</el-button>
         </div>
       </div>
-    </transition>
-  </template>
-  <script>
-    export default {
-      name: 'index',
-      data () {
-        return {
-          title: '提示',
-          cancelText: '取消',
-          confirmText: '确认',
-          isSync: false,
-          isShow: false,
-          cancel: function () {},
-          confirm: function () {},
-          editItem:"",
-          titleStyle:'',
-          width:"75%",
-          height:"500px",
-          formData:"",//父组件传递的参数 负责传给子组件
-        }
-      },
-      props:{
-        loading: { type: Boolean, default: false },
-      },
-      watch:{
-          isShow(a,b){
-              this.editItem = this.loadViewFn(this.editItem)
-          },
-      },
-      methods: {
-        onCancel () {
-            this.isShow = false
-            this.cancel()
-        },
-        onConfirm () {
-            this.loading = true  
-            let isOk = this.$refs.childRef.childFn()  //子组件方法 必须命名一致
-            if(isOk || isOk==undefined){ //如果子组件没有 return false 就代表子组件方法一切正常
-              this.isShow = false
-              this.confirm()
-            }else{ //否则
-              console.log('弹窗不关闭')
-            }
-        },
-        loadingFn(e){ //加载状态
-            this.loading = e
-        },
-        loadViewFn (view) {
-         return (r) =>
-          require.ensure([], () =>
+    </div>
+  </transition>
+</template>
+<script>
+export default {
+  name: 'index',
+  data () {
+    return {
+      title: '提示',
+      cancelText: '取消',
+      confirmText: '确认',
+      isSync: false,
+      isShow: false,
+      cancel: function () { },
+      confirm: function () { },
+      editItem: "",
+      titleStyle: 'center',
+      width: "75%",
+      height: "500px",
+      formData: "",//父组件传递的参数 负责传给子组件
+    }
+  },
+  props: {
+    loading: { type: Boolean, default: false },
+  },
+  watch: {
+    isShow (a, b) {
+      this.editItem = this.loadViewFn(this.editItem)
+    },
+  },
+  methods: {
+    onCancel () {
+      this.isShow = false
+      this.cancel()
+    },
+    onConfirm () {
+      this.loading = true
+      let isOk = this.$refs.childRef.childFn()  //子组件方法 必须命名一致
+      if (isOk || isOk == undefined) { //如果子组件没有 return false 就代表子组件方法一切正常
+        this.isShow = false
+        this.confirm()
+      } else { //否则
+        console.log('弹窗不关闭')
+      }
+    },
+    loadingFn (e) { //加载状态
+      this.loading = e
+    },
+    loadViewFn (view) {
+      return (r) =>
+        require.ensure([], () =>
           r(require(`@/views/${view}.vue`))
         );
     },
-      }
-    }
-  </script>
-  <style scoped>
-    #app{
-      overflow: hidden;
-    }
-    .ls-mask{
-      width: 100%;
-      height: 100%;
-      z-index: 2001;
-      position: fixed;
-      left: 0;
-      top: 0;
-      background: rgba(0,0,0,0.3);
-    }
-    .ls-mask-window{
-      padding-top: 20px;
-      background: white;
-      position: absolute;
-      left: 50%;
-      top: 50%;
-      transform: translate(-50%,-50%);
-    }
-    .ls-mask-window b{
-      padding-left: 12px;
-    }
-    .ls-mask-content{
-      padding: 20px;
-      text-align: center;
-    }
-    .ls-mask-footer{
-      height: 45px;
-      border-top: 1px solid #f0f0f0;
-      display: flex;
-      justify-content: end;
-      padding: 2px;
-      position: absolute;
-        width: 98%;
-        bottom: 10px;
-        right: 12px;
-    }
-  /deep/.el-icon-close{
-    position: absolute;
-    top: 20px;
-    right: 12px;
-    font-size: 20px;
-    cursor: pointer;
-  }
-  /deep/.el-loading-mask{
-      background: none;
   }
-  </style>
+}
+</script>
+<style scoped>
+#app {
+  overflow: hidden;
+}
+
+.ls-mask {
+  width: 100%;
+  height: 100%;
+  z-index: 2001;
+  position: fixed;
+  left: 0;
+  top: 0;
+  background: rgba(0, 0, 0, 0.3);
+}
+
+.ls-mask-window {
+  padding-top: 20px;
+  background: white;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.ls-mask-window b {
+  padding-left: 12px;
+}
+
+.ls-mask-content {
+  padding: 20px;
+  text-align: center;
+}
+
+.ls-mask-footer {
+  height: 45px;
+  border-top: 1px solid #f0f0f0;
+  display: flex;
+  justify-content: flex-end;
+  padding: 2px;
+  position: absolute;
+  width: 98%;
+  bottom: 10px;
+  right: 12px;
+}
+
+/deep/.el-icon-close {
+  position: absolute;
+  top: 20px;
+  right: 12px;
+  font-size: 20px;
+  cursor: pointer;
+}
+
+/deep/.el-loading-mask {
+  background: none;
+}
+</style>
   
\ No newline at end of file

@@ -11,7 +11,7 @@ const service = axios.create({
     withCredentials: true,  //是否允许跨域
     headers: {
         'Content-Type': 'application/json; charset=utf-8',
-        'Authorization':'bearer AT-16-oqkOHiUSsDdFA-eAZ49k2rJQDTzQpClO'
+        'Authorization': 'bearer AT-16-oqkOHiUSsDdFA-eAZ49k2rJQDTzQpClO'
     },
     timeout: 15000
 })
@@ -85,6 +85,9 @@ function handleErrorData (errMes) {
             case 504:
                 Message.error("网络超时!");
                 break;
+            case 2002:
+                Message.error(errMes.message);
+                break;
             default:
                 Message.error("服务正在联调中，请稍后!");
                 break;

@@ -8,7 +8,7 @@
     </div>
     <div class="img-list-wrap">
       <div v-for="(img, i) in previewImg.imgList" :key="i">
-        <photo-zoom :url="img.url" :bigWidth="165" v-if="i === previewImg.index" :scale="2"
+        <photo-zoom :url="img.fjurl" :bigWidth="165" v-if="i === previewImg.index" :scale="2"
           overlayStyle="width: 100%;height: 563px;">
         </photo-zoom>
       </div>
@@ -26,7 +26,7 @@
       <ul>
         <li v-for="(img, index) in thumbnailImages" :key="index" :class="{ active:previewImg.index === index}"
           @click="showCurrent(index)">
-          <img :src="img.url">
+          <img :src="img.fjurl">
         </li>
       </ul>
     </div>
@@ -37,6 +37,7 @@
 </template>
 <script>
 import PhotoZoom from '@/components/photo-zoom'
+import { sjClmxUpload, sjClmxDelete } from '@/api/jsydsyqFlow'
 import publicPicture from '@/components/publicPicture/index.vue'
 export default {
   name: 'PreviewImage',
@@ -57,7 +58,7 @@ export default {
         degree: 0
       },
       // 缩略图
-      thumbnailImages: this.previewImg.imgList,
+      thumbnailImages: [],
       showViewer: false,
       initialIndex: undefined,
       allLi: [],
@@ -66,11 +67,16 @@ export default {
   watch: {
     previewImg: {
       handler (newValue, oldValue) {
-        this.allLi = _.cloneDeep(newValue.imgList).map(item => item.url)
+        this.allLi = _.cloneDeep(newValue.imgList).map(item => item.fjurl)
+        this.thumbnailImages = newValue.imgList
       },
       deep: true
     }
   },
+  created () {
+    this.allLi = _.cloneDeep(this.previewImg.imgList).map(item => item.fjurl)
+    this.thumbnailImages = this.previewImg.imgList
+  },
   computed: {
     isSingle () {
       return this.previewImg.imgList.length <= 1
@@ -140,22 +146,43 @@ export default {
     },
     async handleChange (file) {
       let data = _.cloneDeep(this.previewImg.imgList[this.previewImg.index])
+      var formdata = new FormData();
+      formdata.append("file", file.raw);
+      formdata.append("bsmSj", this.previewImg.bsmSj);
+      formdata.append("bsmSlsq", this.previewImg.bsmSlsq);
+      sjClmxUpload(formdata).then((res) => {
+        if (res.code == 200) {
+          this.$emit('updateList', res.result)
+          this.$message({
+            message: '上传成功!',
+            type: 'success'
+          })
+        }
+      })
     },
     handleDelete () {
-      let _this = this
-      this.$confirm('此操作将永久该附件, 是否继续?', '提示', {
+      let that = this
+      this.$confirm('此操作将永久删除, 是否继续?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning'
       }).then(async () => {
-        let bsmFileList = []
-        bsmFileList[0] = this.previewImg.imgList[this.previewImg.index].bsmFile
+        let bsmClmx = this.previewImg.imgList[this.previewImg.index].bsmClmx
+        sjClmxDelete(bsmClmx).then(res => {
+          if (res.code == 200) {
+            that.$emit('updateList', res.result)
+            that.$message({
+              message: '删除成功!',
+              type: 'success'
+            })
+          }
+        })
       }).catch(() => {
         this.$message({
           type: 'info',
           message: '已取消删除'
-        });
-      });
+        })
+      })
     }
   }
 }

@@ -29,7 +29,7 @@
             </el-collapse-transition>
           </div>
         </div>
-        <image-preview :previewImg="previewImg" />
+        <image-preview :previewImg="previewImg" @updateList="updateList" />
       </div>
     </div>
     <clxxAddDialog v-model="isDialog" />
@@ -40,7 +40,6 @@ import { mapGetters } from "vuex";
 import clxxAddDialog from "./clxxAddDialog.vue";
 import imagePreview from '@/views/components/imagePreview.vue'
 import { clmlInit, move, save, clmlDelete } from "@/api/fqsq.js";
-import { async } from "q";
 export default {
   components: { clxxAddDialog, imagePreview },
   data () {
@@ -191,11 +190,14 @@ export default {
       key: 0,
       tableData: [],
       previewImg: {
+        // 收件标识码
+        bsmSj: '',
+        bsmSlsq: this.$parent.bsmSlsq,
         index: 0,
         selectedIndex: 0,
         imgList: [
           {
-            url: 'https://img2.baidu.com/it/u=2955521104,3257476296&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=1111'
+            fjurl: 'https://img2.baidu.com/it/u=2955521104,3257476296&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=1111'
           }
         ]
       }
@@ -213,21 +215,34 @@ export default {
       return new Promise(resolve => {
         this.unitData = this.$parent.unitData;
         var formdata = new FormData();
-        formdata.append("bsmSldy", this.unitData[0].bsmSldy);
+        formdata.append("bsmSldy", this.unitData[0]?.bsmSldy);
         formdata.append("bsmSlsq", this.$parent.bsmSlsq);
         clmlInit(formdata).then((res) => {
           resolve(res.code)
-          if (res.result.result) {
+          if (res.result.result && res.result.result.length > 0) {
             this.tableData = res.result.result;
             this.treeCheckId = this.tableData[0].bsmSj;
             this.title = this.tableData[0].sjmc;
             this.titleYs = 1;
             this.titleNum = this.tableData[0].children.length;
+
+            this.previewImg.imgList = this.tableData[0]?.children;
+            this.previewImg.bsmSj = this.tableData[0]?.bsmSj;
           }
-          console.log(this.tableData);
         })
       })
     },
+    updateList (val) {
+      this.tableData.forEach(item => {
+        if (item.bsmSj === val.bsmSj) {
+          item.children = val.children
+        }
+      })
+      this.previewImg.imgList = _.cloneDeep(val.children)
+      if (this.previewImg.index == this.previewImg.imgList.length) {
+        this.previewImg.index = this.previewImg.index - 1
+      }
+    },
     // 左侧菜单点击
     menuClick (item) {
       this.checkedId = item.id
@@ -278,15 +293,8 @@ export default {
     },
     // 新增弹窗保存
     addSave (data) {
-      let maxXh = 0;
-      this.tableData && this.tableData.forEach((item) => {
-        if (item.xh > maxXh) {
-          maxXh = item.xh;
-        }
-      });
       let obj = {
-        bsmSlsq: this.id,
-        xh: maxXh + 1,
+        bsmSlsq: this.$parent.bsmSlsq,
         isrequired: "1",
         sjmc: data.clmc,
         sjsl: 0,
@@ -295,31 +303,39 @@ export default {
         sjlx: data.cllx,
         sfxjcl: "1", // 是否必选
       };
-      save(obj).then((res) => {
-        console.log(res);
+      save(obj).then(async (res) => {
         if (res.code == 200) {
-          this.$message({
+          let res = await this.clmlInitList()
+          if (res == 200) this.$message({
             message: "新增成功",
             type: "success",
-          });
-          this.tableData = res.result ? res.result : [];
-          // 加载表格
-          this.clmlmxInit();
+          })
         }
       });
     },
     // 材料目录删除
     handleDelete (index, row) {
-      clmlDelete({ sjBsm: row.bsmSj }).then((res) => {
-        if (res.code == 200) {
-          this.$message({
-            message: "删除成功",
-            type: "success",
-          });
-          // 加载表格
-          this.clmlmxInit();
-        }
-      });
+      let that = this
+      this.$confirm('此操作将永久删除该 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        clmlDelete({ sjBsm: row.bsmSj }).then(async (res) => {
+          if (res.code == 200) {
+            let res = await that.clmlInitList()
+            if (res == 200) that.$message({
+              message: "删除成功",
+              type: "success",
+            })
+          }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        })
+      })
     },
     // 材料目录关闭收起
     iconClick () {
@@ -333,9 +349,8 @@ export default {
     // 材料目录点击选中
     treeClick (item) {
       this.treeCheckId = item.bsmSj;
-      this.title = item.sjmc;
-      this.titleYs = 1;
-      this.titleNum = item.children.length;
+      this.previewImg.imgList = item?.children;
+      this.previewImg.bsmSj = item?.bsmSj;
     },
     // 小图片点击
     imgClick (item, index) {

@@ -57,7 +57,7 @@
     <zc ref="zcDialogRef" v-model="zcDialog" :queryForm="queryForm" />
     <thDialog ref="thdialogRef" v-model="thflag" :bsmBusiness="bsmBusiness" :queryForm="queryForm" />
     <zslqDialog ref="zslqDialog" v-model="zslqDialog" />
-    <zsylDialog v-model="zsylFlag" />
+    <!-- <zsylDialog v-model="zsylFlag" /> -->
   </div>
 </template>
 <script>
@@ -65,7 +65,7 @@ import { leftMenu, stepExpandInfo, record } from "@/api/fqsq.js";
 import comMsg from "@/views/components/comMsg.vue";
 import zc from "./components/zc.vue";
 import thDialog from "./components/th.vue";
-import zsylDialog from "./components/zsyl";
+// import zsylDialog from "./components/zsyl";
 import zslqDialog from "./components/zslq";
 export default {
   /**注册组件*/