From d941e5581706cf2df4fa959b0b4832b1da45e7e3 Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Tue, 07 Sep 2021 17:12:50 +0800
Subject: [PATCH] 保安证书+
---
src/views/securityGuard/securityGuardDetail.vue | 12 ++++
public/img/securityCertificate/bj2.jpeg | 0
public/img/securityCertificate/bj.jpeg | 0
src/views/securityGuard/securityCertificate.vue | 161 +++++++++++++++++++++++++++++++++++++++++++++++++++++
public/img/securityCertificate/123.png | 0
public/img/securityCertificate/QQ截图.png | 0
6 files changed, 173 insertions(+), 0 deletions(-)
diff --git a/public/img/securityCertificate/123.png b/public/img/securityCertificate/123.png
new file mode 100644
index 0000000..d793536
--- /dev/null
+++ b/public/img/securityCertificate/123.png
Binary files differ
diff --git "a/public/img/securityCertificate/QQ\346\210\252\345\233\276.png" "b/public/img/securityCertificate/QQ\346\210\252\345\233\276.png"
new file mode 100644
index 0000000..6435ead
--- /dev/null
+++ "b/public/img/securityCertificate/QQ\346\210\252\345\233\276.png"
Binary files differ
diff --git a/public/img/securityCertificate/bj.jpeg b/public/img/securityCertificate/bj.jpeg
new file mode 100644
index 0000000..0433980
--- /dev/null
+++ b/public/img/securityCertificate/bj.jpeg
Binary files differ
diff --git a/public/img/securityCertificate/bj2.jpeg b/public/img/securityCertificate/bj2.jpeg
new file mode 100644
index 0000000..112497f
--- /dev/null
+++ b/public/img/securityCertificate/bj2.jpeg
Binary files differ
diff --git a/src/views/securityGuard/securityCertificate.vue b/src/views/securityGuard/securityCertificate.vue
new file mode 100644
index 0000000..5d24cc0
--- /dev/null
+++ b/src/views/securityGuard/securityCertificate.vue
@@ -0,0 +1,161 @@
+<template>
+ <div class="securityCertificate">
+ <div class="security_main">
+ <div class="security_m_left">
+ <div class="security_m_l_up">
+ <span class="security_m_l_u_fixed">{{ data.realName }}</span>
+ 经国家保安员考试审查合格。特颁此证。
+ </div>
+ <div class="security_m_l_center">
+ 发证公安机关 （印章）<br />
+ 发证日期 {{ data.paperTime.slice(0, 10) }}
+ </div>
+ <div class="security_m_l_down">
+ 证件编号 {{ data.securitynumber }}
+ </div>
+ </div>
+ <div class="security_m_right">
+ <div class="security_m_r_img">
+ <div v-if="!data.avatar">暂无照片</div>
+ <img :src="data.avatar" alt="" v-else />
+ </div>
+ <div class="security_m_r_once">
+ <span class="security_m_r_o_left">姓名</span>
+ <span class="security_m_r_o_right">{{ data.realName }}</span>
+ </div>
+ <div class="security_m_r_once">
+ <span class="security_m_r_o_left">出生年月</span>
+ <span class="security_m_r_o_right">{{ data.birthday }}</span>
+ </div>
+ <div class="security_m_r_once security_m_r_odizhi">
+ <span class="security_m_r_o_left security_m_r_o_l_ups">地址</span>
+ <span class="security_m_r_o_right security_m_r_o_l_r">
+ {{ data.address }}
+ </span>
+ </div>
+ <div class="security_m_r_once">
+ <div class="security_m_r_o_left">公民身份证号码</div>
+ <div class="security_m_r_o_right">{{ data.cardid }}</div>
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+export default {
+ props: ["data"],
+};
+</script>
+
+<style lang="scss" scoped>
+//保安证 本子
+.securityCertificate {
+ width: 100%;
+ height: 90%;
+ background-color: #fff;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+.security_main {
+ width: 800px;
+ height: 560px;
+ // border: 1px solid rgba($color: #a5a5a5, $alpha: 0.5);
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ background-image: url(/img/securityCertificate/123.png);
+ background-size: 100% 100%;
+ background-repeat: no-repeat;
+}
+.security_m_left,
+.security_m_right {
+ width: 380px;
+ height: 540px;
+ // background-color: rgb(226, 226, 226);
+ padding: 70px 40px;
+ box-sizing: border-box;
+ position: relative;
+ // background-image: url(/img/securityCertificate/bj2.jpeg);
+ // background-size: 100% 100%;
+ // background-repeat: no-repeat;
+}
+.security_m_left {
+ padding-left: 70px;
+ padding-right: 10px;
+}
+.security_m_l_up {
+ font-size: 22px;
+ width: 100%;
+ margin-bottom: 150px;
+ text-indent: 12rem;
+ letter-spacing: 0.5rem;
+ line-height: 2.5rem;
+ // height: ;
+}
+.security_m_l_u_fixed {
+ position: absolute;
+ width: auto;
+ left: -80px;
+}
+.security_m_l_center {
+ font-size: 18px;
+ margin-bottom: 20px;
+ line-height: 40px;
+}
+.security_m_l_down {
+ font-size: 22px;
+}
+.security_m_r_img {
+ width: 100%;
+ height: 210px;
+ display: flex;
+ // align-items: center;
+ justify-content: center;
+}
+.security_m_r_img img {
+ width: 125px;
+ height: 160px;
+}
+.security_m_r_once {
+ position: relative;
+ widows: 100%;
+ font-size: 20px;
+ margin-bottom: 10px;
+ height: auto;
+}
+.security_m_r_o_left {
+ width: 100px;
+ height: auto;
+ display: inline-block;
+ text-align: justify;
+ text-align-last: justify;
+ margin-right: 10px;
+ // display: flex;
+ // justify-content: space-around;
+}
+.security_m_r_o_right {
+ width: 190px;
+ height: auto;
+ display: inline-block;
+}
+.security_m_r_o_l_ups {
+ position: absolute;
+ // bottom: 1.7rem;
+ // height: 3rem;
+}
+.security_m_r_o_l_r {
+ position: relative;
+ left: 110px;
+}
+.security_m_r_odizhi {
+ height: 60px;
+ overflow: hidden;
+}
+// .security_m_r_o_left:after {
+// display: inline-block;
+// content: "";
+// padding-left: 100%;
+// }
+</style>
\ No newline at end of file
diff --git a/src/views/securityGuard/securityGuardDetail.vue b/src/views/securityGuard/securityGuardDetail.vue
index e40497f..f4141d8 100644
--- a/src/views/securityGuard/securityGuardDetail.vue
+++ b/src/views/securityGuard/securityGuardDetail.vue
@@ -81,6 +81,9 @@
</div>
</div>
</span>
+ <span v-else-if="typeTABS.prop === 'tab5'">
+ <securityCertificate :data="obj0"></securityCertificate>
+ </span>
</div>
</template>
@@ -108,8 +111,12 @@
} from "@/api/performance/performance";
// import vueQr from "vue-qr";
+import securityCertificate from "./securityCertificate.vue";
export default {
+ components: {
+ securityCertificate: securityCertificate,
+ },
data() {
return {
typeTABS: {}, //标签页
@@ -136,6 +143,11 @@
label: "保安员证",
prop: "tab4",
},
+ {
+ // icon: "el-icon-info",
+ label: "保安员证书",
+ prop: "tab5",
+ },
],
},
current: 1,
--
Gitblit v1.9.3