gx

src/view/sy_details.vue

@@ -13,8 +13,8 @@
         <el-table
           border
           :data="data.tableData"
-          style="width: 100%; height: 700px; margin-bottom: 20px"
-          max-height="800"
+          style="width: 100%; height: 712px; margin-bottom: 20px"
+          max-height="820"
           class="table_border"
           :row-style="rowState"
           :header-cell-style="tableHeaderColor"
@@ -50,8 +50,8 @@
         <el-table
           border
           :data="data.tableData1"
-          style="width: 100%; height: 700px; margin-bottom: 20px"
-          max-height="800"
+          style="width: 100%; height: 712px; margin-bottom: 20px"
+          max-height="820"
           class="table_border"
           :row-style="rowState"
           :header-cell-style="tableHeaderColor"
@@ -81,13 +81,29 @@
             <i></i>
             <i></i>
           </div>
+          <span class="text">
+            <img
+              v-if="data.first"
+              src="@/assets/sy-table/sy_details4.png"
+              class="c"
+              style="width: 350px"
+              @click="change"
+            />
+            <img
+              v-else
+              src="@/assets/sy-table/sy_details5.png"
+              class="c"
+              style="width: 350px"
+              @click="change"
+            />
+          </span>
         </div>
       </div>
       <div style="width: 97.5%">
         <el-table
           border
           :data="data.tableData2"
-          style="width: 100%; height: 700px; margin-bottom: 20px"
+          style="width: 100%; height: 712px; margin-bottom: 20px"
           max-height="800"
           class="table_border"
           :row-style="rowState"
@@ -118,6 +134,7 @@
 import { ref, reactive } from "vue";
 
 const data = reactive({
+  first: true,
   tableData: [
     {
       fullName: "王*",
@@ -394,6 +411,18 @@ const rowState = (row) => {
     };
   }
 };
+
+const leftchoose = ref({
+  first: "1",
+  second: "1",
+  third: "1",
+});
+const change = (name, index) => {
+  data.first = !data.first;
+  // leftchoose.value[name] = index;
+  // leftchoose.first = index;
+  console.log(leftchoose, 666);
+};
 </script>
 
 <style lang="scss" scoped>
@@ -714,6 +743,7 @@ const rowState = (row) => {
     position: absolute;
     right: 5px;
     top: 1px;
+    align-items: center;
   }
   .gTitle {
     position: absolute;
@@ -726,7 +756,7 @@ const rowState = (row) => {
 
   .c {
     width: 130px;
-    height: 42px;
+    height: 33px;
     cursor: pointer;
   }
 }