认定-倒查弹窗样式调整

src/views/cxyrd/TL.vue

@@ -43,6 +43,40 @@
             <div class="content">平面-右拇</div>
           </div>
         </div>
+        <div class="other">
+          <div class="outside">
+            <div class="label">比中单位：</div>
+            <div class="content">北京市朝阳区公安局分局</div>
+            <div class="label">单位代码：</div>
+            <div class="content">123123123123</div>
+            <div class="label">比中时间：</div>
+            <div class="content">2021-09-23 14:54</div>
+          </div>
+          <div class="outside">
+            <div class="label">比中人：</div>
+            <div class="content">张XX</div>
+            <div class="label">比中人身份证号：</div>
+            <div class="content">412************016</div>
+            <div class="label">比中人联系电话：</div>
+            <!-- todo 电话长度校验-->
+            <div class="content">110</div>
+          </div>
+        </div>
+        <div class="remark">
+          <div class="label">备注</div>
+          <el-input
+            class="remark-input"
+            type="textarea"
+            placeholder="在此输入备注信息"
+            :rows="4"
+            v-model="text"
+          >
+          </el-input>
+        </div>
+        <div class="btns">
+          <div class="ok-btn">确认</div>
+          <div class="close-btn">取消</div>
+        </div>
       </div>
     </el-dialog>
     <!--    <div v-show="dialog" class="popContainer" @click="hideDialog"></div>-->
@@ -61,7 +95,7 @@ export default {
     TLCandidate
   },
   data() {
-    return { isDialogShow: false, dialog: false };
+    return { isDialogShow: false, dialog: false, text: "" };
   },
   methods: {
     Bz() {
@@ -158,44 +192,73 @@ div {
 }
 .bz-dialog {
   .tl {
-    width: 753px;
+    width: 763px;
     height: 634px;
     .type {
       display: flex;
-      width: 743px;
+      width: 763px;
       height: 160px;
-      border: #cda869 1px solid;
-      margin: 0;
       background: rgba(230, 0, 18, 0.04);
     }
+    .other {
+      display: flex;
+      width: 763px;
+      height: 160px;
+      //background: rgba(230, 0, 18, 0.04);
+    }
+    .remark {
+      display: flex;
+      flex-direction: column;
+      width: 763px;
+      height: 120px;
+      padding-top: 16px;
       .label {
-      width: 70px;
-      height: 22px;
+        width: 28px;
+        height: 19px;
         font-size: 14px;
         font-family: MicrosoftYaHei;
-      color: #333333;
-      line-height: 22px;
+        color: #666666;
+        line-height: 19px;
       }
-    .content {
-      width: 190px;
-      height: 22px;
+    }
+    .btns {
+      width: 763px;
+      height: 40px;
+      text-align: center;
+      margin-top: 30px;
+      .ok-btn {
+        width: 72px;
+        height: 40px;
+        background: #ffffff;
+        border-radius: 4px;
+        border: 1px solid #aeb5c2;
+        color: #2e3846;
         font-size: 14px;
-      font-family: MicrosoftYaHei;
-      color: #333333;
-      line-height: 22px;
+        line-height: 40px;
+        text-align: center;
+        margin-right: 24px;
+      }
+      .close-btn {
+        width: 72px;
+        height: 40px;
+        background: #055fe7;
+        border-radius: 4px;
+        color: #ffffff;
+        font-size: 14px;
+        line-height: 40px;
+        text-align: center;
+      }
     }
   }
 }
 .outside {
-  width: 371px;
+  width: 381px;
   height: 148px;
-  border: #0e9a00 1px solid;
   padding-top: 12px;
   padding-left: 30px;
   //padding: 24px 0 24px 30px;
   .label {
-    border: #0e0eff 1px solid;
-    width: 70px;
+    width: 118px;
     height: 22px;
     font-size: 14px;
     font-family: MicrosoftYaHei;
@@ -203,8 +266,7 @@ div {
     line-height: 22px;
   }
   .content {
-    border: 1px darkmagenta solid;
-    width: 190px;
+    width: 161px;
     height: 22px;
     font-size: 14px;
     font-family: MicrosoftYaHei;
@@ -223,3 +285,17 @@ div {
 //  background: rgba(255, 255, 255, 0.1);
 //}
 </style>
+<style scoped>
+.remark-input {
+  width: 763px;
+  /*background: #f6f8fa;*/
+}
+/*/deep/ .el-input__inner {*/
+/*  width: 763px;*/
+/*  height: 108px;*/
+/*  background: #f6f8fa;*/
+/*  box-shadow: 0px 1px 2px 0px rgba(5, 95, 231, 0.18);*/
+/*  border-radius: 4px;*/
+/*  border: 1px solid #eeeeee;*/
+/*}*/
+</style>

src/views/cxyrd/modules/TLCandidate.vue

@@ -38,7 +38,8 @@ export default {
   data() {
     return {
       input3: "",
-      tableData: ""
+      tableData: "",
+      checked: ""
     };
   },
   methods: {