材料信息接口调试

吴蕾
Showing 3 changed files with 210 additions and 137 deletions
src/api/fqsq.js
src/views/ywbl/fqsq/components/clxx.vue
src/views/ywbl/fqsq/fqsq.vue
--- a/src/api/fqsq.js
View file @d19b44e
+++ b/src/api/fqsq.js
View file @d19b44e
@@ -69,3 +69,12 @@ export function save (data) {
        data
    })
 }
+// 材料目录批量删除
+export function clmlDelete (params) {
+    return request({
+        url: '/zhcx/clml/delete',
+        method: 'delete',
+        params: params
+    })
+}
--- a/src/views/ywbl/fqsq/components/clxx.vue
View file @d19b44e
+++ b/src/views/ywbl/fqsq/components/clxx.vue
View file @d19b44e
@@ -28,18 +28,18 @@
      <!-- 材料预览 -->
      <div class="clyl-box" v-if="checkedId == '2'">
        <div class="menu-tree">
-          <div class="item" v-for="item in treedata" :key="item.id">
+          <div class="item">
-            {{ item.label }}
+            材料目录
            <i :class="iclass" @click="iconClick()"></i>
            <el-collapse-transition>
              <div v-show="menuOpen">
                <div
-                  v-for="item2 in item.children"
+                  v-for="item in tableData"
-                  :key="item2.id"
+                  :key="item.bsmSj"
-                  :class="['child', treeCheckId == item2.id ? 'checked' : '']"
+                  :class="['child', treeCheckId == item.bsmSj ? 'checked' : '']"
-                  @click="treeClick(item2)"
+                  @click="treeClick(item)"
                >
-                  {{ item2.label }}
+                  {{ item.sjmc }}
                </div>
              </div>
            </el-collapse-transition>
@@ -47,7 +47,12 @@
        </div>
        <div class="clyl-img">
          <div class="header">
-            <div class="title">{{ title }}</div>
+            <div class="title" v-if="titleNum == 0">
+              {{ title }}
+            </div>
+            <div class="title" v-else>
+              {{ title }} ({{ titleYs }} / {{ titleNum }})
+            </div>
            <div class="i-group">
              <i class="el-icon-zoom-in"></i>
              <i class="el-icon-zoom-out"></i>
@@ -56,16 +61,22 @@
              <i class="el-icon-document"></i>
            </div>
          </div>
+          <div class="prev" @click="imgPrev()" v-if="imgList.length > 0">
+            <i class="el-icon-arrow-left"></i>
+          </div>
          <div class="img-box">
            <img :src="showImg.imgUrl" alt="" />
          </div>
+          <div class="next" @click="imgNext()" v-if="imgList.length > 0">
+            <i class="el-icon-arrow-right"></i>
+          </div>
          <div class="img-list">
            <div class="item" v-for="(item, index) in imgList" :key="index">
              <img
                :class="showImg.id == item.id ? 'active' : ''"
                :src="item.imgUrl"
                alt=""
-                @click="imgClick(item)"
+                @click="imgClick(item, index)"
              />
            </div>
          </div>
@@ -81,16 +92,14 @@
  </div>
 </template>
 <script>
+import { mapGetters } from "vuex";
 import clxxAddDialog from "./clxxAddDialog.vue";
 import { upward, down } from "@/utils/operation";
-import { clmlInit, move, save } from "@/api/fqsq.js";
+import { clmlInit, move, save, clmlDelete } from "@/api/fqsq.js";
+import filter from "@/utils/filter.js";
 export default {
  components: { clxxAddDialog },
-  props: {
-    id: "",
-    unitData: Array,
-  },
  data() {
    return {
      isDialog: false,
@@ -120,12 +129,13 @@ export default {
            );
          },
          render: (h, scope) => {
-            if (scope.row.isAdd) {
+            // 新建的材料,可删除
+            if (scope.row.sfxjcl === "1") {
              return (
                <i
                  class="el-icon-minus pointer"
                  onClick={() => {
-                    this.handleMinus(scope.$index, scope.row);
+                    this.handleDelete(scope.$index, scope.row);
                  }}
                ></i>
              );
@@ -138,28 +148,68 @@ export default {
          type: "index",
        },
        {
-          prop: "sfbx",
+          prop: "isrequired",
          label: "是否必选",
          width: "100",
+          render: (h, scope) => {
+            // 新增的材料,全部为系统默认可选
+            if (scope.row.sfxjcl === "1") {
+              return (
+                <div>
+                  <span>可选</span>
+                </div>
+              );
+            }
+            // 系统配置的材料
+            else {
+              return (
+                <div>
+                  <span>必选</span>
+                </div>
+              );
+            }
+          },
        },
        {
-          prop: "clmc",
+          prop: "sjmc",
          label: "材料名称",
        },
        {
-          prop: "cllx",
+          prop: "sjlx",
          label: "材料类型",
+          render: (h, scope) => {
+            return (
+              <div>
+                <span>{this.dicStatus(scope.row.sjlx, "A40")}</span>
+              </div>
+            );
+          },
        },
        {
-          prop: "fs",
+          prop: "sjsl",
          label: "份数",
        },
        {
          prop: "smzt",
          label: "扫描状态",
+          render: (h, scope) => {
+            if (scope.row.children.length > 0) {
+              return (
+                <div>
+                  <span>已扫描</span>
+                </div>
+              );
+            } else {
+              return (
+                <div>
+                  <span>未扫描</span>
+                </div>
+              );
+            }
+          },
        },
        {
-          prop: "smys",
+          prop: "ys",
          label: "扫描页数",
        },
        {
@@ -193,116 +243,28 @@ export default {
      ],
      key: 0,
      tableData: [],
-      tableData1: [
-        {
-          sfbx: "必选",
-          clmc: "不动产登记申请书",
-          cllx: "原件正本",
-          fs: 2,
-          smzt: "已扫描",
-          smys: 4,
-        },
-        {
-          sfbx: "必选",
-          clmc: "申请人身份证明",
-          cllx: "正本复印件",
-          fs: 1,
-          smzt: "已扫描",
-          smys: 6,
-        },
-        {
-          sfbx: "必选",
-          clmc: "土地权属来源材",
-          cllx: "副本复印件",
-          fs: 1,
-          smzt: "未扫描",
-          smys: 0,
-        },
-        {
-          sfbx: "必选",
-          clmc: "不动产权籍调查表",
-          cllx: "副本复印件",
-          fs: 1,
-          smzt: "未扫描",
-          smys: 0,
-        },
-        {
-          sfbx: "必选",
-          clmc: "完税凭证",
-          cllx: "副本复印件",
-          fs: 1,
-          smzt: "未扫描",
-          smys: 0,
-        },
-      ],
-      treedata: [
-        {
-          id: "clml",
-          label: "材料目录",
-          children: [
-            {
-              id: "bdcdjsqs",
-              label: "不动产登记申请书",
-            },
-            {
-              id: "sqrsfzm",
-              label: "申请人身份证明",
-            },
-            {
-              id: "tdqslycl",
-              label: "土地权属来源材料",
-            },
-            {
-              id: "bdcqjdcb",
-              label: "不动产权籍调查表",
-            },
-            {
-              id: "wspz",
-              label: "完税凭证",
-            },
-          ],
-        },
-      ],
      menuOpen: true,
-      treeCheckId: "bdcdjsqs",
+      treeCheckId: "",
      defaultProps: {
        children: "children",
        label: "label",
      },
-      defaultKey: "bdcdjsqs",
+      title: "",
-      title: "不动产登记申请书 (1/2)",
+      titleYs: 1,
-      imgList: [
+      titleNum: 0,
-        {
+      imgList:[],
-          id: "1",
+      showImg:{},
-          imgUrl: require("../images/1.png"),
-        },
-        {
-          id: "2",
-          imgUrl: require("../images/2.png"),
-        },
-        {
-          id: "3",
-          imgUrl: require("../images/3.png"),
-        },
-      ],
-      showImg: {
-        id: "1",
-        imgUrl: require("../images/1.png"),
-      },
      iclass: "itemIcon el-icon-caret-bottom",
    };
  },
-  watch: {
+  computed: {
-    unitData: {
+    ...mapGetters(["dictData"]),
-      handler(newName, oldName) {
+  },
-        if (newName && newName.length > 0) {
+  mounted() {
+    if (this.$parent.index == 1) {
      this.clmlmxInit();
    }
  },
-      immediate: true,
-    },
-  },
  methods: {
    // 左侧菜单点击
    menuClick(item) {
@@ -314,36 +276,87 @@ export default {
    },
    // 上移
    moveUpward(index, row) {
-      upward(index, this.tableData);
+      let obj = {
+        xh: row.xh,
+        bsmSlsq: row.bsmSlsq,
+        moveDirection: "up",
+      };
+      // 接口待调
+      move(obj).then((res) => {
+        console.log("111111", res);
+        this.clmlmxInit();
+      });
    },
    // 下移
    moveDown(index, row) {
-      down(index, this.tableData);
+      let obj = {
+        xh: row.xh,
+        bsmSlsq: row.bsmSlsq,
+        moveDirection: "down",
+      };
+      // 接口待调
+      move(obj).then((res) => {
+        console.log("222222222", res);
+        this.clmlmxInit();
+      });
    },
    // 材料目录明细初始化
    clmlmxInit() {
+      this.id = this.$parent.$parent.$parent.id;
+      this.unitData = this.$parent.$parent.$parent.unitData;
      var formdata = new FormData();
      formdata.append("bsmSldy", this.unitData[0].bsmSldy);
      formdata.append("bsmSlsq", this.id);
      clmlInit(formdata).then((res) => {
        if (res.result.result) {
          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;
        }
      });
    },
    // 新增弹窗保存
-    addSave(data){
+    addSave(data) {
-      let obj = [...this.tableData];
+      let maxXh = 0;
-      obj.push({
+      this.tableData.forEach((item) => {
-        bsmSlsq:this.id,
+        if (item.xh > maxXh) {
-        xh: this.tableData.length + 1,
+          maxXh = item.xh;
-        isrequired:'0',
+        }
-        sjmc:data.clmc,
+      });
-        sjlx:data.cllx
+      let obj = {
-      })
+        bsmSlsq: this.id,
-      save(obj).then(res => {
+        xh: maxXh + 1,
-        console.log('22222',res);
+        isrequired: "0",
-      })
+        sjmc: data.clmc,
+        sjlx: data.cllx,
+        sfxjcl: "1", // 是否是新建材料
+      };
+      save(obj).then((res) => {
+        if (res.code == 200) {
+          this.$message({
+            message: "新增成功",
+            type: "success",
+          });
+          this.tableData = res.result;
+          // 加载表格
+          this.clmlmxInit();
+        }
+      });
+    },
+    // 材料目录删除
+    handleDelete(index, row) {
+      clmlDelete({ sjBsm: row.bsmSj }).then((res) => {
+        if (res.code == 200) {
+          this.$message({
+            message: "删除成功",
+            type: "success",
+          });
+          // 加载表格
+          this.clmlmxInit();
+        }
+      });
    },
    // 材料目录关闭收起
    iconClick() {
@@ -356,11 +369,36 @@ export default {
    },
    // 材料目录点击选中
    treeClick(item) {
-      this.treeCheckId = item.id;
+      this.treeCheckId = item.bsmSj;
+      this.title = item.sjmc;
+      this.titleYs = 1;
+      this.titleNum = item.children.length;
    },
    // 小图片点击
-    imgClick(item) {
+    imgClick(item, index) {
      this.showImg = item;
+      this.titleYs = index + 1;
+    },
+    // 图片上一张
+    imgPrev(){
+    },
+    // 图片下一张
+    imgNext(){
+    },
+    // 字典
+    dicStatus(val, code) {
+      let data = this.$store.getters.dictData[code],
+        name = "暂无";
+      if (data) {
+        data.map((item) => {
+          if (item.dcode == val) {
+            name = item.dname;
+          }
+        });
+        return name;
+      }
    },
  },
 };
@@ -489,6 +527,7 @@ export default {
        height: 800px;
        background: #f3f4f7;
        margin: 0 auto;
+        position: relative;
        .header {
          height: 54px;
          line-height: 52px;
@@ -509,6 +548,30 @@ export default {
            }
          }
        }
+        .prev,
+        .next {
+          width: 60px;
+          height: 60px;
+          line-height: 60px;
+          text-align: center;
+          font-size: 40px;
+          border-radius: 6px;
+          cursor: pointer;
+          position: absolute;
+        }
+        .prev:hover,
+        .next:hover{
+          background: #7a7a7a;
+        }
+        .prev {
+          top: 40%;
+          left: 10px;
+        }
+        .next {
+          top: 40%;
+          right: 10px;
+        }
        .img-box {
          width: 800px;
          height: calc(100% - 214px);
--- a/src/views/ywbl/fqsq/fqsq.vue
View file @d19b44e
+++ b/src/views/ywbl/fqsq/fqsq.vue
View file @d19b44e
@@ -43,7 +43,8 @@
            <div class="splitScreen-con" v-if='index == 0'>
              <component ref='slxx' :is="editItem" :flag="flag" :key="key" />
            </div>
-            <component :is="editItem" v-else :key="key" :unitData="unitData" :id="id" />
+            <component ref='clxx' :is="editItem" v-else-if="index == 1" :key="key" />
+            <component :is="editItem" v-else :key="key" />
          </el-tab-pane>
        </el-tabs>
      </div>