人像比中信息

src/components/compareInfo.vue

+<template>
+  <div class="drawer-cont" v-loading="loading">
+    <div class="cont top">
+      <div class="left">
+        <p class="p-title">原图</p>
+        <p><el-image :src="ytp" lazy></el-image></p>
+        <div class="zcbd" @click="getResult">再次对比</div>
+        <p class="p3">{{ dswObj.xxlyms }}</p>
+      </div>
+      <div class="right">
+        <p class="p-title" style="padding-left: 20px;">比中结果</p>
+        <ul v-if="rows.length > 0">
+          <li v-for="(item, index) in rows" :key="index">
+            <p><el-image src="" lazy></el-image></p>
+            <p class="p2"><span><img class="card-img" src="../assets/img/bdjg.png"/>{{ item.xm }}</span><span class="bfb">99%</span></p>
+            <p class="p3">{{ item.cyzjZjhm }}</p>
+            <div class="rd" @click="submit(item.xxzjbh)">认定</div>
+          </li>
+        </ul>
+        <ul v-else style="margin-left: 20px;">
+          暂无数据
+        </ul>
+      </div>
+    </div>
+    <div class="cont middle">
+      <p class="p-title">认定战果<span class="num">{{ rdjgList.length || 0 }}</span></p>
+      <el-tabs v-model="activeName" @tab-click="handleClick">
+        <el-tab-pane  v-for="(item, index) in rdjgList" :key="index" :label="'战果' + `${index+1}`" :name="'index' + `${index}`">
+          <div class="zhanguo">
+            <div><el-image src="" lazy></el-image></div>
+            <div class="div-zg">
+              <p><span class="span01">姓名:</span><span class="span02">{{ item.xm }}</span></p>
+              <p><span class="span01">证件号码:</span><span class="span02">{{ item.cyzjZjhm }}</span></p>
+              <p><span class="span01">性别:</span><span class="span02">{{ item.xbdmStr }}</span></p>
+              <p><span class="span01">出生日期:</span><span class="span02">{{ item.csrq }}</span></p>
+            </div>
+            <!-- <div class="div-zg">
+              <p><span class="span01">{{ item.xm }}:</span><span class="span02">艾哈迈德-麦麦提</span></p>
+              <p><span class="span01">身份证号:</span><span class="span02">G10275175017061065111</span></p>
+              <p><span class="span01">性别:</span><span class="span02">男</span></p>
+              <p><span class="span01">出生日期:</span><span class="span02">1987-8-23</span></p>
+            </div> -->
+          </div>
+        </el-tab-pane>
+      </el-tabs>
+    </div>
+    <div class="bottom">
+      <el-button type="primary" @click="gameOver">完成</el-button>
+    </div>
+  </div>
+</template>
+<script>
+import { post } from "@/utils/http.js";
+import { postform } from "@/utils/http.js";
+import url from "@/api/base";
+
+export default {
+  data() {
+    return {
+      activeName: 'index0',
+      rows: [], // 比中结果列表
+      dswObj: [], // 比对信息详情
+      ytp: '', // 原图片
+      rdjgList: [], //认定战果
+      loading: false
+    }
+  },
+  props: {
+    cxUrl: String,
+    cxUrl2: String,
+    cxUrl3: String,
+    cxUrl4: String,
+    table: Boolean,
+    table: Boolean,
+    xxzjbh: String
+  },
+  methods: {
+    handleClose(done) {
+      done()
+    },
+    handleClick(tab, event) {
+      console.log(tab, event);
+    },
+    getResult() {
+      this.loading = true
+      post(`${url.alyIP}${this.cxUrl}`, {xxzjbh:this.xxzjbh}).then(
+        (res) => {
+          if (res.success) {
+            this.rows = res.data.rows
+          }
+          this.loading = false
+        }
+      );
+    },
+    getDetail() {
+      post(`${url.alyIP}${this.cxUrl2}`, {xxzjbh:this.xxzjbh}).then(
+        (res) => {
+          if (res.success) {
+            this.dswObj = res.data.rows
+            this.ytp = 'data:image/jpeg;base64,' + res.data.rows.zpDzwjnr
+          }
+        }
+      );
+    },
+    submit(xxzjbh) {
+      this.loading = true
+      post(`${url.alyIP}${this.cxUrl3}`, {xxzjbh:xxzjbh}).then(
+        (res) => {
+          if (res.success) {
+            this.getRdjg()
+          }
+          this.loading = false
+        }
+      );
+    },
+    getRdjg() {
+      this.loading = true
+      post(`${url.alyIP}${this.cxUrl4}`, {xxzjbh:this.xxzjbh}).then(
+        (res) => {
+          if (res.success) {
+            this.rdjgList = res.data.rows
+          }
+          this.loading = false
+        }
+      );
+    },
+    gameOver() {
+      this.$emit('changeTable')
+    }
+  },
+  mounted() {
+    if(this.table) {
+      this.getResult()
+      this.getDetail()
+      // this.getRdjg()
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+.drawer-cont{
+  ::v-deep .el-image{
+    img{
+      width: 112px;
+      height: 130px;
+    }
+  }
+  .top {
+    display: flex;
+    // justify-content: space-between;
+    border-bottom: 1px solid #C7C7C7;
+    margin-bottom: 10px !important;
+    padding-bottom: 10px !important;
+    .left{
+      // width: 112px;
+      .zcbd{
+        width: 112px;
+        height: 32px;
+        color: #0061F7;
+        line-height: 32px;
+        text-align: center;
+        background: #EBF2FF;
+        border: 1px solid #0061F7;
+        opacity: 1;
+        border-radius: 4px;
+        margin: 20px 0;
+        cursor: pointer;
+      }
+      .p3{
+        font-size: 14px;
+        font-weight: 400;
+        color: #C4C4C4;
+      }
+    }
+    .right{
+      padding-left: 35px;
+      height: 280px;
+      overflow-y: scroll;
+      ul{
+        overflow: hidden;
+        li{
+          float: left;
+          width: 112px;
+          margin: 0px 19px 25px;
+          .p2{
+            display: flex;
+            justify-content: space-between;
+            font-size: 14px;
+            .bfb{
+              font-size: 14px;
+              color: #1A1A1A;
+              font-weight: bold;
+              color: #FF9500;
+            }
+          }
+          .p3{
+            font-size: 11px;
+            color: #999999;
+            font-weight: 400;
+          }
+          .card-img{
+            width: auto;
+            height: 16px;
+            margin-right: 5px;
+          }
+          .rd{
+            width: 112px;
+            height: 25px;
+            background: #FFFFFF;
+            border: 1px solid #C4C4C4;
+            opacity: 1;
+            border-radius: 4px;
+            text-align: center;
+            line-height: 25px;
+            cursor: pointer;
+          }
+        }
+      }
+    }
+  }
+  .middle{
+    .zhanguo{
+      display: flex;
+      // justify-content: space-between;
+      margin-top: 15px;
+      .div-zg{
+        width: 288px;
+        font-size: 14px;
+        margin-top: 18px;
+        margin-left: 35px;
+        .span01{
+          display: inline-block;
+          margin-right: 10px;
+          width: 64px;
+          color: #808591;
+        }
+        .span02{
+          color: #222222;
+        }
+      }
+    }
+  }
+  .bottom{
+    border-top: 1px solid #C7C7C7;
+    text-align: right;
+    position: fixed;
+    bottom: 0;
+    padding: 5px 20px;
+    background: #fff;
+    width: 800px;
+    z-index: 9999;
+  }
+  .cont{
+    margin: 5px 35px;
+  }
+  .p-title{
+    font-size: 15px;
+    color: #1A1A1A;
+    font-weight: bold;
+    margin-bottom: 5px;
+    .num{
+      color: #fff;
+      width: 24px;
+      height: 20px;
+      line-height: 20px;
+      background: #FF9500;
+      opacity: 1;
+      border-radius: 10px;
+      display: inline-block;
+      font-size: 14px;
+      margin-left: 7px;
+      text-align: center;
+      vertical-align: text-bottom;
+    }
+  }
+  ::v-deep .el-tabs__nav{
+    border-bottom: 1px solid #C7C7C7;
+  }
+  ::v-deep .el-tabs__item{
+    color: #656565;
+    width: 90px;
+    text-align: center;
+    padding: 0;
+    height: 30px;
+    line-height: 30px;
+  }
+  ::-webkit-scrollbar {
+    width: 7px;
+    height: 7px;
+  } /*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
+  ::-webkit-scrollbar-track {
+    background-color: linear-gradient(#0d1d36, #134792);
+  } /*定义滚动条轨道 内阴影+圆角*/
+  ::-webkit-scrollbar-thumb {
+    background-color: #D9D9DA;
+    border-radius: 6px;
+  } /*定义滑块 内阴影+圆角*/
+}
+</style>

src/views/dswtzxx/bzxx/rx.vue

@@ -26,7 +26,7 @@
             </template>
 
         </right-content>
-        <el-drawer
+        <!-- <el-drawer
                 :with-header="false"
                 :visible.sync="table"
                 direction="rtl"
@@ -54,6 +54,22 @@
                 </template>
             </right-content>
             </div>
+        </el-drawer> -->
+        <el-drawer
+          destroy-on-close
+          title="我是标题"
+          :visible.sync="table"
+          direction="rtl"
+          size="840px">
+          <compare-info
+            @changeTable="changeTable" 
+            :xxzjbh="xxzjbh" 
+            :table="table" 
+            cxUrl="/Rxbzrw/selectJglist"
+            cxUrl2="/Rxbzrw/selectDetain"
+            cxUrl3='/Rxbzrw/updateRxbdrdById'
+            cxUrl4='/Rxbzrw/selectRdJglist'>
+          </compare-info>
         </el-drawer>
     </div>
 </template>
@@ -64,10 +80,12 @@
   import { deleteRyzpById } from "@/api/dswtz/rxxx.js";
   import {bdzt} from "@/assets/js/transformFormTable.js";
   import {leftMenus} from "@p/dswtzxx/index.js";
+  import compareInfo from "@c/compareInfo.vue";
   export default {
     name: "lbxx",
     components: {
       rightContent,
+      compareInfo
     },
     data() {
       return {
@@ -243,7 +261,7 @@
         let row = scope.row
         this.table = true
         let xxzjbh  = row.xxzjbh
-        this.cxFormData1.xxzjbh = xxzjbh
+        // this.cxFormData1.xxzjbh = xxzjbh
         this.xxzjbh = xxzjbh
       },
       toSwtzxxgl(i){
@@ -309,8 +327,10 @@
           path:'/ryxxrxbj',
           query:{rybh:row.asjxgrybh}
         })
-
       },
+      changeTable() {
+        this.table = false
+      }
     },
     mounted() {},
   };
@@ -365,4 +385,13 @@
 </style>
 <style scoped lang="scss">
     @import "@/assets/styles/rightContent.scss";
+    ::v-deep .el-drawer__header{
+      height: 38px;
+      line-height: 38px;
+      margin-bottom: 0;
+      padding: 0;
+      padding-left: 25px;
+      font-size: 15px;
+      border-bottom: 1px solid #C7C7C7;
+    }
 </style>

src/views/hbyprw/hbyptj/queryHbyptj.vue

@@ -22,7 +22,8 @@
             unlink-panels
             value-format="yyyy-MM-dd HH:mm:ss"
           >
-        </el-date-picker></el-form-item>
+          </el-date-picker>
+        </el-form-item>
         <el-form-item label="是否专业用户组：" label-width="140px">
           <el-radio v-model="radio" label="1">是</el-radio>
           <el-radio v-model="radio" label="2">否</el-radio>