Showing
9 changed files
with
528 additions
and
0 deletions
src/api/equipment/errorReason.ts
0 → 100644
1 | + | ||
2 | +import { defHttp } from '/@/utils/http/axios'; | ||
3 | +import {omit} from "lodash-es"; | ||
4 | + | ||
5 | +/** | ||
6 | + * 获取列表 | ||
7 | + */ | ||
8 | +export const getEquipmentErrorList = (params) => { | ||
9 | + const { page, pageSize } = params; | ||
10 | + const otherParams = omit(params, ['page', 'pageSize']); | ||
11 | + return defHttp.post<any>({ | ||
12 | + url: `/mr/pageData?page=${page}&pageSize=${pageSize}`, | ||
13 | + params: otherParams, | ||
14 | + }); | ||
15 | +}; | ||
16 | + | ||
17 | + | ||
18 | +/** | ||
19 | + * 新增故障 | ||
20 | + */ | ||
21 | +export const equipmentErrorCategory = (params) => { | ||
22 | + return defHttp.post<any>({ | ||
23 | + url: `/mr/save`, | ||
24 | + params, | ||
25 | + }); | ||
26 | +}; | ||
27 | + | ||
28 | +/** | ||
29 | + * 删除产品分类 | ||
30 | + */ | ||
31 | +export const deleteEquipmentError = (params) => { | ||
32 | + return defHttp.post<any>({ | ||
33 | + url: `/mr/delete`, | ||
34 | + params, | ||
35 | + }); | ||
36 | +}; |
1 | +import { FormSchema } from '/@/components/Form'; | ||
2 | +import { useI18n } from '/@/hooks/web/useI18n'; | ||
3 | + | ||
4 | +export enum FormFieldsEnum { | ||
5 | + CODE = 'code', | ||
6 | + CATEGORY_NAME = 'reason', | ||
7 | +} | ||
8 | + | ||
9 | +const { t } = useI18n(); | ||
10 | + | ||
11 | +export const formSchema: FormSchema[] = [ | ||
12 | + { | ||
13 | + field: FormFieldsEnum.CODE, | ||
14 | + label: t('equipment.errorReason.nameCode'), | ||
15 | + component: 'Input', | ||
16 | + componentProps() { | ||
17 | + return { | ||
18 | + disabled: 'disabled', | ||
19 | + } | ||
20 | + } | ||
21 | + }, | ||
22 | + { | ||
23 | + field: FormFieldsEnum.CATEGORY_NAME, | ||
24 | + label: t('application.api.text.categoryName'), | ||
25 | + component: 'Input', | ||
26 | + componentProps() { | ||
27 | + return { | ||
28 | + disabled: 'disabled', | ||
29 | + }; | ||
30 | + }, | ||
31 | + }, | ||
32 | +]; |
1 | +export { default as FormDrawer } from './index.vue'; |
1 | +<script lang="ts" setup> | ||
2 | + import { nextTick, ref, unref, computed } from 'vue'; | ||
3 | + import { BasicForm, useForm } from '/@/components/Form'; | ||
4 | + import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'; | ||
5 | + import { formSchema } from './config'; | ||
6 | + import { useMessage } from '/@/hooks/web/useMessage'; | ||
7 | + import { useI18n } from '/@/hooks/web/useI18n'; | ||
8 | + import { JSONEditor } from '/@/components/CodeEditor'; | ||
9 | + import { createApplicationApi, editApplicationApi } from '/@/api/application/api'; | ||
10 | + import { ApplicationApiItemType } from '/@/api/application/model/api'; | ||
11 | + | ||
12 | + const emits = defineEmits(['success', 'register']); | ||
13 | + | ||
14 | + const { t } = useI18n(); | ||
15 | + | ||
16 | + const { createMessage } = useMessage(); | ||
17 | + | ||
18 | + const handleCount = ref<Number>(); // 0 新增 1 编辑 2 详情 | ||
19 | + | ||
20 | + const recordData = ref<ApplicationApiItemType>(); | ||
21 | + | ||
22 | + const jsonIsValid = ref(true); | ||
23 | + | ||
24 | + const [registerForm, { resetFields, validate, setFieldsValue, setProps }] = useForm({ | ||
25 | + labelWidth: 120, | ||
26 | + schemas: formSchema, | ||
27 | + showActionButtonGroup: false, | ||
28 | + }); | ||
29 | + | ||
30 | + const cacheTitle = computed(() => | ||
31 | + unref(handleCount) === 0 | ||
32 | + ? t('application.api.action.create') | ||
33 | + : unref(handleCount) === 1 | ||
34 | + ? t('application.api.action.edit') | ||
35 | + : t('application.api.action.detail') | ||
36 | + ); | ||
37 | + | ||
38 | + const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => { | ||
39 | + setDrawerProps({ loading: true }); | ||
40 | + await resetFields(); | ||
41 | + handleCount.value = data.isUpdate; | ||
42 | + recordData.value = data.record; | ||
43 | + if (unref(handleCount) === 2) { | ||
44 | + setProps({ disabled: true }); | ||
45 | + } else { | ||
46 | + setProps({ disabled: false }); | ||
47 | + } | ||
48 | + try { | ||
49 | + await nextTick(); | ||
50 | + setFieldsValue(data.record); | ||
51 | + } finally { | ||
52 | + setDrawerProps({ loading: false }); | ||
53 | + } | ||
54 | + }); | ||
55 | + | ||
56 | + const getValue = async () => { | ||
57 | + const values = await validate(); | ||
58 | + if (!values) return; | ||
59 | + try { | ||
60 | + JSON.parse(values['param']); | ||
61 | + jsonIsValid.value = true; | ||
62 | + } catch (e) { | ||
63 | + jsonIsValid.value = false; | ||
64 | + console.error(e); | ||
65 | + } | ||
66 | + if (!jsonIsValid.value) return; | ||
67 | + const mergeValue = { | ||
68 | + ...recordData.value, | ||
69 | + ...values, | ||
70 | + }; | ||
71 | + if (handleCount.value === 0) { | ||
72 | + Reflect.set(values, 'param', JSON.parse(values['param'])); | ||
73 | + await createApplicationApi(values); | ||
74 | + } else { | ||
75 | + Reflect.set(mergeValue, 'param', JSON.parse(mergeValue['param'])); | ||
76 | + await editApplicationApi(mergeValue); | ||
77 | + } | ||
78 | + createMessage.success( | ||
79 | + unref(handleCount) === 0 ? t('common.createSuccessText') : t('common.editSuccessText') | ||
80 | + ); | ||
81 | + closeDrawer(); | ||
82 | + setTimeout(() => { | ||
83 | + emits('success'); | ||
84 | + }, 500); | ||
85 | + }; | ||
86 | + | ||
87 | + const handleSubmit = () => getValue(); | ||
88 | +</script> | ||
89 | + | ||
90 | +<template> | ||
91 | + <div> | ||
92 | + <BasicDrawer | ||
93 | + destroyOnClose | ||
94 | + v-bind="$attrs" | ||
95 | + :showFooter="handleCount !== 2" | ||
96 | + :title="cacheTitle" | ||
97 | + width="30%" | ||
98 | + :maskClosable="true" | ||
99 | + @register="registerDrawer" | ||
100 | + @ok="handleSubmit" | ||
101 | + > | ||
102 | + <BasicForm @register="registerForm"> | ||
103 | + <template #interfaceParamsSlot="{ model, field }"> | ||
104 | + <JSONEditor v-model:value="model[field]" /> | ||
105 | + </template> | ||
106 | + </BasicForm> | ||
107 | + </BasicDrawer> | ||
108 | + </div> | ||
109 | +</template> | ||
110 | + | ||
111 | +<style lang="less" scoped></style> |
1 | +<template> | ||
2 | + <div> | ||
3 | + <BasicModal | ||
4 | + v-bind="$attrs" | ||
5 | + width="30rem" | ||
6 | + :title="getTitle" | ||
7 | + @register="register" | ||
8 | + @cancel="handleCancel" | ||
9 | + @ok="handleOk" | ||
10 | + destroyOnClose | ||
11 | + > | ||
12 | + <div> | ||
13 | + <BasicForm @register="registerForm" /> | ||
14 | + </div> | ||
15 | + </BasicModal> | ||
16 | + </div> | ||
17 | +</template> | ||
18 | +<script setup lang="ts"> | ||
19 | +import {BasicModal, useModalInner} from "/@/components/Modal"; | ||
20 | +import {BasicForm, useForm} from "/@/components/Form"; | ||
21 | +import {computed, ref, unref} from "vue"; | ||
22 | +import {useI18n} from "/@/hooks/web/useI18n"; | ||
23 | +import {useMessage} from "/@/hooks/web/useMessage"; | ||
24 | +import {schemas} from "../index"; | ||
25 | +import {equipmentErrorCategory} from "/@/api/equipment/errorReason"; | ||
26 | +const { t } = useI18n(); | ||
27 | +const emit = defineEmits(['handleReload', 'register']); | ||
28 | + | ||
29 | +const { createMessage } = useMessage(); | ||
30 | + | ||
31 | +const [registerForm, { getFieldsValue, setFieldsValue, validate }] = useForm({ | ||
32 | + labelWidth: 140, | ||
33 | + schemas, | ||
34 | + actionColOptions: { | ||
35 | + span: 14, | ||
36 | + }, | ||
37 | + showActionButtonGroup: false, | ||
38 | +}); | ||
39 | +const recordInfo = ref<any>({}); | ||
40 | + | ||
41 | +const [register, { closeModal, setModalProps }] = useModalInner(async (data) => { | ||
42 | + setModalProps({ confirmLoading: false, loading: true }); | ||
43 | + isUpdate.value = data?.isUpdate; | ||
44 | + recordInfo.value = data?.record; | ||
45 | + if (data?.record) { | ||
46 | + setFieldsValue(data?.record); | ||
47 | + } | ||
48 | + setModalProps({ loading: false }); | ||
49 | +}); | ||
50 | + | ||
51 | +const isUpdate = ref<Boolean>(false); | ||
52 | +const getTitle = computed(() => | ||
53 | + !unref(isUpdate) | ||
54 | + ? t('equipment.errorReason.createCategoryText') | ||
55 | + : t('equipment.errorReason.editCategoryText') | ||
56 | +); | ||
57 | + | ||
58 | +const handleCancel = () => { | ||
59 | + closeModal(); | ||
60 | +}; | ||
61 | + | ||
62 | +const handleOk = async () => { | ||
63 | + await validate(); | ||
64 | + let values = getFieldsValue(); | ||
65 | + if (unref(isUpdate)) { | ||
66 | + values = { ...values, id: unref(recordInfo).id }; | ||
67 | + } | ||
68 | + await equipmentErrorCategory(values); | ||
69 | + createMessage.success(t('common.operationSuccessText')); | ||
70 | + emit('handleReload'); | ||
71 | + handleCancel(); | ||
72 | +}; | ||
73 | +</script> |
src/views/equipment/errorReason/index.ts
0 → 100644
1 | +import {FormSchema} from "/@/components/Form"; | ||
2 | +import {useI18n} from "/@/hooks/web/useI18n"; | ||
3 | +import {BasicColumn} from "/@/components/Table"; | ||
4 | +const { t } = useI18n(); | ||
5 | +const statusOptions = [ | ||
6 | + { label: t('equipment.errorReason.enableText'), value: 'ENABLE' }, | ||
7 | + { label: t('equipment.errorReason.disabledText'), value: 'DISABLE' }, | ||
8 | +]; | ||
9 | +export const searchFormSchema: FormSchema[] = [ | ||
10 | + { | ||
11 | + field: 'reason', | ||
12 | + label: t('equipment.errorReason.nameText'), | ||
13 | + component: 'Input', | ||
14 | + colProps: { span: 6 }, | ||
15 | + componentProps: { | ||
16 | + maxLength: 255, | ||
17 | + }, | ||
18 | + }, | ||
19 | + { | ||
20 | + field: 'status', | ||
21 | + label: t('equipment.errorReason.statusText'), | ||
22 | + component: 'Select', | ||
23 | + colProps: { span: 6 }, | ||
24 | + componentProps: { | ||
25 | + options: statusOptions, | ||
26 | + }, | ||
27 | + } | ||
28 | +]; | ||
29 | +export const columns: BasicColumn[] = [ | ||
30 | + { | ||
31 | + title: t('equipment.errorReason.nameCode'), | ||
32 | + dataIndex: 'code', | ||
33 | + }, | ||
34 | + { | ||
35 | + title: t('equipment.errorReason.nameText'), | ||
36 | + dataIndex: 'reason', | ||
37 | + }, | ||
38 | + { | ||
39 | + title: t('equipment.errorReason.statusText'), | ||
40 | + dataIndex: 'status', | ||
41 | + slots: { customRender: 'status' }, | ||
42 | + }, | ||
43 | +]; | ||
44 | + | ||
45 | +export const schemas: FormSchema[] = [ | ||
46 | + { | ||
47 | + field: 'code', | ||
48 | + label: t('equipment.errorReason.nameCode'), | ||
49 | + component: 'Input', | ||
50 | + colProps: { span: 21 }, | ||
51 | + required: true, | ||
52 | + componentProps: { | ||
53 | + maxLength: 20, | ||
54 | + }, | ||
55 | + }, | ||
56 | + { | ||
57 | + field: 'reason', | ||
58 | + label: t('equipment.errorReason.nameText'), | ||
59 | + component: 'Input', | ||
60 | + colProps: { span: 21 }, | ||
61 | + required: true, | ||
62 | + componentProps: { | ||
63 | + maxLength: 20, | ||
64 | + }, | ||
65 | + }, | ||
66 | + { | ||
67 | + field: 'status', | ||
68 | + label: t('equipment.errorReason.statusText'), | ||
69 | + component: 'RadioButtonGroup', | ||
70 | + defaultValue: 'ENABLE', | ||
71 | + componentProps: { | ||
72 | + options: statusOptions, | ||
73 | + }, | ||
74 | + }, | ||
75 | +]; | ||
76 | + |
src/views/equipment/errorReason/index.vue
0 → 100644
1 | +<template> | ||
2 | + <div> | ||
3 | + <BasicTable style="flex: auto" @register="registerTable"> | ||
4 | + <template #toolbar> | ||
5 | + <Authority value="api:yt:product:category:post"> | ||
6 | + <Button type="primary" @click="handleCreate"> | ||
7 | + {{ t('equipment.errorReason.createCategoryText') }} | ||
8 | + </Button> | ||
9 | + </Authority> | ||
10 | + <Authority value="api:yt:product:category:delete"> | ||
11 | + <Popconfirm :title="t('common.deleteConfirmText')" @confirm="handleDelete()"> | ||
12 | + <a-button color="error" :disabled="!isExistOption"> | ||
13 | + {{ t('common.batchDeleteText') }} | ||
14 | + </a-button> | ||
15 | + </Popconfirm> | ||
16 | + </Authority> | ||
17 | + </template> | ||
18 | + <template #status="{ record }"> | ||
19 | + <Switch | ||
20 | + @click="(e) => handleSwitch(e, record)" | ||
21 | + :loading="switchLoading" | ||
22 | + v-model:checked="record.status" | ||
23 | + checkedValue="ENABLE" | ||
24 | + unCheckedValue="DISABLE" | ||
25 | + /> | ||
26 | + </template> | ||
27 | + <template #action="{ record }"> | ||
28 | + <TableAction | ||
29 | + :actions="[ | ||
30 | + { | ||
31 | + label: t('common.detailText'), | ||
32 | + icon: 'ant-design:eye-outlined', | ||
33 | + auth: 'api:yt:product:category:get', | ||
34 | + onClick: handleDetail.bind(null, record), | ||
35 | + }, | ||
36 | + { | ||
37 | + label: t('common.editText'), | ||
38 | + auth: 'api:yt:product:category:update', | ||
39 | + icon: 'clarity:note-edit-line', | ||
40 | + onClick: handleEdit.bind(null, record), | ||
41 | + }, | ||
42 | + { | ||
43 | + label: t('common.delText'), | ||
44 | + auth: 'api:yt:product:category:delete', | ||
45 | + icon: 'ant-design:delete-outlined', | ||
46 | + color: 'error', | ||
47 | + popConfirm: { | ||
48 | + title: t('common.deleteConfirmText'), | ||
49 | + confirm: handleDelete.bind(null, record), | ||
50 | + }, | ||
51 | + }, | ||
52 | + ]" | ||
53 | + /> | ||
54 | + </template> | ||
55 | + </BasicTable> | ||
56 | + <reasonModal @register="registerModal" @handleReload="handleReload" /> | ||
57 | + <FormDrawer | ||
58 | + @register="registerApplicationApiFormDrawer" | ||
59 | + /> | ||
60 | + </div> | ||
61 | +</template> | ||
62 | + | ||
63 | +<script setup lang="ts"> | ||
64 | +import {BasicTable, TableAction, useTable} from '/@/components/Table'; | ||
65 | +import { useI18n } from '/@/hooks/web/useI18n'; | ||
66 | +import { | ||
67 | + deleteEquipmentError, | ||
68 | + equipmentErrorCategory, | ||
69 | + getEquipmentErrorList | ||
70 | +} from '/@/api/equipment/errorReason'; | ||
71 | +import { columns, searchFormSchema } from './index'; | ||
72 | +import { getAuthCache } from '/@/utils/auth'; | ||
73 | +import { USER_INFO_KEY } from '/@/enums/cacheEnum'; | ||
74 | +import {Button, Popconfirm, Switch} from 'ant-design-vue'; | ||
75 | +import {Authority} from "/@/components/Authority"; | ||
76 | +import {useModal} from "/@/components/Modal"; | ||
77 | +import { reasonModal } from './components/index'; | ||
78 | +import {useMessage} from "/@/hooks/web/useMessage"; | ||
79 | +import {useBatchOperation} from "/@/utils/useBatchOperation"; | ||
80 | +import { useDrawer} from "/@/components/Drawer"; | ||
81 | + | ||
82 | +import {FormDrawer} from "./components/FormDrawer/index"; | ||
83 | +import {ref} from "vue"; | ||
84 | +const switchLoading = ref<boolean>(false); | ||
85 | +const { t } = useI18n(); | ||
86 | +const { createMessage } = useMessage(); | ||
87 | + | ||
88 | +const [ | ||
89 | + registerTable, | ||
90 | + { reload, setLoading, getSelectRowKeys, setSelectedRowKeys, getRowSelection }, | ||
91 | +] = useTable({ | ||
92 | + title: t('equipment.errorReason.listText'), | ||
93 | + api: getEquipmentErrorList, | ||
94 | + columns, | ||
95 | + formConfig: { | ||
96 | + labelWidth: 100, | ||
97 | + schemas: searchFormSchema, | ||
98 | + }, | ||
99 | + immediate: true, | ||
100 | + useSearchForm: true, | ||
101 | + showTableSetting: true, | ||
102 | + bordered: true, | ||
103 | + showIndexColumn: false, | ||
104 | + clickToRowSelect: false, | ||
105 | + rowKey: 'id', | ||
106 | + actionColumn: { | ||
107 | + width: 230, | ||
108 | + title: t('common.actionText'), | ||
109 | + slots: { customRender: 'action' }, | ||
110 | + fixed: 'right', | ||
111 | + }, | ||
112 | + rowSelection: { | ||
113 | + type: 'checkbox', | ||
114 | + getCheckboxProps: (record: any) => { | ||
115 | + return { | ||
116 | + disabled: | ||
117 | + getAuthCache(USER_INFO_KEY).id === record.id ? !!record.status : true, | ||
118 | + }; | ||
119 | + }, | ||
120 | + }, | ||
121 | +}); | ||
122 | +const { isExistOption } = useBatchOperation(getRowSelection, setSelectedRowKeys); | ||
123 | +const [registerApplicationApiFormDrawer, { openDrawer }] = useDrawer(); | ||
124 | +const [registerModal, { openModal }] = useModal(); | ||
125 | + | ||
126 | +const handleDetail = (record?: any) => { | ||
127 | + openDrawer(true, { | ||
128 | + isUpdate: 2, | ||
129 | + record, | ||
130 | + }); | ||
131 | +}; | ||
132 | +// 编辑 | ||
133 | +const handleEdit = (record?: any) => { | ||
134 | + openModal(true, { | ||
135 | + isUpdate: true, | ||
136 | + record, | ||
137 | + }); | ||
138 | +}; | ||
139 | + | ||
140 | +// 新增 | ||
141 | +const handleCreate = () => { | ||
142 | + openModal(true, { | ||
143 | + isUpdate: false, | ||
144 | + }); | ||
145 | +}; | ||
146 | + | ||
147 | +const handleReload = () => { | ||
148 | + setSelectedRowKeys([]); | ||
149 | + reload(); | ||
150 | +}; | ||
151 | + | ||
152 | +const handleDelete = async (record?: any) => { | ||
153 | + let ids:any = []; | ||
154 | + if (record) { | ||
155 | + ids = [record.id]; | ||
156 | + } else { | ||
157 | + ids = getSelectRowKeys(); | ||
158 | + } | ||
159 | + | ||
160 | + try { | ||
161 | + setLoading(true); | ||
162 | + await deleteEquipmentError({ ids }); | ||
163 | + createMessage.success(t('common.deleteSuccessText')); | ||
164 | + handleReload(); | ||
165 | + } catch (error) { | ||
166 | + throw error; | ||
167 | + } finally { | ||
168 | + setLoading(false); | ||
169 | + } | ||
170 | +}; | ||
171 | + | ||
172 | +// 状态->编辑 | ||
173 | +const handleSwitch = async (e: any, record: any) => { | ||
174 | + switchLoading.value = true; | ||
175 | + await equipmentErrorCategory({ ...record, status: e }); | ||
176 | + setTimeout(() => { | ||
177 | + switchLoading.value = false; | ||
178 | + }, 1500); | ||
179 | + createMessage.success( | ||
180 | + `${!e ? t('common.disableText') : t('common.enableText')}${t('common.successText')}` | ||
181 | + ); | ||
182 | + handleReload(); | ||
183 | +}; | ||
184 | + | ||
185 | +</script> |