CheckDetail.vue 3.89 KB
<template>
  <div class="container">
    <BasicDrawer
      @register="register"
      v-bind="$attrs"
      showFooter
      title="字段编辑权限申请"
      width="60%"
      :destroyOnClose="true"
      :isDetail="true"
      @ok="handleSubmit"
      :showDetailBack="false"
      okText="申请"
      ><input />
      <div>
        <template v-if="role === ROLE.ADMIN || role === ROLE.TRACKER">
          <h3>基本信息</h3>
          <BasicForm @register="registerForm" />
        </template>
      </div>
      <!-- <template #titleToolbar> <a-button type="primary"> 申请编辑权限 </a-button></template> -->

      <!-- <template #appendFooter>
      <a-button type="primary" @click="onGoFormDetail"> 返回编辑</a-button>
    </template> -->
    </BasicDrawer>
  </div>
</template>
<script lang="ts">
  import { computed, defineComponent, reactive, ref } from 'vue';
  import { BasicForm, useForm } from '/@/components/Form/index';
  import { orderAuth } from '/@/api/project/order';
  import { ROLE } from '../../../financeList/type.d';
  import { useModal } from '/@/components/Modal';

  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  import { FIELDS_BASE_INFO } from './tableData';
  import { useUserStoreWithOut } from '/@/store/modules/user';

  const userStore = useUserStoreWithOut();
  const getSchema = (fields) =>
    fields
      .map((item) => ({
        field: `${item.field}`,
        dataIndex: `${item.field}`,
        label: item.label,
        component: 'Switch',
        componentProps: {
          checkedValue: 'UN_LOCKED',
          unCheckedValue: 'LOCKED',
        },
        colProps: {
          span: 6,
        },
      }))
      .filter(
        (item) =>
          // item.field !== 'packetPrice' &&
          item.field !== 'exchangeRate' && item.field !== 'profitRate',
      );

  export default defineComponent({
    components: { BasicDrawer, BasicForm },
    props: {
      onGoFormDetail: {
        type: Function,
      },
    },
    setup() {
      const id = ref('');
      const schemas = getSchema(FIELDS_BASE_INFO);
      const [registerForm, { getFieldsValue }] = useForm({
        labelWidth: 120,
        schemas,
        showActionButtonGroup: false,
        actionColOptions: {
          span: 24,
        },
      });
      const lockFields = reactive({});
      const [register, { closeDrawer }] = useDrawerInner((data) => {
        Object.assign(lockFields, data.lockFields);
        id.value = data.id;
      });
      function handleCloseModal() {
        closeDrawer();
      }

      const role = computed(() => {
        return userStore.getUserInfo?.roleSmallVO?.code;
      });

      const handleSubmit = async () => {
        const baseFieldValues = getFieldsValue();

        if (baseFieldValues) {
          FIELDS_BASE_INFO.map(
            ({ field }) =>
              (baseFieldValues[field] =
                baseFieldValues[field] === 'UN_LOCKED' ? 'UN_LOCKED' : 'LOCKED'),
          );
        }
        const values = Object.assign({ orderId: id.value }, { baseFields: baseFieldValues });

        if (
          values.baseFields &&
          (values.baseFields.projectNo === 'UN_LOCKED' ||
            values.baseFields.productionDepartment === 'UN_LOCKED' ||
            values.baseFields.innerNo === 'UN_LOCKED' ||
            values.baseFields.customerCode === 'UN_LOCKED' ||
            values.baseFields.customerPo === 'UN_LOCKED' ||
            values.baseFields.customerStyle === 'UN_LOCKED')
        ) {
          openReasonModal(true, {
            data: values,
          });
        } else {
          await orderAuth(values);
          closeDrawer();
        }
      };

      return {
        register,
        schemas,
        registerForm,
        handleSubmit,
        handleCloseModal,
        ROLE,
        role,
      };
    },
  });
</script>
<style>
  .container {
    position: fixed; /* 或 absolute, fixed */
    z-index: 10;
  }
</style>