Commit 40babc2276a43f8305c196cd2cbd06eae96d104a

Authored by fengtao
1 parent bcbdb448

fix:DEFECT-504 数据流转状态改变为场景联动一样的启用禁用问题

@@ -55,13 +55,7 @@ export const columns: BasicColumn[] = [ @@ -55,13 +55,7 @@ export const columns: BasicColumn[] = [
55 title: '状态', 55 title: '状态',
56 dataIndex: 'status', 56 dataIndex: 'status',
57 width: 120, 57 width: 120,
58 - customRender: ({ record }) => {  
59 - const status = record.status;  
60 - const enable = ~~status === 1;  
61 - const color = enable ? '#2aae67' : '#eb846f';  
62 - const text = enable ? '启用' : '禁用';  
63 - return h(Tag, { color: color }, () => text);  
64 - }, 58 + slots: { customRender: 'status' },
65 }, 59 },
66 { 60 {
67 title: '描述', 61 title: '描述',
@@ -64,32 +64,18 @@ @@ -64,32 +64,18 @@
64 return record.status == 0; 64 return record.status == 0;
65 }, 65 },
66 }, 66 },
67 - {  
68 - label: '启用',  
69 - icon: 'ant-design:check-circle-outlined',  
70 - color: 'success',  
71 - popConfirm: {  
72 - title: '是否启用?',  
73 - confirm: handleEnableOrDisable.bind(null, record),  
74 - },  
75 - ifShow: (_action) => {  
76 - return record.status == 0;  
77 - },  
78 - },  
79 - {  
80 - label: '禁用',  
81 - icon: 'ant-design:close-circle-outlined',  
82 - popConfirm: {  
83 - title: '是否禁用?',  
84 - confirm: handleDisable.bind(null, record),  
85 - },  
86 - ifShow: (_action) => {  
87 - return record.status == 1;  
88 - },  
89 - },  
90 ]" 67 ]"
91 /> 68 />
92 </template> 69 </template>
  70 + <template #status="{ record }">
  71 + <Switch
  72 + :checked="record.status === 1"
  73 + :loading="record.pendingStatus"
  74 + checkedChildren="启用"
  75 + unCheckedChildren="禁用"
  76 + @change="(checked:boolean)=>statusChange(checked,record)"
  77 + />
  78 + </template>
93 </BasicTable> 79 </BasicTable>
94 <div> 80 <div>
95 <DataTransferDrawer @register="registerModal" @success="handleSuccess" /> 81 <DataTransferDrawer @register="registerModal" @success="handleSuccess" />
@@ -110,10 +96,11 @@ @@ -110,10 +96,11 @@
110 import { useMessage } from '/@/hooks/web/useMessage'; 96 import { useMessage } from '/@/hooks/web/useMessage';
111 import { Authority } from '/@/components/Authority'; 97 import { Authority } from '/@/components/Authority';
112 import { useBatchDelete } from '/@/hooks/web/useBatchDelete'; 98 import { useBatchDelete } from '/@/hooks/web/useBatchDelete';
  99 + import { Switch } from 'ant-design-vue';
113 100
114 export default defineComponent({ 101 export default defineComponent({
115 name: 'Index', 102 name: 'Index',
116 - components: { BasicTable, TableAction, DataTransferDrawer, Authority }, 103 + components: { BasicTable, TableAction, DataTransferDrawer, Authority, Switch },
117 setup() { 104 setup() {
118 const enableObj = reactive({ 105 const enableObj = reactive({
119 convertIds: [], 106 convertIds: [],
@@ -191,64 +178,6 @@ @@ -191,64 +178,6 @@
191 }); 178 });
192 }, 10); 179 }, 10);
193 }; 180 };
194 -  
195 - const handleEnableOrDisable = async (record: Recordable) => {  
196 - setLoading(true);  
197 - enableObj.convertIds.length = 0;  
198 - try {  
199 - enableObj.status = record.status;  
200 - enableObj.convertIds.push(record.id as never);  
201 - if (enableObj.status == 0) {  
202 - enableObj.status = 1;  
203 - }  
204 - const res = await isEnableOrDisableApi(enableObj as never);  
205 - if (res !== '') {  
206 - createMessage.success('流转配置启用成功');  
207 - setLoading(false);  
208 - handleSuccess();  
209 - singleStopDeleteStatus.value = true;  
210 - disabledStatus1.value = true;  
211 - disabledStatus2.value = true;  
212 - disabledStatus3.value = true;  
213 - resetSelectedRowKeys();  
214 - clearSelectedRowKeys();  
215 - } else {  
216 - createMessage.error('流转配置启用失败');  
217 - }  
218 - } catch (e) {  
219 - return e;  
220 - } finally {  
221 - setLoading(false);  
222 - }  
223 - };  
224 - const handleDisable = async (record: Recordable) => {  
225 - setLoading(true);  
226 - enableObj.convertIds.length = 0;  
227 - try {  
228 - enableObj.status = record.status;  
229 - enableObj.convertIds.push(record.id as never);  
230 - if (enableObj.status == 1) {  
231 - enableObj.status = 0;  
232 - }  
233 - const res = await isEnableOrDisableApi(enableObj as never);  
234 - if (res !== '') {  
235 - createMessage.success('流转配置禁用成功');  
236 - setLoading(false);  
237 - handleSuccess();  
238 - singleStopDeleteStatus.value = true;  
239 - disabledStatus1.value = true;  
240 - disabledStatus2.value = true;  
241 - disabledStatus3.value = true;  
242 - resetSelectedRowKeys();  
243 - clearSelectedRowKeys();  
244 - } else {  
245 - createMessage.error('流转配置禁用失败');  
246 - }  
247 - } catch (e) {  
248 - } finally {  
249 - setLoading(false);  
250 - }  
251 - };  
252 const useSelectionChange = () => { 181 const useSelectionChange = () => {
253 selectedRowKeys.value = getSelectRowKeys(); 182 selectedRowKeys.value = getSelectRowKeys();
254 isJudgeSelectRowsArr.value = getSelectRows(); 183 isJudgeSelectRowsArr.value = getSelectRows();
@@ -310,7 +239,6 @@ @@ -310,7 +239,6 @@
310 clearSelectedRowKeys(); 239 clearSelectedRowKeys();
311 } 240 }
312 }; 241 };
313 -  
314 const handleMutiuteEnable = async () => { 242 const handleMutiuteEnable = async () => {
315 enableObj.convertIds.length = 0; 243 enableObj.convertIds.length = 0;
316 try { 244 try {
@@ -339,6 +267,34 @@ @@ -339,6 +267,34 @@
339 clearSelectedRowKeys(); 267 clearSelectedRowKeys();
340 } 268 }
341 }; 269 };
  270 + const statusChange = async (checked, record) => {
  271 + setProps({
  272 + loading: true,
  273 + });
  274 + enableObj.convertIds.length = 0;
  275 + resetSelectedRowKeys();
  276 + clearSelectedRowKeys();
  277 + const newStatus = checked ? 1 : 0;
  278 + try {
  279 + enableObj.convertIds.push(record.id as never);
  280 + enableObj.status = newStatus;
  281 + await isEnableOrDisableApi(enableObj as never);
  282 + if (newStatus) {
  283 + createMessage.success(`流转配置启用成功`);
  284 + } else {
  285 + createMessage.success('流转配置禁用成功');
  286 + }
  287 + singleStopDeleteStatus.value = true;
  288 + disabledStatus1.value = true;
  289 + disabledStatus2.value = true;
  290 + disabledStatus3.value = true;
  291 + } finally {
  292 + setProps({
  293 + loading: false,
  294 + });
  295 + reload();
  296 + }
  297 + };
342 298
343 return { 299 return {
344 disabledStatus1, 300 disabledStatus1,
@@ -351,13 +307,12 @@ @@ -351,13 +307,12 @@
351 registerModal, 307 registerModal,
352 handleSuccess, 308 handleSuccess,
353 handleEdit, 309 handleEdit,
354 - handleEnableOrDisable,  
355 useSelectionChange, 310 useSelectionChange,
356 handleMutiuteDisable, 311 handleMutiuteDisable,
357 - handleDisable,  
358 hasBatchDelete, 312 hasBatchDelete,
359 handleDeleteOrBatchDelete, 313 handleDeleteOrBatchDelete,
360 singleStopDeleteStatus, 314 singleStopDeleteStatus,
  315 + statusChange,
361 }; 316 };
362 }, 317 },
363 }); 318 });