style:css报错处理

任超
Showing 2 changed files with 123 additions and 108 deletions
src/views/ywbl/fqsq/components/szxx.vue
src/views/ywbl/fqsq/fqsq.vue
--- a/src/views/ywbl/fqsq/components/szxx.vue
View file @e332135
+++ b/src/views/ywbl/fqsq/components/szxx.vue
View file @e332135
 <template>
-  <div class="szxx">
+   <div class="szxx">
-    <el-card class="box-card" v-for="(item,index) in tableData" :key="index">
+      <el-card class="box-card" v-for="(item,index) in tableData" :key="index">
-       <div slot="header" class="szxx_header">
+         <div slot="header" class="szxx_header">
            <span class="header_type">{{item.bdcqzlx == 1 ? '不动产权证书' : '不动产登记证明'}}</span>
            <div class="header_text">{{item.bdcqzh}}</div>
-        </div>
+         </div>
-        <div class="szxx_body card_padding">
+         <div class="szxx_body card_padding">
-           <div class="text color_iray">
+            <div class="text color_iray">
               <span>{{item.qllxmc}}</span>
-               </div>
+            </div>
            <div class="text color_red">
               <span>{{item.qlr}}</span>
            </div>
@@ -28,13 +28,13 @@
               <span>{{item.syqx}}</span>
            </div>
            <div v-if="item.ysxlh">
-                <div class="top_line middle_margin"></div>
+               <div class="top_line middle_margin"></div>
               <div class="text color_iray">
                  <span>印刷序列号：{{item.ysxlh}}</span>
               </div>
            </div>
-        </div>
+         </div>
-        <div class="card_padding">
+         <div class="card_padding">
            <div class="top_line middle_margin"></div>
            <div class="text" v-if="item.bsmSz">
               <el-button class="operation_button" type="text" @click="openZsylDialog(item)">证书预览</el-button>
@@ -43,189 +43,206 @@
            <div class="text" v-else>
               <el-button class="operation_button" type="text" @click="openZsylDialog(item)">证书打印（0）</el-button>
            </div>
-        </div>
-    </el-card>
-    <el-dialog title="证书打印" :visible.sync="invalidDiglog" width="30%" :modal-append-to-body='false' top='30vh'>
-       <div class="invalid-diglog">
-          <div class="invalid-title">
-            <i class="el-icon-question invalid-icon"></i>
-            <div class="invalid-body">您确定作废证书并再次打印？</div>
-          </div>
-          <div class="invalid-reson">作废原因：</div>
-         <el-input v-model="zfyy" placeholder="请输入作废原因"  type="textarea" :rows="4"></el-input>
-         <div class="dialog-footer">
-            <el-button @click="closeInvalidDiglog()">取 消</el-button>
-            <el-button type="primary" @click="confirmInvalid()">确 定</el-button>
         </div>
-       </div>
+      </el-card>
-     </el-dialog>
+      <el-dialog title="证书打印" :visible.sync="invalidDiglog" width="30%" :modal-append-to-body='false' top='30vh'>
-   <zsylDialog ref="zsylDialog" v-model="zsylFlag" :value='zsylFlag'/>
+         <div class="invalid-diglog">
-  </div>
+            <div class="invalid-title">
+               <i class="el-icon-question invalid-icon"></i>
+               <div class="invalid-body">您确定作废证书并再次打印？</div>
+            </div>
+            <div class="invalid-reson">作废原因：</div>
+            <el-input v-model="zfyy" placeholder="请输入作废原因" type="textarea" :rows="4"></el-input>
+            <div class="dialog-footer">
+               <el-button @click="closeInvalidDiglog()">取 消</el-button>
+               <el-button type="primary" @click="confirmInvalid()">确 定</el-button>
+            </div>
+         </div>
+      </el-dialog>
+      <zsylDialog ref="zsylDialog" v-model="zsylFlag" :value='zsylFlag' />
+   </div>
 </template>
 <script>
 import zsylDialog from "./zsyl";
-import { getBdcqzList,invalidCertificate } from "@/api/fqsq.js";
+import { getBdcqzList, invalidCertificate } from "@/api/fqsq.js";
 export default {
-  components: { zsylDialog },
+   components: { zsylDialog },
-  props: {
+   props: {
+   },
-  },
+   data () {
+      return {
-  data() {
+         tableData: [],
-    return {
+         zsylFlag: false,
-      tableData: [],
+         bdcqzlx: 1,
-      zsylFlag: false,
+         bdcqz: {},
-      bdcqzlx: 1,
+         zfyy: '',
-      bdcqz: {},
+         invalidDiglog: false,
-      zfyy: '',
+         bsmSz: '',
-      invalidDiglog: false,
+      };
-      bsmSz: '',
+   },
-    };
+   async created () {
-  },
+      this.list();
-  async created() {
+   },
-   this.list();
+   methods: {
-  },
+      //初始化列表
-  methods: {
+      list () {
-     //初始化列表
-      list(){
         var bsmSldy = this.$parent._data.unitData[0].bsmSldy
-         getBdcqzList({bsmSldy:bsmSldy}).then(res => {
+         getBdcqzList({ bsmSldy: bsmSldy }).then(res => {
            if (res.code === 200) {
               this.tableData = res.result
-               if(res.result){
+               if (res.result) {
-                  this.bdcqz = res.result[0]     
+                  this.bdcqz = res.result[0]
               }
            }
         })
      },
      //打开证书预览弹窗
-      openZsylDialog(item){
+      openZsylDialog (item) {
         this.zsylFlag = true;
         this.bdcqz = item;
         this.$nextTick(() => {
            this.$refs.zsylDialog.ysxlhList();
-          });
+         });
      },
      //再次打印
-     openInvalidDiglog(item){
+      openInvalidDiglog (item) {
         this.bsmSz = item.bsmSz;
         this.invalidDiglog = true
-     },
+      },
-     closeInvalidDiglog(){
+      closeInvalidDiglog () {
         this.invalidDiglog = false
         this.bsmSz = '';
         this.zfyy = '';
-     },
+      },
-     //作废缮证信息
+      //作废缮证信息
-     confirmInvalid(){
+      confirmInvalid () {
-      invalidCertificate({"bsmSz":this.bsmSz,"zfyy": this.zfyy}).then(res => {
+         invalidCertificate({ "bsmSz": this.bsmSz, "zfyy": this.zfyy }).then(res => {
-         if (res.code === 200) {
+            if (res.code === 200) {
-            this.list();
+               this.list();
-            this.$message.success('作废成功');
+               this.$message.success('作废成功');
-            this.invalidDiglog = false;
+               this.invalidDiglog = false;
-            this.openZsylDialog(this.bdcqz);
+               this.openZsylDialog(this.bdcqz);
-          }else{
+            } else {
-            this.$message.error(res.message);
+               this.$message.error(res.message);
-          }
+            }
-      })
+         })
-     }
+      }
-  }
+   }
 };
 </script>
 <style scoped lang='scss'>
 @import "~@/styles/public.scss";
 .szxx {
-  box-sizing: border-box;
+   box-sizing: border-box;
-  padding-right: 15px;
+   padding-right: 15px;
-  width: 100%;
+   width: 100%;
-  height: 600px;
+   height: 600px;
-  overflow-y: scroll;
+   overflow-y: scroll;
-  .box-card {
-     float: left;
+   .box-card {
-     width: 330px;
+      float: left;
-     margin-top: 20px;
+      width: 330px;
-     margin-right: 20px;
+      margin-top: 20px;
-     height: 440px;
+      margin-right: 20px;
-     .szxx_body {
+      height: 440px;
-        height: 240px;
-     }
+      .szxx_body {
-  }
+         height: 240px;
+      }
+   }
 }
 .szxx_header {
-   color:white;
+   color: white;
-   font-weight:bolder;
+   font-weight: bolder;
   font-size: 18px;
-   .header_type{
+   .header_type {
      display: flex;
      justify-content: center;
      align-content: center;
   }
-   .header_text{
+   .header_text {
      text-align: center;
-      margin-top:10px;
+      margin-top: 10px;
      height: 50px;
      line-height: 30px;
   }
 }
 .top_line {
-   border-top: 2px solid rgb(222,222,222);
+   border-top: 2px solid rgb(222, 222, 222);
 }
 .text {
   margin-bottom: 10px;
   text-align: center;
 }
 .color_iray {
-   color: rgb(153,153,153);
+   color: rgb(153, 153, 153);
 }
 .color_red {
-   color: rgb(255,89,24);
+   color: rgb(255, 89, 24);
 }
 .middle_margin {
   margin-bottom: 10px;
 }
 .operation_button {
   border: 1px solid rgb(0, 121, 254);
   padding: 15px 10px;
   text-align: center;
   width: 100px;
 }
 .card_padding {
-   padding-top:20px
+   padding-top: 20px
 }
 .invalid-diglog {
   padding-bottom: 20px;
   font-size: 16px;
   font-weight: bold;
   color: rgb(99, 99, 99);
   .invalid-title {
      display: flex;
      align-content: center;
-      .invalid-icon{
-         color:rgb(254,148,0);
+      .invalid-icon {
+         color: rgb(254, 148, 0);
         font-size: 34px;
         margin-right: 10px;
      }
-      .invalid-body{
+      .invalid-body {
         line-height: 40px;
         margin-bottom: 10px;
      }
   }
   .invalid-reson {
-       margin-bottom: 10px;
+      margin-bottom: 10px;
   }
-   .dialog-footer{
+   .dialog-footer {
      margin-top: 10px;
      display: flex;
-      justify-content: end;
+      justify-content: flex-end;
   }
 }
-/deep/.el-card__header{
+/deep/.el-card__header {
-   background-color: rgb(198,67,83);
+   background-color: rgb(198, 67, 83);
 }
-/deep/.el-card__body{
+/deep/.el-card__body {
   padding: 0px
 }
 </style>
\ No newline at end of file
--- a/src/views/ywbl/fqsq/fqsq.vue
View file @e332135
+++ b/src/views/ywbl/fqsq/fqsq.vue
View file @e332135
@@ -344,8 +344,6 @@ export default {
      li:hover {
        border: 1px solid #ffffff;
        border-radius: 5px;
-        //color: $light-blue ;
        .svg-icon {
          //color: $light-blue ;
        }