用户

liuyg

2021-09-24 c4e67a8942e514b65ab41bb19781d50576c15725

 src/views/securityGuard/securityGuardDetail.vue

@@ -10,7 +10,12 @@
        :data="data1"
        :page.sync="page1"
        :table-loading="loading1"
        @refresh-change="refreshChange1"
        @row-save="rowSave1"
        @row-update="rowUpdate1"
        @row-del="rowDel1"
        @current-change="CurrentChange1"
        @refresh-change="refreshchange1"
        @size-change="SizeChange1"
      >
      </avue-crud>
    </span>
@@ -23,9 +28,71 @@
        @row-update="rowUpdate2"
        @row-del="rowDel2"
        :table-loading="loading2"
        @refresh-change="refreshChange2"
        @current-change="CurrentChange2"
        @size-change="SizeChange2"
        @refresh-change="refreshchange2"
      >
      </avue-crud>
    </span>
    <span v-else-if="typeTABS.prop === 'tab4'">
      <!-- 保安员证 -->
      <div class="baoanzheng" id="baoanzheng" v-if="hold == 1">
        <div class="baz-main">
          <div class="baz-m-body" ref="baoanzheng">
            <div class="bmb-heard">保安员证</div>
            <div class="img">
              <div v-if="!obj0.avatar">暂无照片</div>
              <img :src="obj0.avatar" 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>
      <div v-else style="width: 100%; text-align: center; padding-top: 20px">
        无保安证
      </div>
    </span>
    <span v-else-if="typeTABS.prop === 'tab5'">
      <securityCertificate :data="obj0" v-if="hold == 1"></securityCertificate>
      <div v-else style="width: 100%; text-align: center; padding-top: 20px">
        无保安证书
      </div>
    </span>
  </div>
</template> 
@@ -36,23 +103,39 @@
  practitionersColumn,
  trackRecordColumn,
} from "./data";
import { getUserPractitionersInfo } from "@/api/system/user";
import {
  addExperience,
  updateExperience,
  getExperienceDetail,
  experienceRemove,
  getExperienceList,
} from "@/api/experience/experience";

import {
  getPerformanceInfo,
  add,
  update,
  page,
  getpage,
  remove,
  getER,
} from "@/api/performance/performance";

// import vueQr from "vue-qr";
import securityCertificate from "./securityCertificate.vue";

export default {
  components: {
    securityCertificate: securityCertificate,
  },
  data() {
    return {
      typeTABS: {}, //标签页
      row: {}, //数据
      optionTABS: {
        column: [
          {
            // icon: "el-icon-info",
            label: "保安员入职登记基本信息",
            label: "保安员基本信息",
            prop: "tab1",
          },
          {
@@ -64,6 +147,16 @@
            // icon: "el-icon-info",
            label: "现实表现记录",
            prop: "tab3",
          },
          {
            // icon: "el-icon-info",
            label: "保安员证",
            prop: "tab4",
          },
          {
            // icon: "el-icon-info",
            label: "保安员证书",
            prop: "tab5",
          },
        ],
      },
@@ -97,12 +190,12 @@
        total: 0,
      },
      query1: {},
      query2: {},
      data1: [],
      data2: [],
      option1: {
        card: true,
        menu: false,
        addBtn: false,
        menu: true,
        height: "auto",
        widtd: "auto",
        calcHeight: 54,
@@ -130,8 +223,13 @@
        align: "center",
        column: trackRecordColumn,
      },
      erweima: "",
      hold: "",
    };
  },
  // components: {
  //   vueQr,
  // },
  computed: {
    ids1() {
      let ids1 = [];
@@ -140,42 +238,69 @@
      });
      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") {
        this.loading1 = false;
      } else if (column.prop == "tab2") {
        //查询当前保安员的从业记录信息
        this.getPractitionersPageInfo();
        this.getPractitionersPageInfo(this.page1);
        this.loading1 = false;
      } else if (column.prop == "tab3") {
        //查询当前保安员的现实表现记录
        this.getPerformancePageInfo();
        this.getPerformancePageInfo(this.page2);
        this.loading2 = false;
      } else if (column.prop == "tab4") {
        getER(this.obj0.securitynumber).then((res) => {
          this.erweima = res.data;
          // console.log(res.data);
        });
      }
    },
    refreshchange1() {
      this.getPractitionersPageInfo(this.page1, this.query1);
    },
    //查询当前保安员的从业记录信息
    getPractitionersPageInfo() {
      var that = this;
    getPractitionersPageInfo(page, param = {}) {
      param["securityid"] = this.id;
      //获取用户从业信息
      console.log(this.id, "cid");
      getUserPractitionersInfo(this.id).then((res1) => {
        that.data1 = res1.data.data;
      // console.log(this.id, "cid");

      getExperienceList(page.currentPage, page.pageSize, param).then((res1) => {
        const data = res1.data.data;
        this.page1.total = data.total;
        this.data1 = data.records;
        this.loading1 = false;
      });
    },
    refreshchange2() {
      this.getPerformancePageInfo(this.page2, this.query2);
    },
    //查询当前保安员的现实表现记录信息
    getPerformancePageInfo() {
    getPerformancePageInfo(page, param = {}) {
      //获取现实表现信息
      // getPerformanceInfo(this.id).then((res) => {
      //   that.data2 = res1.data.data;
      //   console.log(that.data2, 1);
      // });
      var param = {
        securityid: this.id,
      };
      page(this.current, this.size, param).then((res2) => {
      param["securityid"] = this.id;
      getpage(page.currentPage, page.pageSize, param).then((res2) => {
        const data = res2.data.data;
        this.page2.total = data.total;
        this.data2 = data.records;
@@ -183,11 +308,53 @@
        this.loading2 = false;
      });
    },
    CurrentChange1(currentPage) {
      this.page1.currentPage = currentPage;
      this.refreshchange1();
    },
    SizeChange1(pageSize) {
      this.page1.pageSize = pageSize;
      this.refreshchange1();
    },
    CurrentChange2(currentPage) {
      this.page2.currentPage = currentPage;
      this.refreshchange2();
    },
    SizeChange2(pageSize) {
      this.page2.pageSize = pageSize;
      this.refreshchange2();
    },
    // refreshChange1() {
    //   this.getPractitionersPageInfo();
    // },
    // refreshChange2() {
    //   this.getPerformancePageInfo();
    // },

    rowSave2(form, done, loading) {
      form.securityid = this.id;
      add(form).then(
        (res) => {
          this.getPerformancePageInfo(this.page2);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          window.console.log(error);
          loading();
        }
      );
      // }
    },
    //从业记录新增
    rowSave1(form, done, loading) {
      form.securityid = this.id;
      addExperience(form).then(
        (res) => {
          this.getPractitionersPageInfo(this.page1);
          this.$message({
            type: "success",
            message: "操作成功!",
@@ -218,6 +385,23 @@
        }
      );
    },
    rowUpdate1(row, index, done, loading) {
      row.securityid = this.id;
      updateExperience(row).then(
        () => {
          this.getPractitionersPageInfo(this.page1);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          window.console.log(error);
          loading();
        }
      );
    },
    rowDel2(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
@@ -229,6 +413,23 @@
        })
        .then(() => {
          this.getPerformancePageInfo(this.page2);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
        });
    },
    rowDel1(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          return experienceRemove(row.id);
        })
        .then(() => {
          this.getPractitionersPageInfo(this.page1);
          this.$message({
            type: "success",
            message: "操作成功!",
@@ -251,6 +452,8 @@
      this.name = row.name;
      this.dispatcherCompany = row.dispatcherCompany;
      this.id = row.id;
      this.hold = row.hold;
      console.log(this.obj0);
    }

    var flag = false,
@@ -287,4 +490,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>