From 942c56e44f51dbc3a9ac40db9b7a2d03b68eb6cd Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Thu, 26 Aug 2021 15:53:17 +0800
Subject: [PATCH] 样式

---
 src/views/securityGuard/securityGuardDetail.vue |  213 +++++++++++++++++++++++++++++++++++++++++++++++++++--
 1 files changed, 205 insertions(+), 8 deletions(-)

diff --git a/src/views/securityGuard/securityGuardDetail.vue b/src/views/securityGuard/securityGuardDetail.vue
index 398bdaa..534670d 100644
--- a/src/views/securityGuard/securityGuardDetail.vue
+++ b/src/views/securityGuard/securityGuardDetail.vue
@@ -27,6 +27,57 @@
       >
       </avue-crud>
     </span>
+    <span v-else-if="typeTABS.prop === 'tab4'">
+      <!-- 保安员证 -->
+      <div class="baoanzheng" id="baoanzheng">
+        <div class="baz-main">
+          <div class="baz-m-body" ref="baoanzheng">
+            <div class="bmb-heard">保安员证</div>
+            <div class="img">
+              <div v-if="!obj0.myPicture">暂无照片</div>
+              <img :src="obj0.myPicture" alt="" v-else />
+            </div>
+            <div class="imgs">
+              <div v-if="erweima == ''">暂无二维码</div>
+              <img :src="erweima" alt="" v-else />
+              <!-- <img src="/img/register/ewm.png" alt="" /> -->
+              <!-- logoSrc="/img/register/ewm.png" -->
+              <!-- <vue-qr :text="goToUrl" :size="200"></vue-qr> -->
+            </div>
+
+            <!-- <img src="/img/mock/card/card-1.jpg" alt="" /> -->
+            <div class="bmb-b">
+              姓名:<span class="bmb-b-s">{{ obj0.realName }}</span>
+            </div>
+            <div class="bmb-b">
+              性别:<span class="bmb-b-s">{{ obj0.$sex }}</span>
+            </div>
+            <div class="bmb-b">
+              编号:<span class="bmb-b-s">{{ obj0.securitynumber }}</span>
+            </div>
+            <div class="bmb-b">
+              发证机关:<span class="bmb-b-s">南昌市公安局</span>
+            </div>
+            <div class="bmb-b">
+              发证日期:<span class="bmb-b-s">{{
+                obj0.paperTime.slice(0, 10)
+              }}</span>
+            </div>
+            <!-- <div class="bmb-b">
+              发证机关:<span class="bmb-b-s" style="margin-right: 15px"
+                >南昌市公安局</span
+              >发证日期:<span class="bmb-b-s">{{
+                obj0.createTime.slice(0, 10)
+              }}</span>
+            </div> -->
+          </div>
+          <span slot="footer" class="dialog-footer no-print PrintBut">
+            <el-button type="primary" @click="Print">打 印</el-button>
+            <!-- <el-button type="primary" @click="closePrint"> 取 消 </el-button> -->
+          </span>
+        </div>
+      </div>
+    </span>
   </div>
 </template> 
 
@@ -37,11 +88,22 @@
   trackRecordColumn,
 } from "./data";
 import { getUserPractitionersInfo } from "@/api/system/user";
-import { add, update, page, remove } from "@/api/performance/performance";
+import {
+  getPerformanceInfo,
+  add,
+  update,
+  page,
+  remove,
+  getER,
+} from "@/api/performance/performance";
+
+// import vueQr from "vue-qr";
+
 export default {
   data() {
     return {
       typeTABS: {}, //标签页
+      row: {}, //数据
       optionTABS: {
         column: [
           {
@@ -58,6 +120,11 @@
             // icon: "el-icon-info",
             label: "现实表现记录",
             prop: "tab3",
+          },
+          {
+            // icon: "el-icon-info",
+            label: "保安员证",
+            prop: "tab4",
           },
         ],
       },
@@ -100,7 +167,7 @@
         height: "auto",
         widtd: "auto",
         calcHeight: 54,
-        border: false,
+        border: true, //liu
         stripe: true,
         tip: false,
         index: true,
@@ -115,7 +182,7 @@
         height: "auto",
         widtd: "auto",
         calcHeight: 54,
-        border: false,
+        border: true, //liu
         stripe: true,
         tip: false,
         index: true,
@@ -124,8 +191,12 @@
         align: "center",
         column: trackRecordColumn,
       },
+      erweima: "",
     };
   },
+  // components: {
+  //   vueQr,
+  // },
   computed: {
     ids1() {
       let ids1 = [];
@@ -134,8 +205,26 @@
       });
       return ids1.join(",");
     },
+    // goToUrl() {
+    //   var url =
+    //     "http://s16s652780.51mypc.cn/securityInfo/securityInfo.html?securityNumber=" +
+    //     this.obj0.securitynumber;
+    //   return url;
+    // },
   },
   methods: {
+    Print() {
+      var printDom = document.getElementById("baoanzheng");
+      printDom.style.position = "fixed";
+      printDom.style.left = "-10%";
+      printDom.style.width = "120%";
+      printDom.style.height = "100%";
+      this.$Print(this.$refs.baoanzheng);
+      printDom.style.position = "relative";
+      printDom.style.left = "0";
+      printDom.style.width = "100%";
+      printDom.style.height = "calc(100% - 100px)";
+    },
     handleChangeTABS(column) {
       this.typeTABS = column;
       if (column.prop == "tab1") {
@@ -148,22 +237,31 @@
         //查询当前保安员的现实表现记录
         this.getPerformancePageInfo();
         this.loading2 = false;
+      } else if (column.prop == "tab4") {
+        getER(this.obj0.securitynumber).then((res) => {
+          this.erweima = res.data;
+          // console.log(res.data);
+        });
       }
     },
     //查询当前保安员的从业记录信息
     getPractitionersPageInfo() {
       var that = this;
       //获取用户从业信息
-      console.log(this.cardid, "cid");
-      getUserPractitionersInfo(this.cardid).then((res1) => {
+      console.log(this.id, "cid");
+      getUserPractitionersInfo(this.id).then((res1) => {
         that.data1 = res1.data.data;
       });
     },
     //查询当前保安员的现实表现记录信息
     getPerformancePageInfo() {
       //获取现实表现信息
+      // getPerformanceInfo(this.id).then((res) => {
+      //   that.data2 = res1.data.data;
+      //   console.log(that.data2, 1);
+      // });
       var param = {
-        cardid: this.cardid,
+        securityid: this.id,
       };
       page(this.current, this.size, param).then((res2) => {
         const data = res2.data.data;
@@ -174,7 +272,7 @@
       });
     },
     rowSave2(form, done, loading) {
-      form.cardid = this.cardid;
+      form.securityid = this.id;
       add(form).then(
         (res) => {
           this.getPerformancePageInfo(this.page2);
@@ -192,7 +290,7 @@
       // }
     },
     rowUpdate2(row, index, done, loading) {
-      row.cardid = this.cardid;
+      row.securityid = this.id;
       update(row).then(
         () => {
           this.getPerformancePageInfo(this.page2);
@@ -241,6 +339,7 @@
       this.name = row.name;
       this.dispatcherCompany = row.dispatcherCompany;
       this.id = row.id;
+      console.log(this.obj0);
     }
 
     var flag = false,
@@ -277,4 +376,102 @@
 // .el-tag--light {
 //   padding: 0 !important;
 // }
+
+.baoanzheng {
+  // position: fixed;
+  position: relative;
+  // top: 0;
+  top: 0;
+  // left: -10%;
+  left: 0;
+  // height: 0;
+  width: 100%;
+  height: calc(100% - 100px);
+  // background-color: rgba(0, 0, 0, 0.5);
+  background-color: #fff;
+  z-index: 9000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.baz-main {
+  position: relative;
+  top: 15px;
+  // width: 441px;
+  // height: 358px;
+  width: 750px;
+  height: 550px;
+  // background-color: #004ca7;
+  background-color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+}
+.baz-m-body {
+  width: 750px;
+  height: 550px;
+  background-image: url("/img/register/bazbj.png");
+  background-size: 100% 100%;
+  .bmb-heard {
+    font-size: 4rem;
+    width: 100%;
+    text-align: center;
+    letter-spacing: 1.4rem;
+    margin-bottom: 40px;
+    padding-left: 10px;
+    position: relative;
+    top: 20px;
+  }
+  .img {
+    width: 152px;
+    height: 205px;
+    border-radius: 10px;
+    position: absolute;
+    // border: 1px solid rgba($color: #888888, $alpha: 0.5);
+    top: 110px;
+    right: 80px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    img {
+      width: 100%;
+      height: 100%;
+    }
+  }
+  .imgs {
+    width: 110px;
+    height: 110px;
+    border-radius: 10px;
+    position: absolute;
+    // border: 1px solid rgba($color: #888888, $alpha: 0.5);
+    top: 330px;
+    right: 103px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    img {
+      width: 100%;
+      height: 100%;
+    }
+  }
+  .bmb-b {
+    padding-left: 20px;
+    box-sizing: border-box;
+    height: 3.9rem;
+    margin-left: 3rem;
+    width: 100%;
+    font-size: 2rem;
+    font-weight: 300;
+    .bmb-b-s {
+      display: inline-block;
+      width: 20rem;
+      font-size: 2rem;
+      font-weight: 300;
+    }
+  }
+}
+.PrintBut {
+  margin-top: 15px;
+}
 </style>
\ No newline at end of file

--
Gitblit v1.9.3