style:业务申请

@@ -81,14 +81,14 @@
   }
 
   .ywsq-right {
-    width: calc(100% - 270px);
-    margin-left: 10px;
+    width: calc(100% - 265px);
+    margin-left: 5px;
     height: 100%;
     display: flex;
     flex-direction: column;
 
     .right-type {
-      margin-bottom: 20px;
+      margin-bottom: 5px;
     }
 
     .right-title {
@@ -171,13 +171,26 @@
       }
     }
 
+    .registration {
+      li:hover {
+        border: 1px solid $borderColor !important;
+        color: $light-blue;
+      }
+
+      .cactive {
+        border: 1px solid $light-blue;
+        color: $light-blue;
+      }
+    }
+
     .submit-button {
       padding: 15px 0;
       text-align: center;
       background-color: #fff;
     }
   }
-  .right-btn{
+
+  .right-btn {
     text-align: center;
     margin-top: 20px;
   }

@@ -38,12 +38,13 @@
         </div>
         <div v-if="n == -1">
           <div class="right-title">登记情形</div>
-          <ul>
-            <li v-for="(item, index) in busList" :key="index">
+          <ul class="registration">
+            <li v-for="(item, index) in busList" @click="handleSelect(item)" :class="item.cselect ? 'cactive' : ''"
+              :key="index">
               <p>
                 {{ item.name }}
               </p>
-              <p :class="item.select ? 'active' : ''" @click="handleCollection(item)">
+              <p :class="item.select ? 'active' : ''" @click.stop="handleCollection(item)">
                 <i class="el-icon-star-off" :class="item.select ? 'active' : ''"></i>
               </p>
             </li>
@@ -51,9 +52,6 @@
         </div>
       </div>
       <div class="submit-button">
-        <el-button type="primary">选择不动产信息</el-button>
-      </div>
-      <div class="right-btn">
         <el-button type="primary" @click="btnClick()">选择不动产信息</el-button>
       </div>
     </div>
@@ -61,7 +59,7 @@
   </div>
 </template>
 <script>
-  import choiceDialog from "./components/choiceDialog.vue"
+import choiceDialog from "./components/choiceDialog.vue"
 export default {
   data () {
     return {
@@ -124,15 +122,18 @@ export default {
       busList: [
         {
           name: '国有建设用地使用权 || 首次登记+ 以出让方式取得',
-          select: false
+          select: false,
+          cselect: false,
         },
         {
           name: '国有建设用地使用权 || 首次登记+ 以出让方式取得',
-          select: false
+          select: false,
+          cselect: false,
         },
         {
           name: '国有建设用地使用权 || 首次登记+ 以出让方式取得',
-          select: false
+          select: false,
+          cselect: false,
         }
       ],
       isDialog: false,
@@ -158,6 +159,12 @@ export default {
     handleCollection (item) {
       item.select = !item.select
     },
+    handleSelect (item) {
+      this.busList.forEach(item => {
+        item.cselect = false
+      })
+      item.cselect = !item.cselect
+    },
     handleTypeSelect (item) {
       this.typeList.forEach(item => {
         if (item.select) item.select = false
@@ -165,7 +172,7 @@ export default {
       this.$set(item, 'select', true)
     },
     // 选择不动产信息
-    btnClick(){
+    btnClick () {
       this.isDialog = true
     },
   }