<template>
    <basic-container>
        <avue-crud
            :option="option"
            :table-loading="loading"
            :data="data"
            v-model:page="page"
            :before-open="beforeOpen"
            v-model="form"
            ref="crud"
            @row-update="rowUpdate"
            @row-save="rowSave"
            @row-del="rowDel"
            @search-change="searchChange"
            @search-reset="searchReset"
            @selection-change="selectionChange"
            @current-change="currentChange"
            @size-change="sizeChange"
            @refresh-change="refreshChange"
            @on-load="onLoad"
        >
          <template #userName="{row}">
            <span>{{ row.personnel.userName }}</span>
          </template>
          <template #ldapName="{row}">
            <span>{{ row.personnel.ldapName }}</span>
          </template>
          <template #userSex="{row}">
            <span>{{ row.personnel.userSex ? '男' : '女' }}</span>
          </template>
          <template #userCode="{row}">
            <span>{{ row.personnel.userCode }}</span>
          </template>
          <template #marriage="{row}">
            <span>{{ row.marriage ? '是' : '否' }}</span>
          </template>
          <template #mobile="{row}">
            <span>{{ row.personnel.mobile }}</span>
          </template>
      </avue-crud>
    </basic-container>
</template>

<script>
export default {
    data(){
        return{
            data:[],
            loading:false,
            page:{
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            form:{},
            query:{},
            option:{
              tip: false,
              align: 'center',
              size: 'medium',
              searchLabelWidth:120,
              simplePage: true,
              searchShow: true,
              searchMenuSpan: 6,
              searchIcon: true,
              searchIndex: 3,
              tree: false,
              border: true,
              selection: true,
              viewBtn: false,
              editBtn:false,
              addBtn:true,
              delBtn: false,
              editBtnText: '修改',
              viewBtnText:'详情',
              labelWidth: 120,
              // menuWidth: 330,
              dialogWidth: 1200,
              dialogClickModal: false,
              searchEnter: true,
              excelBtn: false,
              filterBtn: true,
              searchShowBtn: false,
              excelBtn: true,
              index: false,
              showOverflowTooltip: true,
              searchLabelPosition:'left',
searchLabelPosition:'left',
 searchGutter:24,
  searchSpan:6,
menuAlign: 'left',
gridBtn:false,
searchMenuPosition:'right',
              column: [
                {
                    label: '姓名',
                    prop: 'userName',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:true,
                    width:200,
                    rules: [
                    {
                        required: true,
                        message: '请输入姓名',
                        trigger: 'click',
                    },
                    ],
                },
                {
                    label: '工号',
                    prop: 'userCode',
                    addDisplay: false,
                    editDisplay: false,
                    hide:true,
                    span: 24,
                    search:true,
                    width:200,
                    rules: [
                    {
                        required: true,
                        message: '请输入工号',
                        trigger: 'click',
                    },
                    ],
                },
                {
                    label: 'ldap账号',
                    prop: 'ldapName',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:true,
                    width:200,
                    rules: [
                    {
                        required: true,
                        message: '请输入ldap账号',
                        trigger: 'click',
                    },
                    ],
                },
                {
                    label: '性别',
                    prop: 'userSex',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                    {
                        required: true,
                        message: '请输入性别',
                        trigger: 'click',
                    },
                    ],
                },
                {
                    label: '民族',
                    prop: 'nation',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                    {
                        required: true,
                        message: '请输入民族',
                        trigger: 'click',
                    },
                    ],
                },
                {
                    label: '年龄',
                    prop: 'age',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                    {
                        required: true,
                        message: '请输入年龄',
                        trigger: 'click',
                    },
                    ],
                },
                {
                    label: '身份证号码',
                    prop: 'idCard',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                    {
                        required: true,
                        message: '请输入身份证号码',
                        trigger: 'click',
                    },
                    ],
                },
                {
                    label: '籍贯(市县区乡组)',
                    prop: 'nativePlace',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入籍贯(市县区乡组)',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '员工编号',
                    prop: 'userCode',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:true,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入员工编号',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '所属班组',
                    prop: 'deptName',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:true,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入所属班组',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '所属岗位',
                    prop: 'station',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:true,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入所属岗位',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '出生年月',
                    prop: 'dataBirth',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入出生年月',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '政治面貌',
                    prop: 'face',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入政治面貌',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '婚姻状态',
                    prop: 'marriage',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入婚姻状态',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '毕业院校',
                    prop: 'school',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入毕业院校',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '专业',
                    prop: 'major',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入专业',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '最高学历',
                    prop: 'education',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入最高学历',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '毕业时间',
                    prop: 'endDate',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入毕业时间',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '用工类型',
                    prop: 'staffTypeTitle',
                    addDisplay: false,
                    type:'select',
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入用工类型',
                          trigger: 'click',
                      },
                    ],
                    dicData:[
                      {
                        value: 1,
                        label: '实习工'
                      }, {
                        value: 2,
                        label: '正式工'
                      }
                    ]
                },
                {
                    label: '技能等级',
                    prop: 'skillTitle',
                    addDisplay: false,
                    type:'select',
                    editDisplay: false,
                    span: 24,
                    search:true,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入技能等级',
                          trigger: 'click',
                      },
                    ],
                    dicData:[
                      {
                        value: 1,
                        label: '中级'
                      }, {
                        value: 2,
                        label: '高级'
                      }, {
                        value: 3,
                        label: '技师'
                      }
                    ]
                },
                {
                    label: '手机号码',
                    prop: 'mobile',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入手机号码',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '家庭住址',
                    prop: 'address',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入家庭住址',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '任职时间(年)',
                    prop: 'soFar',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入任职时间(年)',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '社会工龄(年)',
                    prop: 'seniority',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入社会工龄(年)',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '合同到期日期',
                    prop: 'seniority',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:true,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入合同到期日期',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '参加工作时间',
                    prop: 'joinJobDate',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:false,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入参加工作时间',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '入职时间',
                    prop: 'inJobDate',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:true,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入入职时间',
                          trigger: 'click',
                      },
                    ],
                },
                {
                    label: '状态',
                    prop: 'phStatusTitle',
                    fixed: true,
                    type:'select',
                    addDisplay: false,
                    editDisplay: false,
                    span: 24,
                    search:true,
                    width:200,
                    rules: [
                      {
                          required: true,
                          message: '请输入状态',
                          trigger: 'click',
                      },
                    ],
                    dicData:[
                      {
                        value: 1,
                        label: '实习-培训中'
                      }, {
                        value: 2,
                        label: '转岗中'
                      }, {
                        value: 3,
                        label: '正常'
                      }, {
                        value: 4,
                        label: '下岗中'
                      }, {
                        value: 5,
                        label: '离职'
                      }
                    ]
                },
              ]
            }
        }
    },
    mounted(){},
    methods:{
      searchReset() {
        this.query = {};
        this.onLoad(this.page);
      },
      searchChange(params, done) {
        this.query = params;
        this.page.currentPage = 1;
        this.onLoad(this.page, params);
        done();
      },
      selectionChange(list) {
        this.selectionList = list;
      },
      selectionClear() {
        this.selectionList = [];
        this.$refs.crud.toggleSelection();
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage;
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize;
      },
      refreshChange() {
        this.onLoad(this.page, this.query);
      },
      deleteRow(val){
        this.$confirm('确定删除该条数据?', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        }).then(() =>{

        })
      },
      onLoad(){
        this.loading = true
        this.data = [
          {id:1,
            personnel:{
              userName:"张三",
              ldapName:'',
              userSex:1,
              userCode:'0001',
              mobile:'13200120012',
            },
            nation:'汉族',
            age:30,
            idCard:"",
            nativePlace:'',
            station:'软件工程师',
            dataBirth:'1998-01',
            face:'群众',
            school:'',
            major:'',
            education:'',
            marriage:1,
            endDate:'',
            staffType:1,
            staffTypeTitle:'实习工',
            skillTitle:'中级',
            skill:1,
            dept:{
              deptName:'MES开发部'
            },
            address:'',
            soFar:4,
            seniority:10,
            conExpDate:'2027-12-31',
            joinJobDate:'2005-09-01',
            inJobDate:'2024-01-01',
            phStatusTitle:'正常'
          },
          {id:2,
            personnel:{
              userName:"张三",
              ldapName:'',
              userSex:0,
              userCode:'0001',
              mobile:'13214251123',
            },
            nation:'汉族',
            age:30,
            idCard:"",
            nativePlace:'',
            station:'软件工程师',
            dataBirth:'1998-01',
            face:'群众',
            school:'',
            major:'',
            education:'',
            marriage:1,
            endDate:'',
            staffType:2,
            staffTypeTitle:'正式工',
            skillTitle:'中级',
            skill:1,
            dept:{
              deptName:'MES开发部'
            },
            address:'',
            soFar:4,
            seniority:10,
            conExpDate:'2027-12-31',
            joinJobDate:'2005-09-01',
            inJobDate:'2024-01-01',
            phStatusTitle:'正常'
          }
        ]
        this.page.total = this.data.length
        this.loading = false
      }
    }
}
</script>

<style>

</style>