保安详情展示

Administrator

2021-07-09 f52c2aa50ff745edbddba5c4a1df0196433f848f

保安详情展示

 src/router/views/index.js

@@ -169,6 +169,19 @@
            import ( /* webpackChunkName: "views" */ '@/views/securityGuard/securityGuard')
    }]
}, {
    path: '/securityGuard',
    component: Layout,
    redirect: '/securityGuard/securityGuardDetail',
    children: [{
        path: 'securityGuardDetail',
        name: '保安员详情',
        meta: {
            i18n: 'dict'
        },
        component: () =>
            import ( /* webpackChunkName: "views" */ '@/views/securityGuard/securityGuardDetail')
    }]
}, {
    path: '/securityUnitChild',
    component: Layout,
    redirect: '/securityUnitChild/index',
@@ -179,7 +192,7 @@
            i18n: 'dict'
        },
        component: () =>
            import( /* webpackChunkName: "views" */ '@/views/securityUnitChild/index')
            import ( /* webpackChunkName: "views" */ '@/views/securityUnitChild/index')
    }]
}, {
    path: '/securityGuard',
@@ -218,6 +231,6 @@
            i18n: 'dict'
        },
        component: () =>
            import( /* webpackChunkName: "views" */ '@/views/dispatchChild/index')
            import ( /* webpackChunkName: "views" */ '@/views/dispatchChild/index')
    }]
}]

 src/views/securityGuard/data.js

New file
@@ -0,0 +1,220 @@
//保安员基本信息
export var securityBaseInfoColumn = [{
        label: "",
        labelWidth: "20",
        type: 'title',
        prop: "title",
        span: 24,
        styles: {
            fontSize: '24px'
        }
    },
    {
        label: "所属保安单位",
        prop: "tenantId",
        type: "tree",
        dicUrl: "/api/blade-system/tenant/select",
        props: {
            label: "tenantName",
            value: "tenantId"
        },
        disabled: true,
        span: 24,
    },
    {
        label: "登录账号",
        prop: "account",
        disabled: true
    },
    {
        label: "用户姓名",
        prop: "realName",
        disabled: true,
    },
    {
        label: "用户昵称",
        prop: "name",
        disabled: true
    },
    {
        label: "手机号码",
        prop: "phone",
        disabled: true
    },
    {
        label: "电子邮箱",
        prop: "email",
        disabled: true
    },
    {
        label: "身份证号",
        prop: "cardid",
        disabled: true
    },
    {
        label: "籍贯",
        prop: "nativeplace",
        disabled: true
    },
    {
        label: "民族",
        prop: "nation",
        disabled: true
    },
    {
        label: "最高学历",
        prop: "education",
        type: "select",
        dicUrl: "/api/blade-system/dict-biz/dictionary?code=educationType",
        props: {
            label: "dictValue",
            value: "dictKey"
        },
        dataType: "number",
        slot: true,
        disabled: true
    },
    {
        label: "政治面貌",
        prop: "politicaloutlook",
        disabled: true
    },
    {
        label: "身高",
        prop: "height",
        disabled: true
    },
    {
        label: "联系地址",
        prop: "address",
        disabled: true
    },
    {
        label: "户口所在地",
        prop: "registered",
        disabled: true
    },
    {
        label: "入职时间",
        prop: "rtime",
        type: 'date',
        format: "yyyy-MM-dd",
        valueFormat: "yyyy-MM-dd",
        disabled: true
    },
    {
        label: "用户性别",
        prop: "sex",
        type: "select",
        dicData: [{
                label: "男",
                value: 1
            },
            {
                label: "女",
                value: 2
            },
            {
                label: "未知",
                value: 3
            }
        ],
        disabled: true
    },
    {
        label: "用户生日",
        type: "date",
        prop: "birthday",
        disabled: true
    }


]


//从业记录
export var practitionersColumn = [{
    label: "id",
    prop: "id",
    hide: true,
    editDisplay: false,
    addDisplay: false
}, {
    label: '单位名称',
    prop: "companyname",
    formslot: true,
}, {
    label: '部门',
    prop: "department",
    formslot: true,
}, {
    label: '岗位',
    prop: "post",
    formslot: true,
}, {
    label: '岗位职责',
    prop: "responsibilities",
    formslot: true,
}, {
    label: '入职时间',
    type: 'date',
    format: "yyyy-MM-dd",
    valueFormat: "yyyy-MM-dd",
    prop: "entryTime",
    formslot: true,
}, {
    label: '离职时间',
    type: 'date',
    format: "yyyy-MM-dd",
    valueFormat: "yyyy-MM-dd",
    prop: "departureTime",
    formslot: true,
}, {
    label: '离职原因',
    prop: "leaving",
    formslot: true,
}]



export var trackRecordColumn = [{
    label: "id",
    prop: "id",
    hide: true,
    editDisplay: false,
    addDisplay: false
}, {
    label: '单位名称',
    prop: "companyname",
    formslot: true,
}, {
    label: '部门',
    prop: "department",
    formslot: true,
}, {
    label: '岗位',
    prop: "post",
    formslot: true,
}, {
    label: '岗位职责',
    prop: "responsibilities",
    formslot: true,
}, {
    label: '入职时间',
    type: 'date',
    format: "yyyy-MM-dd",
    valueFormat: "yyyy-MM-dd",
    prop: "entryTime",
    formslot: true,
}, {
    label: '离职时间',
    type: 'date',
    format: "yyyy-MM-dd",
    valueFormat: "yyyy-MM-dd",
    prop: "departureTime",
    formslot: true,
}, {
    label: '离职原因',
    prop: "leaving",
    formslot: true,
}]

 src/views/securityGuard/securityGuard.vue

@@ -21,6 +21,7 @@
                   @row-del="rowDel"
                   @row-update="rowUpdate"
                   @row-save="rowSave"
                   @row-click="rowClick"
                   :before-open="beforeOpen"
                   :page.sync="page"
                   @search-change="searchChange"
@@ -30,15 +31,11 @@
                   @size-change="sizeChange"
                   @refresh-change="refreshChange"
                   @on-load="onLoad">
          <!-- <template slot="menuLeft">
            <el-button type="danger"
                       size="small"
                       plain
                       icon="el-icon-delete"
                       v-if="permission.user_delete"
                       @click="handleDelete">删 除
                  
          <template slot-scope="{ type, size, row }" slot="menu">
            <el-button icon="el-icon-edit" :size="size" :type="type" @click.stop="rowDel(row)">离职登记
            </el-button>
          </template> -->
          </template>
          <template slot-scope="{row}"
                    slot="tenantName">
            <el-tag>{{row.tenantName}}</el-tag>
@@ -257,7 +254,7 @@
              display: false
            },
            {
              label: "所属部门",
              label: "部门名称",
              prop: "deptName",
              slot: true,
              searchSpan:4,
@@ -292,15 +289,25 @@
                }
              ]
            },
            
             {
              label: "在职状态",
              prop: "status",
              slot: true,
              display: false,
              searchSpan:3,
              search:true
            }
            {
                  label: "在职状态",
                  prop: "status",
                  type: "select",
                  dicUrl: "/api/blade-system/dict-biz/dictionary?code=workerState",
                  props: {
                    label: "dictValue",
                    value: "dictKey"
                  },
                  dataType: "number",
                  display: false,
                  searchSpan:3,
                  search:true,
                  rules: [{
                    required: true,
                    message: "请选择在职状态",
                    trigger: "blur"
                  }]
                },
          ],
          group: [
            {
@@ -677,11 +684,10 @@
      ...mapGetters(["userInfo", "permission"]),
      permissionList() {
        return {
          addBtn: this.vaildData(null, false),
          // addBtn: this.vaildData(this.permission.user_add, false),
          addBtn: this.vaildData(this.permission.user_add, false),
          viewBtn: this.vaildData(null, false),
          delBtn: this.vaildData(this.permission.user_delete, false),
          editBtn: this.vaildData(null, false)
          delBtn: this.vaildData(null, false),
          editBtn: this.vaildData(this.permission.user_edit, false)
        };
      },
      platformPermissionList() {
@@ -708,6 +714,13 @@

    },
    methods: {
      //行点击事件
      rowClick(row) {
        this.$router.push({
          path: "/securityGuard/securityGuardDetail",
          query: { row: row },
        });
      },
      nodeClick(data) {
        this.treeDeptId = data.id;
        this.page.currentPage = 1;

 src/views/securityGuard/securityGuardDetail.vue

New file
@@ -0,0 +1,196 @@
<template>
  <div class="dispatch">
    <avue-tabs :option="optionTABS" @change="handleChangeTABS"></avue-tabs>
    <span v-if="typeTABS.prop === 'tab1'">
      <avue-form ref="form" v-model="obj0" :option="option0">
      </avue-form>
    </span>
    <span v-else-if="typeTABS.prop === 'tab2'">
      <avue-crud
        :option="option1"
        :data="data1"
        :page.sync="page1"
        :table-loading="loading1"
        @refresh-change="refreshChange1"
      >
      </avue-crud>
    </span>
    <span v-else-if="typeTABS.prop === 'tab3'">
      <avue-crud
        :option="option2"
        :data="data2"
        :page.sync="page2"
        :table-loading="loading2"
        @refresh-change="refreshChange2"
      >
      </avue-crud>
    </span>
  </div>
</template> 

<script>
import { securityBaseInfoColumn, practitionersColumn,trackRecordColumn } from "./data";
import {getUserPractitionersInfo} from "@/api/system/user";
export default {
  data() {
    return {
      typeTABS: {}, //标签页
      optionTABS: {
        column: [
          {
            icon: "el-icon-info",
            label: "保安员入职登记基本信息",
            prop: "tab1",
          },
          {
            icon: "el-icon-info",
            label: "从业记录",
            prop: "tab2",
          },
          {
            icon: "el-icon-info",
            label: "现实表现记录",
            prop: "tab3",
          },
        ],
      },
      cardid: "", 
      name: "", 
      dispatcherCompany: "",
      id: "",
      obj0: {
        title: "我是头部标题",
      },
      option0: {
        emptyBtn: false,
        submitBtn: false,
        labelWidth:"110",
        gutter: 30,
        column: securityBaseInfoColumn,
      },
      loading1: true,
      loading2: true,
      selectionList1: [],
      page1: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      page2: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      query1: {},
      data1: [],
      data2: [],
      option1: {
        card: false,
        menu:false,
        addBtn:false,
        height:'auto',
        widtd:"auto",
        calcHeight: 54,
        border: false,
        stripe:true,
        tip: false,
        index: true,
        dialogClickModal: false,
        headerAlign: 'center',
        align: 'center',
        column: practitionersColumn,
      },
      option2: {
        card: false,
        menu:false,
        addBtn:false,
        height:'auto',
        widtd:"auto",
        calcHeight: 54,
        border: false,
        stripe:true,
        tip: false,
        index: true,
        dialogClickModal: false,
        headerAlign: 'center',
        align: 'center',
        column: trackRecordColumn,
      },
    };
  },
  computed: {
    ids1() {
      let ids1 = [];
      this.selectionList1.forEach((ele) => {
        ids1.push(ele.id);
      });
      return ids1.join(",");
    },
  },
  methods: {
    handleChangeTABS(column) {
      this.typeTABS = column;
      if (column.prop == "tab1") {
        this.loading1 = false;
      } else if (column.prop == "tab2") {
          //查询当前保安员的从业记录信息
          this.getPractitionersPageInfo();
          this.loading1 = false;
      } else if (column.prop == "tab3") {
          //查询当前保安员的现实表现记录
          this.getPractitionersPageInfo();
          this.loading2 = false;
      }
    },
    //查询当前保安员的从业记录信息
    getPractitionersPageInfo(){
        var that = this;
        //获取用户从业信息
        getUserPractitionersInfo(this.cardid).then(res1 =>{
            that.data1 = res1.data.data;
        })
    },
    currentChange1(val) {
      this.page1.currentPage = val;
      this.onLoad1(this.page1, this.query1);
    },
    //
    onLoad1(page, params = {}) {
      this.loading1 = true;
      params["dispatcherUnitId"] = this.id;
      console.log(params, "get");
    }
  },
  mounted() {
    this.typeTABS = this.optionTABS.column[0];
    if (this.$route.query.row) {
      var row = this.$route.query.row;
      for (var k in row) {
        this.obj0[k] = row[k];
      }
      this.obj0.title = row.name + "基本信息";
      this.cardid = row.cardid;
      this.name = row.name;
      this.dispatcherCompany = row.dispatcherCompany;
      this.id = row.id;
    }
  },
};
</script>

<style lang="scss">
.dispatch {
  width: 100%;
  height: 100%;
  //   border: 1px solid #000;
  box-sizing: border-box;
}
.el-card__body {
  padding-bottom: 5px !important;
}
.avue-crud__tip,
.el-tag,
.el-tag--light {
  padding: 0 !important;
}
</style>

 src/views/securityGuard/securityGuardRegistration copy.vue

File was deleted

 src/views/securityGuard/securityGuardRegistration.vue

@@ -380,9 +380,13 @@
  };
</script>

<style>
<style scope>
  .box {
    height: 800px;
    height: 850px;
  }

  .el-card__body{
    margin-bottom: 30px !important;
  }

  .el-scrollbar {