<template>
  <basic-page-list :desc="desc" :options="pageOptions">
    <template v-slot:column1="{ row }"> 
      <img v-if="row && row.avatar" :src="row.avatar" style="width: 100px;" /> 
    </template> 
    <template v-slot:column2="{ row }">  
      <vue-qr class="qr-code"   :text="row.qr_code" :size="120" />
    </template> 
  </basic-page-list>
</template>

<script>
import BASE_URL from '@/services/mes/api.js';

import vueQr from 'vue-qr';

export default {
  i18n: require("./i18n"),
  props: {

  },
  
  components: { 
    vueQr
  },
  data() {
    return {
      pageOptions: {}
    };
  },
  // 计算属性
  computed: {
    // 页面描述
    desc() {
      return this.$t("pageDesc");
    }
  },


  // 创建完成
  created() {
    this.optionsInit();
  },
  // 动作
  methods: {

    optionsInit() {
      // 页面数据
      var pageData = { // 页面数据变量

        keyName: 'id', // 主键字段名 
        listFieldName: 'MesStaff',

        addPageUrl: "/MesStaff/MesStaffAdd",
        editPageUrl: "/MesStaff/MesStaffUpdate/",

        // 接口动作
        actions: { // Api 接口地址
          // =============================== 接口地址 自动生成 Start ===============================
          MesStaffList: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/list`, // 员工列表
          MesStaffDetail: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/detail`, // 员工详情
          MesStaffCreate: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/create`, // 创建员工
          MesStaffUpdate: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/update`, // 更新员工
          MesStaffDelete: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/detele`, // 删除员工
          MesStaffBatchDelete: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/batchDelete`, // 批量删除员工
          MesStaffBatchUpdate: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/batchUpdate`, // 批量更新员工
          MesStaffBatchCreate: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/batchCreate`, // 批量创建员工
          MesStaffExportExcel: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/export/excel`, // 导出员工数据到EXCEL
          MesStaffImportExcel: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/import/excel`, // 批量导入EXCEL员工数据
          MesStaffOpen: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/open`, // 打开员工
          MesStaffClose: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/close`, // 关闭员工
          StaffWagesList: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/wages/list`, // 员工工资方案列表
          StaffWagesDetail: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/wages/detail`, // 员工工资方案详情
          StaffWagesCreate: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/wages/create`, // 创建员工工资方案
          StaffWagesUpdate: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/wages/update`, // 更新员工工资方案
          StaffWagesDelete: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/wages/detele`, // 删除员工工资方案
          StaffWagesBatchDelete: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/wages/batchDelete`, // 批量删除员工工资方案
          StaffWagesBatchUpdate: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/wages/batchUpdate`, // 批量更新员工工资方案
          StaffWagesBatchCreate: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/wages/batchCreate`, // 批量创建员工工资方案
          StaffWagesExportExcel: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/wages/export/excel`, // 导出员工工资方案数据到EXCEL
          StaffWagesImportExcel: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/wages/import/excel`, // 批量导入EXCEL员工工资方案数据
          StaffTypeList: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/type/list`, // 员工类型列表
          StaffTypeDetail: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/type/detail`, // 员工类型详情
          StaffTypeCreate: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/type/create`, // 创建员工类型
          StaffTypeUpdate: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/type/update`, // 更新员工类型
          StaffTypeDelete: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/type/detele`, // 删除员工类型
          StaffTypeBatchDelete: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/type/batchDelete`, // 批量删除员工类型
          StaffTypeBatchUpdate: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/type/batchUpdate`, // 批量更新员工类型
          StaffTypeBatchCreate: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/type/batchCreate`, // 批量创建员工类型
          StaffTypeExportExcel: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/type/export/excel`, // 导出员工类型数据到EXCEL
          StaffTypeImportExcel: `${BASE_URL.BASE_URL}/MesStaff/v1/staff/type/import/excel`, // 批量导入EXCEL员工类型数据
          MesStaffPrintTemplateList: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/print/template/list`, // 员工打印模板列表
          MesStaffPrintTemplateDetail: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/print/template/detail`, // 员工打印模板详情
          MesStaffPrintTemplateCreate: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/print/template/create`, // 创建员工打印模板
          MesStaffPrintTemplateUpdate: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/print/template/update`, // 更新员工打印模板
          MesStaffPrintTemplateDelete: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/print/template/detele`, // 删除员工打印模板
          MesStaffPrintTemplateBatchDelete: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/print/template/batchDelete`, // 批量删除员工打印模板
          MesStaffPrintTemplateBatchUpdate: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/print/template/batchUpdate`, // 批量更新员工打印模板
          MesStaffPrintTemplateBatchCreate: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/print/template/batchCreate`, // 批量创建员工打印模板
          MesStaffPrintTemplateExportExcel: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/print/template/export/excel`, // 导出员工打印模板数据到EXCEL
          MesStaffPrintTemplateImportExcel: `${BASE_URL.BASE_URL}/MesStaff/v1/mes/staff/print/template/import/excel`, // 批量导入EXCEL员工打印模板数据

          // =============================== 接口地址 自动生成 End ===============================
        },

        start_time: 0, // 开始时间
        end_time: 0, // 结束时间


        //搜索区
        searchFormData: {
          title: '',
          desc: '',
        },
        // 搜索区配置
        searchRules: [
          { key: "title", mode: "like" },
          { key: "desc", mode: "like" }
        ],
        //搜索区
        searchFormItems: [ // 子项
          { field: 'title', title: '标题', span: 5, itemRender: { name: '$input', props: { placeholder: '请输入标题' } } },
          { field: 'desc', title: '描述', span: 5, itemRender: { name: '$input', props: { placeholder: '请输入描述' } } },


          { span: 8, slots: { default: 'date' } },  // 自定义列
          {
            align: 'right', span: 4, itemRender: {  // 按钮列
              name: '$buttons', children: [{ props: { type: 'submit', content: '搜索', status: 'primary' } },  // 搜索按钮
              { props: { type: 'reset', content: '重置' } }]
            }
          }
        ],


        //数据区
        gridOptions: { // 表格配置
          height: '100%', // 表格高度  100% 会自动撑满父容器
          stripe: true, // 启用斑马纹
          id: 'datagrid_1', // 表格唯一标识

          // 表格列配置
          columns: [
            { type: 'checkbox', width: 'auto' }, // 多选框
            { type: 'seq', width: 'auto' }, // 序号

            { title: '操作', slots: { default: 'op' }, width: 120 },

            // =============================== 表格列 自动生成 Start ===============================

            { slots: { default: 'column1' }, title: '员工头像', width: 130 },
            { slots: { default: 'column2' }, title: '扫码', width: 130 },
            


            { field: 'name', sortable: true, title: '员工姓名', width: 250 }, // 员工姓名
            { field: 'code', sortable: true, title: '员工工号', width: 250 }, // 员工工号
            { field: 'base_department', formatter: 'formatRef', params: { dataType: "object", textField: "name" }, title: '部门', width: 250 },
            { field: 'phone', sortable: true, title: '员工电话', width: 250 }, // 员工电话
            { field: 'email', sortable: true, title: '员工邮箱', width: 250 }, // 员工邮箱
            //{ field: 'password', sortable: true, title: '员工密码', width: 250 }, // 员工密码
            //{ field: 'salt', sortable: true, title: '员工盐', width: 250 }, // 员工盐
            { field: 'nickname', sortable: true, title: '员工昵称', width: 250 }, // 员工昵称
            //{ field: 'openid', sortable: true, title: '员工openid', width: 250 }, // 员工openid
            //{ field: 'unionid', sortable: true, title: '员工unionid', width: 250 }, // 员工unionid
            //{ field: 'session_key', sortable: true, title: '员工session_key', width: 250 }, // 员工session_key
            //{ field: 'department_id', sortable: true, title: '部门ID', width: 250 }, // 部门ID
            //{ field: 'process_id', sortable: true, title: '工序ID', width: 250 }, // 工序ID
            //{ field: 'process_scheme_id', sortable: true, title: '工序方案ID', width: 250 }, // 工序方案ID
            { field: 'entry_date', sortable: true, title: '入职日期', formatter: 'formatDate', width: 250 }, // 入职日期
            { field: 'departure_date', sortable: true, title: '离职日期', formatter: 'formatDate', width: 250 }, // 离职日期
            //{ field: 'is_piecework', sortable: true, title: '是否计件', width: 250 }, // 是否计件
            { field: 'remark', sortable: true, title: '备注', width: 250 }, // 备注
            { field: 'status', slots: { default: 'status' }, width: 80, sortable: true, title: '状态', showHeaderOverflow: true }, // 状态 
            { field: 'create_time', formatter: 'formatDate', width: 100, sortable: true, title: '创建时间', showHeaderOverflow: true }, // 创建时间
            { field: 'update_time', formatter: 'formatDate', width: 100, sortable: true, title: '更新时间', showHeaderOverflow: true }, // 更新时间

            // =============================== 表格列 自动生成 Start ===============================


          ]
        }

      };

      pageData.actions.getList = pageData.actions.MesStaffList;
      pageData.actions.delete = pageData.actions.MesStaffBatchDelete;
      pageData.gridOptions = Object.assign({}, this.$mk.config.defaults.gridOptions, pageData.gridOptions); // 合并表格数据


      this.pageOptions = pageData;
    },


  },
  watch: {

  }
};

</script> 