<template>
  <a-modal v-model="visible" width="1000px" title="权限配置" @ok="save">
    <sd-child-table
      v-model="values"
      label="权限配置"
      :class="$style.table"
      :fields="fields"
      :columns="[{ dataIndex: 'setCode', sdHidden: true }]"
      :show-selection="
        (record) => {
          if (record.setCode === 'USERS' || record.setCode === 'BUSINESS-ADMIN') {
            return false
          }
          return true
        }
      "
    >
      <template v-slot:form="{ model }">
        <sd-form-item
          name="setName"
          :input-props="{
            disabled: model.setCode === 'USERS' || model.setCode === 'BUSINESS-ADMIN',
          }"
        />
        <div v-if="model.setCode === 'USERS'" :class="['ant-form-extra ', $style.description]">
          <sdFormItemHelp html="该权限集默认授予所有人员" />
        </div>
        <sd-form-item name="perms" />
        <sd-form-item name="dataPerms" />
        <div v-if="model.setCode === 'USERS'" :class="['ant-form-extra ', $style.description]">
          <sdFormItemHelp
            html="仅本人：仅可操作由本人创建的数据<br>所有人：可操作所有人创建的数据"
          />
        </div>
        <a-form-model-item v-show="model.setCode !== 'USERS'" label="授予角色">
          <sd-role-picker v-model="model.assignRole" } />
        </a-form-model-item>
        <a-form-model-item v-show="model.setCode !== 'USERS'" label="授予部门">
          <sd-group-picker v-model="model.assignGroup" />
        </a-form-model-item>
      </template>
    </sd-child-table>
  </a-modal>
</template>

<script>
import { message } from 'ant-design-vue'
import sdFormItemHelp from '@/common/components/sd-form/sd-form-item-help.vue'
import axios from '@/common/services/axios-instance'
import components from './_import-components/sd-form-perm-config-import'
const o = {
  新建: 'create',
  编辑: 'update',
  查看: 'view',
  删除: 'delete',
  仅本人: 'findList-owner',
  所有人: 'findList',
  create: '新建',
  update: '编辑',
  view: '查看',
  delete: '删除',
  'findList-owner': '仅本人',
  findList: '所有人',
}
export default {
  name: 'SdFormPermConfig',
  metaInfo: {
    title: 'SdFormPermConfig',
  },
  components: {
    sdFormItemHelp,
    ...components,
  },
  data() {
    return {
      visible: false,
      fields: [
        {
          name: 'setName',
          caption: '权限集名称',
          dataType: 'string',
          required: true,
          attr: { regexMessage: '格式有误', maxLength: 100 },
        },
        {
          name: 'setCode',
          attr: { regexMessage: '格式有误' },
          caption: 'setCode',
          dataType: 'string',
        },
        {
          name: 'perms',
          attr: {
            multiple: 'true',
            selectListItem: [
              { label: '新建', value: 'create' },
              { label: '编辑', value: 'update' },
              { label: '查看', value: 'view' },
              { label: '删除', value: 'delete' },
            ],
          },
          caption: '操作权限',
          dataType: 'selectlist',
        },
        {
          name: 'dataPerms',
          attr: {
            multiple: 'false',
            selectListItem: [
              { label: '仅本人', value: 'findList-owner' },
              { label: '所有人', value: 'findList' },
            ],
            defaultValue: 'findList-owner',
          },
          caption: '数据权限',
          dataType: 'selectlist',
        },
        {
          name: 'assignRole',
          attr: { selectionType: 'GROUP', multiple: 'true' },
          caption: '授予角色',
          dataType: 'selectperson',
        },
        {
          name: 'assignGroup',
          attr: { selectionType: 'GROUP', multiple: 'true' },
          caption: '授予部门',
          dataType: 'selectperson',
        },
      ],
      values: [],
    }
  },
  created() {},
  methods: {
    show(id) {
      this.visible = true
      this.formId = id
      // 默认权限
      axios
        .get('api/framework/v1/onlperm/permSetList?formId=' + this.formId)
        .then((res) => {
          if (res.data.data.length === 0) {
            return [
              {
                setCode: 'USERS',
                setName: '使用权限',
                perms: [
                  {
                    permCode: 'create',
                    permName: '新建',
                  },
                  {
                    permCode: 'update',
                    permName: '编辑',
                  },
                  {
                    permCode: 'view',
                    permName: '查看',
                  },
                  {
                    permCode: 'delete',
                    permName: '删除',
                  },
                  {
                    permCode: 'findList-owner',
                    permName: '仅本人',
                  },
                ],
                assignRole: [],
                assignGroup: [],
              },
              {
                setCode: 'BUSINESS-ADMIN',
                setName: '管理权限',
                perms: [
                  {
                    permCode: 'create',
                    permName: '新建',
                  },
                  {
                    permCode: 'update',
                    permName: '编辑',
                  },
                  {
                    permCode: 'view',
                    permName: '查看',
                  },
                  {
                    permCode: 'delete',
                    permName: '删除',
                  },
                  {
                    permCode: 'findList',
                    permName: '列表查看',
                  },
                ],
                assignRole: [],
                assignGroup: [],
              },
            ]
          }
          return res.data.data
        })
        .then((onlPermSetBeans) => {
          // 整成子表的格式
          this.values = onlPermSetBeans.map((item) => {
            const perms = item.perms.map((i) => i.permCode)
            item.perms = perms.filter((permCode) => !permCode.includes('findList')).join(',')
            item.dataPerms = perms.filter((permCode) => permCode.includes('findList')).join(',')
            item.assignRole = JSON.stringify(item.assignRole)
            item.assignGroup = JSON.stringify(item.assignGroup)
            return item
          })
        })
    },
    save() {
      const onlPermSetBeans = JSON.parse(JSON.stringify(this.values)).map((item) => {
        item.assignRole = JSON.parse(item.assignRole || '[]')
        item.assignGroup = JSON.parse(item.assignGroup || '[]')
        item.perms = [
          ...(item.perms
            ? item.perms.split(',').map((v) => ({
                permCode: v,
                permName: o[v],
              }))
            : []),
          {
            permCode: item.dataPerms,
            permName: o[item.dataPerms],
          },
        ]
        item.dataPerms = undefined
        item.formId = this.formId
        return item
      })
      axios
        .post('api/framework/v1/onlperm/savePermAndSet?formId=' + this.formId, onlPermSetBeans)
        .then(() => {
          message.success('保存成功')
          this.visible = false
        })
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
.table {
  :global(.anticon-setting) {
    display: none;
  }
  > div:first-child {
    font-size: 0;
  }
  td > span {
    cursor: pointer;
  }
}
.description {
  margin-top: -20px;
  margin-bottom: 15px;
  margin-left: 150px;
}
</style>
