import { Tag } from '@arco-design/web-vue'
import { h } from 'vue'
import { passwordRule, passwordWithBlankRule } from '@/rules/user-rules'
import { phoneRule, emailRule } from '@/rules/login-rules'
import { useUserStore } from '@/store/user'
import { TableOption } from '@/types'
import axios from '@/utils/axios'
import { userActiveStatus } from '@/enums/active_status'
import { filterLabel } from '@/enums/util'
import FUserSelect from '@/components/f-user-select/index.vue'

const userStore = useUserStore()
const option: TableOption = {
  // new
  api: {
    base: '/sys/user',
    page: '/page/res',
    add: '/add',
    edit: '/edit',
    del: '/del'
  },
  permissionPrefix: 'sys_user_',
  permissions: userStore.permissions,
  // old
  searchOption: {
    columns: [
      {
        name: '姓名',
        prop: 'fullName'
      },
      {
        name: '手机号',
        prop: 'phone'
      },
      {
        name: '账号状态',
        prop: 'status',
        type: 'select',
        dicData: userActiveStatus,
        allowClear: true
      }
    ]
  },
  columns: [
    {
      name: '头像',
      prop: 'avatarUrl',
      type: 'upload',
      listType: 'picture-card',
      limit: 1,
      // 上传图片专用接口，
      // size=128表示宽高最大不能超过此值(会按比例缩放)，
      // scale=0.5表示缩小50%，
      // quality=0.8表示，
      // rotate=90表示旋转90度
      // base64=1表示返回的是base64
      action: '/sys/file/upload/image?size=80&quality=0.8',
      urlOnly: true
    },
    {
      name: '姓名',
      prop: 'fullName',
      rules: [
        { required: true, message: '姓名不能为空' },
        { minLength: 2, message: '姓名不少于2个字符' },
        { maxLength: 20, message: '不能超过20个字符' }
      ]
    },
    {
      name: '手机号',
      prop: 'phone',
      rules: phoneRule
    },
    {
      name: '邮箱',
      prop: 'email',
      rules: emailRule
    },
    {
      name: '密码',
      prop: 'password',
      display: false,
      addDisplay: true,
      editDisplay: true,
      rules: passwordRule,
      editRules: passwordWithBlankRule
    },
    {
      name: '部门',
      prop: 'deptNames',
      addDisplay: false,
      editDisplay: false
    },
    {
      name: '部门',
      prop: 'deptIds',
      type: 'tree',
      display: false,
      addDisplay: true,
      editDisplay: true,
      dicData: () => axios.post('/sys/dept/fetch/all'),
      multiple: true,
      props: {
        key: 'id',
        title: 'name',
        icon: 'iconRender'
      },
      placeholder: '选择用户所属部门(多选)',
      rules: [{ required: true, message: '请选择所属部门' }]
    },
    {
      name: '直属负责人',
      prop: 'leaderId',
      display: false,
      addDisplay: true,
      editDisplay: true,
      type: (record: any) => {
        return h(FUserSelect, {
          limit: 1,
          selectIds: record.leaderId ? [record.leaderId] : [],
          ignoreIds: [record.id],
          onChange: (val: string[]) => {
            // eslint-disable-next-line no-param-reassign
            record.leaderId = val.length > 0 ? val[0] : null
          }
        })
      }
    },
    {
      name: '角色',
      prop: 'roleIds',
      type: 'select',
      dicUrl: '/sys/role/list',
      multiple: true,
      tooltip: (record: any) => (record.isSystem ? '管理员账号默认拥有所有权限，无法修改角色' : ''),
      editDisabled: (record: any) => record.isSystem,
      props: {
        value: 'id',
        label: 'name'
      }
    },
    {
      name: '主要职位',
      prop: 'positionPrimaryId',
      type: 'select',
      dicUrl: '/sys/position/list',
      props: {
        value: 'id',
        label: 'name'
      },
      allowClear: true
    },
    {
      name: '次要职位',
      prop: 'positionSecondaryIds',
      type: 'select',
      dicUrl: '/sys/position/list',
      multiple: true,
      props: {
        value: 'id',
        label: 'name'
      },
      allowClear: true
    },
    {
      name: '账号状态',
      prop: 'status',
      type: 'select',
      value: 'normal',
      tooltip: (record: any) => (record.isSystem ? '管理员账号无法修改账号状态' : ''),
      dicData: userActiveStatus,
      disabled: (record: any) => record.isSystem,
      formatValue: (record: any) => {
        const normal = record.status === 'normal'
        return h(
          Tag,
          { color: normal ? 'green' : 'gray' },
          { default: () => [h('span', filterLabel(record.status, userActiveStatus))] }
        )
      },
      rules: [{ required: true, message: '请选择账号状态' }]
    }
    // {
    //   name: '管理员',
    //   prop: 'isSystem',
    //   width: 150,
    //   value: false,
    //   type: 'switch',
    //   addDisplay: false,
    //   editDisplay: false,
    //   formatValue: (record: any) => {
    //     return h(
    //       Tag,
    //       { color: record.isSystem ? 'orangered' : '' },
    //       { default: () => [h('span', record.isSystem ? '是' : '否')] }
    //     )
    //   }
    // }
  ]
}
export default option
