style:样式

任超
Showing 3 changed files with 55 additions and 59 deletions
src/views/zhcx/djbcx/components/bdcqljqtsx.vue
src/views/zhcx/djbcx/components/djbxxDialog.vue
src/views/zhcx/djbcx/components/djxxTable.vue
--- a/src/views/zhcx/djbcx/components/bdcqljqtsx.vue
View file @b145173
+++ b/src/views/zhcx/djbcx/components/bdcqljqtsx.vue
View file @b145173
@@ -53,7 +53,7 @@ import { mapGetters } from "vuex";
 export default {
  name: "bdcqljqtsx",
-  data() {
+  data () {
    return {
      info: {
        bdcdyh: "",
@@ -70,11 +70,11 @@ export default {
  computed: {
    ...mapGetters(["djbxx"]),
  },
-  mounted() {
+  mounted () {
    this.info.bdcdyh = this.djbxx.qlname.bdcdyh;
    this.info.qllx = this.djbxx.qlname.qllx;
-    this.djbxx.qlname.djbPrintModelList.forEach((item) => {
+    this.djbxx.qlname?.djbPrintModelList?.length > 0 && this.djbxx.qlname.djbPrintModelList.forEach((item) => {
      console.log("this.info.total", this.info.total);
      this.info.total += Number(item.xh);
      if (item.djlxPrint == "抵押权") {
@@ -98,6 +98,7 @@ export default {
  width: 100%;
  height: 100%;
  background: #fff;
  .content {
    width: 50%;
    height: 100%;
@@ -108,12 +109,14 @@ export default {
    font-weight: 700;
    font-size: 18px;
    line-height: 16px;
    .title {
      font-size: 32px;
      text-align: center;
      padding: 40px 0;
      line-height: 34px;
    }
    .underline {
      font-size: 14px;
      font-weight: normal;
--- a/src/views/zhcx/djbcx/components/djbxxDialog.vue
View file @b145173
+++ b/src/views/zhcx/djbcx/components/djbxxDialog.vue
View file @b145173
 <template>
-  <dialogBox
+  <dialogBox title="登记簿信息" width="1200px" @closeDialog="closeDialog" v-model="value" :isReset="false" :isSave="false">
-    title="登记簿信息"
-    width="1200px"
-    @closeDialog="closeDialog"
-    v-model="value"
-    :isReset="false"
-    :isSave="false"
-  >
    <div class="content">
      <div class="left">
-        <el-tree
+        <el-tree ref="tree" :data="treedata" :props="defaultProps" @node-click="handleNodeClick"
-          ref="tree"
+          :default-expand-all="true" :expand-on-click-node="false" node-key="id" :default-checked-keys="[showTab]">
-          :data="treedata"
+        </el-tree>
-          :props="defaultProps"
-          @node-click="handleNodeClick"
-          :default-expand-all="true"
-          :expand-on-click-node="false"
-          node-key="id"
-          :default-checked-keys="[showTab]"
-        ></el-tree>
      </div>
      <div class="right">
        <components :is="showTab" :showType="showType"></components>
@@ -46,7 +32,7 @@ export default {
  props: {
    value: { type: Boolean, default: false },
  },
-  data() {
+  data () {
    return {
      treedata: [
        {
@@ -125,7 +111,7 @@ export default {
  },
  watch: {
    djbxx: {
-      handler(newVlue) {
+      handler (newVlue) {
        if (newVlue) {
          var qszts = newVlue.detail.qszts;
          let isZd = newVlue.djbfm.zd;
@@ -157,17 +143,16 @@ export default {
              ")";
          });
        }
-      },
+      }
-      immediate: true,
    },
  },
  methods: {
-    closeDialog() {
+    closeDialog () {
      this.$emit("input", false);
      // 关闭时清空值
      this.$store.dispatch("djbxx/setDjbxx", null);
    },
-    handleNodeClick(data, node, elem) {
+    handleNodeClick (data, node, elem) {
      this.showTab = data.tabs;
      this.showType = data.type ? data.type : "";
    },
@@ -179,6 +164,7 @@ export default {
  width: 100%;
  height: 100%;
  display: flex;
  .left {
    width: 256px;
    height: 704px;
@@ -186,6 +172,7 @@ export default {
    color: #333;
    border: 1px solid rgb(228, 228, 228);
  }
  .right {
    width: calc(100% - 256px);
    height: 704px;
@@ -199,19 +186,23 @@ export default {
 /deep/ .el-tree-node__expand-icon {
  visibility: hidden;
 }
 /deep/ .el-tree-node__content {
  border: 1px solid rgb(228, 228, 228);
  height: 45px;
 }
-/deep/ .el-tree-node:focus > .el-tree-node__content {
+/deep/ .el-tree-node:focus>.el-tree-node__content {
  background-color: #f5f5f5;
  color: #0079fe;
  border-right: 4px solid #0079fe;
 }
 /deep/.el-tree-node {
  white-space: pre-wrap;
 }
-/deep/ .is-current > .el-tree-node__content {
+/deep/ .is-current>.el-tree-node__content {
  background-color: #f5f5f5;
  color: #0079fe;
  border-right: 4px solid #0079fe;
--- a/src/views/zhcx/djbcx/components/djxxTable.vue
View file @b145173
+++ b/src/views/zhcx/djbcx/components/djxxTable.vue
View file @b145173
@@ -18,11 +18,7 @@
          </tr>
          <!-- 第一行表头 -->
          <tr class="one">
-            <th
+            <th v-for="(item, index) in ths" :key="index" :class="[item.class, item.type == '临时' ? 'linshiIcon' : '']">
-              v-for="(item, index) in ths"
-              :key="index"
-              :class="[item.class, item.type == '临时' ? 'linshiIcon' : '']"
-            >
              <div class="icon" v-if="item.type == '临时'">{{ item.type }}</div>
              {{ item.type }}
            </th>
@@ -39,14 +35,10 @@
            <td>
              {{ item.label }}
            </td>
-            <td
+            <td v-for="(item1, index1) in showTableData" :key="index1" :class="[
-              v-for="(item1, index1) in showTableData"
+              item1.qszt == '2' ? 'lishi' : '',
-              :key="index1"
+              item1.qszt == '0' ? 'linshi' : '',
-              :class="[
+            ]">
-                item1.qszt == '2' ? 'lishi' : '',
-                item1.qszt == '0' ? 'linshi' : '',
-              ]"
-            >
              {{ item1[item.prop] }}
            </td>
          </tr>
@@ -65,7 +57,7 @@ export default {
  props: {
    showType: "",
  },
-  data() {
+  data () {
    return {
      checkList: ["临时", "现势", "历史"],
      tableWidth: 810,
@@ -83,7 +75,7 @@ export default {
  },
  watch: {
    showType: {
-      handler(newVlue) {
+      async handler (newVlue) {
        // 清空值
        this.tableData = [];
        this.ths = [];
@@ -93,20 +85,17 @@ export default {
        this.tableWidth = 810;
        let detail;
        if (newVlue === "JSYDSYQ") {
-          getJsydsyqList({
+          let res = await getJsydsyqList({
            bdcdyid: "2b33851f4edfd468ceef4d68c370bd41",
            qllx: "A03",
            qszt: ["1"]
-          }).then((res) => {
+          })
+          detail = res.result;
-            if (res.code === 200) {
-              detail = res.result;
-            }
-          });
        } else {
          detail = this.djbxx.detail.qlxxs[newVlue];
        }
-        detail.forEach((item) => {
+        console.log(detail, 'detail');
+        detail.length > 0 && detail.forEach((item) => {
          this.tableData.push(item);
          if (item.qszt == "0") {
            this.ths.push({
@@ -139,11 +128,11 @@ export default {
        let width = (this.tableData.length - 3) * 223 + this.tableWidth;
        this.tableWidth = this.tableData.length > 3 ? width : 810;
      },
-      immediate: true,
+      deep: true
    },
  },
  methods: {
-    checkChange() {
+    checkChange () {
      var checkKey = [];
      this.ths = [];
      this.tableWidth = 810;
@@ -220,6 +209,7 @@ export default {
      line-height: 62px;
      position: relative;
      margin: 1px 0;
      .checkbox {
        position: absolute;
        right: 20px;
@@ -236,24 +226,28 @@ export default {
    // .xxTable > tr th:not(:first-child) {
    //   width: 223px;
    // }
-    .xxTable > tr:first-child th {
+    .xxTable>tr:first-child th {
      width: 140px;
    }
    .xxTable {
      border-spacing: 1px;
-      tr > th {
+      tr>th {
        background: #464c5b;
        color: #fff;
        font-size: 16px;
      }
      th.linshi,
      th.xianshi {
        background: #464c5b;
      }
      th.lishi {
        background: rgba(70, 76, 91, 0.8);
      }
      .one th {
        height: 25px;
        font-size: 14px;
@@ -262,6 +256,7 @@ export default {
      th.linshi {
        color: #fe9400;
      }
      .two th {
        height: 45px;
@@ -269,9 +264,11 @@ export default {
          font-size: 14px;
        }
      }
      .linshiIcon {
        position: relative;
      }
      .linshiIcon::after {
        content: "";
        display: block;
@@ -285,6 +282,7 @@ export default {
        right: 3px;
        transform: rotate(-90deg);
      }
      .icon {
        position: absolute;
        top: 8px;
@@ -302,16 +300,20 @@ export default {
        font-size: 13px;
        width: 140px;
      }
-      > tr:nth-child(odd) td {
+      >tr:nth-child(odd) td {
        background: #f2f2f2;
      }
-      > tr:nth-child(even) td {
+      >tr:nth-child(even) td {
        background: #f9f9f9;
      }
      td.linshi {
        color: #fe9400;
      }
-      tr > td.lishi {
+      tr>td.lishi {
        color: #7f7f7f;
      }
    }