简柏林 / thingskit-front · Commits

Commit 40e125c2da14193ec86bd08ad9d8f657ff78984f

Authored by fengtao
1 parent 466fc0f6

fix：修改数据流转 编辑点击确定按钮报错问题

Inline Side-by-side
Showing 8 changed files with 417 additions and 80 deletions
@@ -3,14 +3,14 @@ @@ -3,14 +3,14 @@
3 <a-input 3 <a-input
4 placeholder="请输入参数key" 4 placeholder="请输入参数key"
5 v-model:value="param.label" 5 v-model:value="param.label"
6 - style="width: 30%; margin-bottom: 5px"  
7 - @input="emitChange" 6 + style="width: 38%; margin-bottom: 5px"
  7 + @change="emitChange"
8 /> 8 />
9 <a-input 9 <a-input
10 placeholder="请输入参数value" 10 placeholder="请输入参数value"
11 v-model:value="param.value" 11 v-model:value="param.value"
12 - style="width: 30%; margin: 0 0 5px 5px"  
13 - @input="emitChange" 12 + style="width: 38%; margin: 0 0 5px 60px"
  13 + @change="emitChange"
14 /> 14 />
15 <MinusCircleOutlined 15 <MinusCircleOutlined
16 v-if="dynamicInput.params.length > min" 16 v-if="dynamicInput.params.length > min"
@@ -20,7 +20,7 @@ @@ -20,7 +20,7 @@
20 /> 20 />
21 </div> 21 </div>
22 <div> 22 <div>
23 - <a-button type="dashed" style="width: 60%" @click="add"> 23 + <a-button type="dashed" style="width: 38%" @click="add">
24 <PlusOutlined /> 24 <PlusOutlined />
25 新增 25 新增
26 </a-button> 26 </a-button>
@@ -62,6 +62,7 @@ @@ -62,6 +62,7 @@
62 } 62 }
63 emitChange(); 63 emitChange();
64 }; 64 };
  65 +
65 //新增Input 66 //新增Input
66 const add = () => { 67 const add = () => {
67 dynamicInput.params.push({ 68 dynamicInput.params.push({
@@ -87,12 +88,6 @@ @@ -87,12 +88,6 @@
87 dynamicInput.params.push({ label: key, value: jsonObj[key] }); 88 dynamicInput.params.push({ label: key, value: jsonObj[key] });
88 }); 89 });
89 } 90 }
90 - // if (props.value && props.value.indexOf('{') == 0) {  
91 - // let jsonObj = JSON.parse(props.value);  
92 - // Object.keys(jsonObj).forEach((key) => {  
93 - // dynamicInput.params.push({ label: key, value: jsonObj[key] });  
94 - // });  
95 - // }  
96 } 91 }
97 /** 92 /**
98 * 数值改变 93 * 数值改变
@@ -101,13 +96,11 @@ @@ -101,13 +96,11 @@
101 let obj = {}; 96 let obj = {};
102 if (dynamicInput.params.length > 0) { 97 if (dynamicInput.params.length > 0) {
103 dynamicInput.params.forEach((item) => { 98 dynamicInput.params.forEach((item) => {
104 - obj[item['label']] = item['value']; 99 + obj[item.label] = item.value;
105 }); 100 });
106 } 101 }
107 emit('change', isEmpty(obj) ? '' : obj); 102 emit('change', isEmpty(obj) ? '' : obj);
108 emit('update:value', isEmpty(obj) ? '' : obj); 103 emit('update:value', isEmpty(obj) ? '' : obj);
109 - // emit('change', isEmpty(obj) ? '' : JSON.stringify(obj));  
110 - // emit('update:value', isEmpty(obj) ? '' : JSON.stringify(obj));  
111 } 104 }
112 105
113 return { 106 return {
@@ -80,6 +80,8 @@ @@ -80,6 +80,8 @@
80 const getTitle = ref(''); 80 const getTitle = ref('');
81 const current = ref(0); 81 const current = ref(0);
82 const editPostId = ref(''); 82 const editPostId = ref('');
  83 + let isEdit = ref(true);
  84 + let noEditObj: any = reactive({});
83 const editType = reactive({ 85 const editType = reactive({
84 type: '', 86 type: '',
85 configuration: {}, 87 configuration: {},
@@ -109,6 +111,20 @@ @@ -109,6 +111,20 @@
109 editNextType.remark = data.record.remark; 111 editNextType.remark = data.record.remark;
110 proxy.$refs.refTransferConfigMode.setStepOneFieldsValueFunc(editNextType); 112 proxy.$refs.refTransferConfigMode.setStepOneFieldsValueFunc(editNextType);
111 } 113 }
  114 + if (!unref(isUpdate)) {
  115 + isEdit.value = false;
  116 + } else {
  117 + isEdit.value = true;
  118 + }
  119 + if (isEdit.value) {
  120 + noEditObj = {
  121 + name: data.record?.name,
  122 + remark: data.record?.remark,
  123 + type: data.record?.type,
  124 + id: data.record.id,
  125 + configuration: data.record?.configuration,
  126 + };
  127 + }
112 switch (unref(isUpdate)) { 128 switch (unref(isUpdate)) {
113 case 'view': 129 case 'view':
114 commonViewOrEditFunc(); 130 commonViewOrEditFunc();
@@ -143,6 +159,7 @@ @@ -143,6 +159,7 @@
143 current.value++; 159 current.value++;
144 getModeSelectVal.value = args; 160 getModeSelectVal.value = args;
145 if (unref(isUpdate)) { 161 if (unref(isUpdate)) {
  162 + isEdit.value = false;
146 try { 163 try {
147 if (editNextType.type == 'org.thingsboard.rule.engine.kafka.TbKafkaNode') { 164 if (editNextType.type == 'org.thingsboard.rule.engine.kafka.TbKafkaNode') {
148 editTypeFunc(editNextType.configuration); 165 editTypeFunc(editNextType.configuration);
@@ -163,6 +180,16 @@ @@ -163,6 +180,16 @@
163 }; 180 };
164 const handlePrev = () => { 181 const handlePrev = () => {
165 current.value--; 182 current.value--;
  183 + if (unref(isUpdate)) {
  184 + isEdit.value = true;
  185 + noEditObj = {
  186 + name: editNextType?.name,
  187 + remark: editNextType?.remark,
  188 + type: editNextType?.type,
  189 + id: editPostId?.value,
  190 + configuration: editNextType?.configuration?.configuration,
  191 + };
  192 + }
166 }; 193 };
167 194
168 const commonFunc = () => { 195 const commonFunc = () => {
@@ -220,6 +247,7 @@ @@ -220,6 +247,7 @@
220 id, 247 id,
221 additionalInfoV 248 additionalInfoV
222 ); 249 );
  250 +
223 if (!unref(isUpdate)) { 251 if (!unref(isUpdate)) {
224 delete allPostForm.id; 252 delete allPostForm.id;
225 } 253 }
@@ -229,6 +257,9 @@ @@ -229,6 +257,9 @@
229 setModalProps({ confirmLoading: true }); 257 setModalProps({ confirmLoading: true });
230 if (!unref(isUpdate)) { 258 if (!unref(isUpdate)) {
231 await addOrEditFunc(); 259 await addOrEditFunc();
  260 + if (allPostForm.name == undefined) {
  261 + return createMessage.error('请填写名称');
  262 + }
232 await postAddConvertApi(allPostForm); 263 await postAddConvertApi(allPostForm);
233 createMessage.success('数据流转新增成功'); 264 createMessage.success('数据流转新增成功');
234 emit('success'); 265 emit('success');
@@ -236,10 +267,7 @@ @@ -236,10 +267,7 @@
236 closeModal(); 267 closeModal();
237 } else { 268 } else {
238 await addOrEditFunc(); 269 await addOrEditFunc();
239 - if (allPostForm.configuration == undefined || allPostForm.configuration == null) {  
240 - return createMessage.error('数据流转下一步配置项必填');  
241 - }  
242 - await postAddConvertApi(allPostForm); 270 + await postAddConvertApi(isEdit.value ? noEditObj : allPostForm);
243 createMessage.success('数据流转编辑成功'); 271 createMessage.success('数据流转编辑成功');
244 emit('success'); 272 emit('success');
245 defineClearFunc(); 273 defineClearFunc();
1 import { FormSchema } from '/@/components/Form'; 1 import { FormSchema } from '/@/components/Form';
2 import { findDictItemByCode } from '/@/api/system/dict'; 2 import { findDictItemByCode } from '/@/api/system/dict';
3 import { ref } from 'vue'; 3 import { ref } from 'vue';
4 -import { useMessage } from '/@/hooks/web/useMessage'; 4 +// import { useMessage } from '/@/hooks/web/useMessage';
5 import { isExistDataManagerNameApi } from '/@/api/datamanager/dataManagerApi'; 5 import { isExistDataManagerNameApi } from '/@/api/datamanager/dataManagerApi';
6 -const { createMessage } = useMessage(); 6 +// const { createMessage } = useMessage();
7 7
8 const typeValue = ref(''); 8 const typeValue = ref('');
9 9
@@ -218,7 +218,7 @@ export const modeKafkaForm: FormSchema[] = [ @@ -218,7 +218,7 @@ export const modeKafkaForm: FormSchema[] = [
218 }, 218 },
219 { 219 {
220 field: 'otherProperties', 220 field: 'otherProperties',
221 - label: '其他属性', 221 + label: '其他属性(不可重复)',
222 colProps: { span: 24 }, 222 colProps: { span: 24 },
223 component: 'JAddInput', 223 component: 'JAddInput',
224 }, 224 },
@@ -421,6 +421,14 @@ export const modeMqttForm: FormSchema[] = [ @@ -421,6 +421,14 @@ export const modeMqttForm: FormSchema[] = [
421 ifShow: ({ values }) => isPem(Reflect.get(values, 'type')), 421 ifShow: ({ values }) => isPem(Reflect.get(values, 'type')),
422 }, 422 },
423 { 423 {
  424 + field: '11',
  425 + label: '',
  426 + colProps: { span: 24 },
  427 + component: 'Input',
  428 + slot: 'showImg1',
  429 + ifShow: ({ values }) => isPem(Reflect.get(values, 'type')),
  430 + },
  431 + {
424 field: '5', 432 field: '5',
425 label: '', 433 label: '',
426 colProps: { span: 24 }, 434 colProps: { span: 24 },
@@ -429,6 +437,14 @@ export const modeMqttForm: FormSchema[] = [ @@ -429,6 +437,14 @@ export const modeMqttForm: FormSchema[] = [
429 ifShow: ({ values }) => isPem(Reflect.get(values, 'type')), 437 ifShow: ({ values }) => isPem(Reflect.get(values, 'type')),
430 }, 438 },
431 { 439 {
  440 + field: '1111',
  441 + label: '',
  442 + colProps: { span: 24 },
  443 + component: 'Input',
  444 + slot: 'showImg2',
  445 + ifShow: ({ values }) => isPem(Reflect.get(values, 'type')),
  446 + },
  447 + {
432 field: '6', 448 field: '6',
433 label: '', 449 label: '',
434 colProps: { span: 24 }, 450 colProps: { span: 24 },
@@ -437,6 +453,14 @@ export const modeMqttForm: FormSchema[] = [ @@ -437,6 +453,14 @@ export const modeMqttForm: FormSchema[] = [
437 ifShow: ({ values }) => isPem(Reflect.get(values, 'type')), 453 ifShow: ({ values }) => isPem(Reflect.get(values, 'type')),
438 }, 454 },
439 { 455 {
  456 + field: '111111',
  457 + label: '',
  458 + colProps: { span: 24 },
  459 + component: 'Input',
  460 + slot: 'showImg3',
  461 + ifShow: ({ values }) => isPem(Reflect.get(values, 'type')),
  462 + },
  463 + {
440 field: 'password', 464 field: 'password',
441 label: 'Password', 465 label: 'Password',
442 colProps: { span: 12 }, 466 colProps: { span: 12 },
@@ -494,7 +518,7 @@ export const modeRabbitMqForm: FormSchema[] = [ @@ -494,7 +518,7 @@ export const modeRabbitMqForm: FormSchema[] = [
494 component: 'Input', 518 component: 'Input',
495 componentProps: { 519 componentProps: {
496 maxLength: 255, 520 maxLength: 255,
497 - placeholder: '请输入Exchange name pattern', 521 + placeholder: '请输入pattern',
498 }, 522 },
499 }, 523 },
500 { 524 {
@@ -504,7 +528,7 @@ export const modeRabbitMqForm: FormSchema[] = [ @@ -504,7 +528,7 @@ export const modeRabbitMqForm: FormSchema[] = [
504 component: 'Input', 528 component: 'Input',
505 componentProps: { 529 componentProps: {
506 maxLength: 255, 530 maxLength: 255,
507 - placeholder: '请输入Routing key pattern', 531 + placeholder: '请输入pattern',
508 }, 532 },
509 }, 533 },
510 { 534 {
@@ -612,7 +636,7 @@ export const modeRabbitMqForm: FormSchema[] = [ @@ -612,7 +636,7 @@ export const modeRabbitMqForm: FormSchema[] = [
612 }, 636 },
613 { 637 {
614 field: 'clientProperties', 638 field: 'clientProperties',
615 - label: '客户端属性', 639 + label: '客户端属性(不可重复)',
616 colProps: { span: 24 }, 640 colProps: { span: 24 },
617 component: 'JAddInput', 641 component: 'JAddInput',
618 }, 642 },
@@ -648,7 +672,7 @@ export const modeApiForm: FormSchema[] = [ @@ -648,7 +672,7 @@ export const modeApiForm: FormSchema[] = [
648 if (value == '') { 672 if (value == '') {
649 reject('请输入名称'); 673 reject('请输入名称');
650 } else { 674 } else {
651 - if (values.name != undefined) { 675 + if (values.name) {
652 isExistDataManagerNameApi({ 676 isExistDataManagerNameApi({
653 name: value, 677 name: value,
654 type: 678 type:
@@ -657,7 +681,7 @@ export const modeApiForm: FormSchema[] = [ @@ -657,7 +681,7 @@ export const modeApiForm: FormSchema[] = [
657 : typeValue.value, 681 : typeValue.value,
658 }).then((data) => { 682 }).then((data) => {
659 if (data == true) { 683 if (data == true) {
660 - createMessage.error('名称已存在'); 684 + // createMessage.error('名称已存在');
661 resolve(); 685 resolve();
662 } else { 686 } else {
663 resolve(); 687 resolve();
@@ -828,7 +852,7 @@ export const modeApiForm: FormSchema[] = [ @@ -828,7 +852,7 @@ export const modeApiForm: FormSchema[] = [
828 }, 852 },
829 { 853 {
830 field: 'headers', 854 field: 'headers',
831 - label: 'Headers', 855 + label: 'Headers(不可重复)',
832 colProps: { span: 24 }, 856 colProps: { span: 24 },
833 defaultValue: { 'Content-Type': 'application/json' }, 857 defaultValue: { 'Content-Type': 'application/json' },
834 component: 'JAddInput', 858 component: 'JAddInput',
@@ -915,6 +939,14 @@ export const modeApiForm: FormSchema[] = [ @@ -915,6 +939,14 @@ export const modeApiForm: FormSchema[] = [
915 ifShow: ({ values }) => isPem(Reflect.get(values, 'type')), 939 ifShow: ({ values }) => isPem(Reflect.get(values, 'type')),
916 }, 940 },
917 { 941 {
  942 + field: '11',
  943 + label: '',
  944 + colProps: { span: 24 },
  945 + component: 'Input',
  946 + slot: 'showImg1',
  947 + ifShow: ({ values }) => isPem(Reflect.get(values, 'type')),
  948 + },
  949 + {
918 field: '1', 950 field: '1',
919 label: '', 951 label: '',
920 colProps: { span: 24 }, 952 colProps: { span: 24 },
@@ -923,6 +955,14 @@ export const modeApiForm: FormSchema[] = [ @@ -923,6 +955,14 @@ export const modeApiForm: FormSchema[] = [
923 ifShow: ({ values }) => isPem(Reflect.get(values, 'type')), 955 ifShow: ({ values }) => isPem(Reflect.get(values, 'type')),
924 }, 956 },
925 { 957 {
  958 + field: '1111',
  959 + label: '',
  960 + colProps: { span: 24 },
  961 + component: 'Input',
  962 + slot: 'showImg2',
  963 + ifShow: ({ values }) => isPem(Reflect.get(values, 'type')),
  964 + },
  965 + {
926 field: '1', 966 field: '1',
927 label: '', 967 label: '',
928 colProps: { span: 24 }, 968 colProps: { span: 24 },
@@ -931,6 +971,14 @@ export const modeApiForm: FormSchema[] = [ @@ -931,6 +971,14 @@ export const modeApiForm: FormSchema[] = [
931 ifShow: ({ values }) => isPem(Reflect.get(values, 'type')), 971 ifShow: ({ values }) => isPem(Reflect.get(values, 'type')),
932 }, 972 },
933 { 973 {
  974 + field: '111111',
  975 + label: '',
  976 + colProps: { span: 24 },
  977 + component: 'Input',
  978 + slot: 'showImg3',
  979 + ifShow: ({ values }) => isPem(Reflect.get(values, 'type')),
  980 + },
  981 + {
934 field: 'password', 982 field: 'password',
935 label: 'Password', 983 label: 'Password',
936 colProps: { span: 12 }, 984 colProps: { span: 12 },
@@ -21,6 +21,15 @@ @@ -21,6 +21,15 @@
21 </p> 21 </p>
22 </a-upload-dragger> 22 </a-upload-dragger>
23 </template> 23 </template>
  24 + <template #showImg1="{ field }">
  25 + <span style="display: none">{{ field }}</span>
  26 + <img
  27 + v-if="showImg1"
  28 + :src="showImg1Pic"
  29 + alt="avatar"
  30 + style="width: 6.25rem; height: 6.25rem"
  31 + />
  32 + </template>
24 <template #uploadAdd2="{ field }"> 33 <template #uploadAdd2="{ field }">
25 <span style="display: none">{{ field }}</span> 34 <span style="display: none">{{ field }}</span>
26 <a-upload-dragger 35 <a-upload-dragger
@@ -41,6 +50,15 @@ @@ -41,6 +50,15 @@
41 </p> 50 </p>
42 </a-upload-dragger> 51 </a-upload-dragger>
43 </template> 52 </template>
  53 + <template #showImg2="{ field }">
  54 + <span style="display: none">{{ field }}</span>
  55 + <img
  56 + v-if="showImg2"
  57 + :src="showImg2Pic"
  58 + alt="avatar"
  59 + style="width: 6.25rem; height: 6.25rem"
  60 + />
  61 + </template>
44 <template #uploadAdd3="{ field }"> 62 <template #uploadAdd3="{ field }">
45 <span style="display: none">{{ field }}</span> 63 <span style="display: none">{{ field }}</span>
46 <a-upload-dragger 64 <a-upload-dragger
@@ -61,6 +79,15 @@ @@ -61,6 +79,15 @@
61 </p> 79 </p>
62 </a-upload-dragger> 80 </a-upload-dragger>
63 </template> 81 </template>
  82 + <template #showImg3="{ field }">
  83 + <span style="display: none">{{ field }}</span>
  84 + <img
  85 + v-if="showImg3"
  86 + :src="showImg3Pic"
  87 + alt="avatar"
  88 + style="width: 6.25rem; height: 6.25rem"
  89 + />
  90 + </template>
64 </BasicForm> 91 </BasicForm>
65 </div> 92 </div>
66 </template> 93 </template>
@@ -81,6 +108,12 @@ @@ -81,6 +108,12 @@
81 }, 108 },
82 emits: ['next', 'prev', 'register'], 109 emits: ['next', 'prev', 'register'],
83 setup(_, { emit }) { 110 setup(_, { emit }) {
  111 + const showImg1 = ref(false);
  112 + const showImg1Pic = ref('');
  113 + const showImg2 = ref(false);
  114 + const showImg2Pic = ref('');
  115 + const showImg3 = ref(false);
  116 + const showImg3Pic = ref('');
84 const { createMessage } = useMessage(); 117 const { createMessage } = useMessage();
85 let caCertFileName = ref(''); 118 let caCertFileName = ref('');
86 let privateKeyFileName = ref(''); 119 let privateKeyFileName = ref('');
@@ -125,6 +158,42 @@ @@ -125,6 +158,42 @@
125 caCertFileName.value = v.credentials?.caCertFileName; 158 caCertFileName.value = v.credentials?.caCertFileName;
126 certFileName.value = v.credentials?.certFileName; 159 certFileName.value = v.credentials?.certFileName;
127 privateKeyFileName.value = v.credentials?.privateKeyFileName; 160 privateKeyFileName.value = v.credentials?.privateKeyFileName;
  161 + const iscaCertFileNamePic = v.credentials?.caCertFileName.split('.').pop();
  162 + const iscertFileNamePic = v.credentials?.certFileName.split('.').pop();
  163 + const isprivateKeyFileNamePic = v.credentials?.privateKeyFileName.split('.').pop();
  164 + if (
  165 + iscaCertFileNamePic == 'jpg' ||
  166 + iscaCertFileNamePic == 'png' ||
  167 + iscaCertFileNamePic == 'jpeg' ||
  168 + iscaCertFileNamePic == 'gif'
  169 + ) {
  170 + showImg1.value = true;
  171 + showImg1Pic.value = v.credentials?.caCertFileName;
  172 + } else {
  173 + showImg1.value = false;
  174 + }
  175 + if (
  176 + iscertFileNamePic == 'jpg' ||
  177 + iscertFileNamePic == 'png' ||
  178 + iscertFileNamePic == 'jpeg' ||
  179 + iscertFileNamePic == 'gif'
  180 + ) {
  181 + showImg2.value = true;
  182 + showImg2Pic.value = v.credentials?.certFileName;
  183 + } else {
  184 + showImg2.value = false;
  185 + }
  186 + if (
  187 + isprivateKeyFileNamePic == 'jpg' ||
  188 + isprivateKeyFileNamePic == 'png' ||
  189 + isprivateKeyFileNamePic == 'jpeg' ||
  190 + isprivateKeyFileNamePic == 'gif'
  191 + ) {
  192 + showImg3.value = true;
  193 + showImg3Pic.value = v.credentials?.privateKeyFileName;
  194 + } else {
  195 + showImg3.value = false;
  196 + }
128 }; 197 };
129 const customClearStepTwoValueFunc = async () => { 198 const customClearStepTwoValueFunc = async () => {
130 nextTick(() => { 199 nextTick(() => {
@@ -135,6 +204,12 @@ @@ -135,6 +204,12 @@
135 caCertFileName.value = ''; 204 caCertFileName.value = '';
136 privateKeyFileName.value = ''; 205 privateKeyFileName.value = '';
137 certFileName.value = ''; 206 certFileName.value = '';
  207 + showImg1.value = false;
  208 + showImg1Pic.value = '';
  209 + showImg2.value = false;
  210 + showImg2Pic.value = '';
  211 + showImg3.value = false;
  212 + showImg3Pic.value = '';
138 }); 213 });
139 }; 214 };
140 async function customResetFunc() { 215 async function customResetFunc() {
@@ -153,11 +228,19 @@ @@ -153,11 +228,19 @@
153 */ 228 */
154 const handleChange = async (e, { file }) => { 229 const handleChange = async (e, { file }) => {
155 if (file.status === 'removed') { 230 if (file.status === 'removed') {
156 - e == 'T'  
157 - ? (fileList1.value = [])  
158 - : e == 'F'  
159 - ? (fileList2.value = [])  
160 - : (fileList3.value = []); 231 + if (e == 'T') {
  232 + fileList1.value = [];
  233 + showImg1.value = false;
  234 + showImg1Pic.value = '';
  235 + } else if (e == 'F') {
  236 + fileList2.value = [];
  237 + showImg2.value = false;
  238 + showImg2Pic.value = '';
  239 + } else {
  240 + fileList3.value = [];
  241 + showImg3.value = false;
  242 + showImg3Pic.value = '';
  243 + }
161 } else { 244 } else {
162 const isLt5M = file.size / 1024 / 1024 < 5; 245 const isLt5M = file.size / 1024 / 1024 < 5;
163 if (!isLt5M) { 246 if (!isLt5M) {
@@ -172,11 +255,49 @@ @@ -172,11 +255,49 @@
172 formData.append('file', file); 255 formData.append('file', file);
173 const response = await uploadApi(formData); 256 const response = await uploadApi(formData);
174 if (response.fileStaticUri) { 257 if (response.fileStaticUri) {
175 - e == 'T'  
176 - ? (caCertFileName.value = response.fileStaticUri)  
177 - : e == 'F'  
178 - ? (certFileName.value = response.fileStaticUri)  
179 - : (privateKeyFileName.value = response.fileStaticUri); 258 + if (e == 'T') {
  259 + caCertFileName.value = response.fileStaticUri;
  260 + const iscaCertFileNamePic = caCertFileName.value.split('.').pop();
  261 + if (
  262 + iscaCertFileNamePic == 'jpg' ||
  263 + iscaCertFileNamePic == 'png' ||
  264 + iscaCertFileNamePic == 'jpeg' ||
  265 + iscaCertFileNamePic == 'gif'
  266 + ) {
  267 + showImg1.value = true;
  268 + showImg1Pic.value = response.fileStaticUri;
  269 + } else {
  270 + showImg1.value = false;
  271 + }
  272 + } else if (e == 'F') {
  273 + certFileName.value = response.fileStaticUri;
  274 + const iscertFileNamePic = certFileName.value.split('.').pop();
  275 + if (
  276 + iscertFileNamePic == 'jpg' ||
  277 + iscertFileNamePic == 'png' ||
  278 + iscertFileNamePic == 'jpeg' ||
  279 + iscertFileNamePic == 'gif'
  280 + ) {
  281 + showImg2.value = true;
  282 + showImg2Pic.value = response.fileStaticUri;
  283 + } else {
  284 + showImg2.value = false;
  285 + }
  286 + } else {
  287 + privateKeyFileName.value = response.fileStaticUri;
  288 + const isprivateKeyFileNamePic = privateKeyFileName.value.split('.').pop();
  289 + if (
  290 + isprivateKeyFileNamePic == 'jpg' ||
  291 + isprivateKeyFileNamePic == 'png' ||
  292 + isprivateKeyFileNamePic == 'jpeg' ||
  293 + isprivateKeyFileNamePic == 'gif'
  294 + ) {
  295 + showImg3.value = true;
  296 + showImg3Pic.value = response.fileStaticUri;
  297 + } else {
  298 + showImg3.value = false;
  299 + }
  300 + }
180 } 301 }
181 } 302 }
182 } 303 }
@@ -211,6 +332,12 @@ @@ -211,6 +332,12 @@
211 caCertFileName, 332 caCertFileName,
212 privateKeyFileName, 333 privateKeyFileName,
213 certFileName, 334 certFileName,
  335 + showImg1,
  336 + showImg1Pic,
  337 + showImg2,
  338 + showImg2Pic,
  339 + showImg3,
  340 + showImg3Pic,
214 }; 341 };
215 }, 342 },
216 }); 343 });
@@ -27,7 +27,7 @@ @@ -27,7 +27,7 @@
27 const clearName = ref(''); 27 const clearName = ref('');
28 const [register, { validate, setFieldsValue, resetFields: defineClearFunc, clearValidate }] = 28 const [register, { validate, setFieldsValue, resetFields: defineClearFunc, clearValidate }] =
29 useForm({ 29 useForm({
30 - labelWidth: 120, 30 + labelWidth: 130,
31 schemas: modeKafkaForm, 31 schemas: modeKafkaForm,
32 actionColOptions: { 32 actionColOptions: {
33 span: 14, 33 span: 14,
@@ -22,6 +22,15 @@ @@ -22,6 +22,15 @@
22 </p> 22 </p>
23 </a-upload-dragger> 23 </a-upload-dragger>
24 </template> 24 </template>
  25 + <template #showImg1="{ field }">
  26 + <span style="display: none">{{ field }}</span>
  27 + <img
  28 + v-if="showImg1"
  29 + :src="showImg1Pic"
  30 + alt="avatar"
  31 + style="width: 6.25rem; height: 6.25rem"
  32 + />
  33 + </template>
25 <div style="margin-top: 50px"></div> 34 <div style="margin-top: 50px"></div>
26 <template #uploadAdd2="{ field }"> 35 <template #uploadAdd2="{ field }">
27 <span style="display: none">{{ field }}</span> 36 <span style="display: none">{{ field }}</span>
@@ -44,6 +53,15 @@ @@ -44,6 +53,15 @@
44 </p> 53 </p>
45 </a-upload-dragger> 54 </a-upload-dragger>
46 </template> 55 </template>
  56 + <template #showImg2="{ field }">
  57 + <span style="display: none">{{ field }}</span>
  58 + <img
  59 + v-if="showImg2"
  60 + :src="showImg2Pic"
  61 + alt="avatar"
  62 + style="width: 6.25rem; height: 6.25rem"
  63 + />
  64 + </template>
47 <div style="margin-top: 50px"></div> 65 <div style="margin-top: 50px"></div>
48 <template #uploadAdd3="{ field }"> 66 <template #uploadAdd3="{ field }">
49 <span style="display: none">{{ field }}</span> 67 <span style="display: none">{{ field }}</span>
@@ -66,6 +84,15 @@ @@ -66,6 +84,15 @@
66 </p> 84 </p>
67 </a-upload-dragger> 85 </a-upload-dragger>
68 </template> 86 </template>
  87 + <template #showImg3="{ field }">
  88 + <span style="display: none">{{ field }}</span>
  89 + <img
  90 + v-if="showImg3"
  91 + :src="showImg3Pic"
  92 + alt="avatar"
  93 + style="width: 6.25rem; height: 6.25rem"
  94 + />
  95 + </template>
69 </BasicForm> 96 </BasicForm>
70 </div> 97 </div>
71 </template> 98 </template>
@@ -90,6 +117,12 @@ @@ -90,6 +117,12 @@
90 }, 117 },
91 emits: ['next', 'prev', 'register'], 118 emits: ['next', 'prev', 'register'],
92 setup(_, { emit }) { 119 setup(_, { emit }) {
  120 + const showImg1 = ref(false);
  121 + const showImg1Pic = ref('');
  122 + const showImg2 = ref(false);
  123 + const showImg2Pic = ref('');
  124 + const showImg3 = ref(false);
  125 + const showImg3Pic = ref('');
93 const { createMessage } = useMessage(); 126 const { createMessage } = useMessage();
94 let caCertFileName = ref(''); 127 let caCertFileName = ref('');
95 let privateKeyFileName = ref(''); 128 let privateKeyFileName = ref('');
@@ -123,11 +156,19 @@ @@ -123,11 +156,19 @@
123 */ 156 */
124 const handleChange = async (e, { file }) => { 157 const handleChange = async (e, { file }) => {
125 if (file.status === 'removed') { 158 if (file.status === 'removed') {
126 - e == 'T'  
127 - ? (fileList1.value = [])  
128 - : e == 'F'  
129 - ? (fileList2.value = [])  
130 - : (fileList3.value = []); 159 + if (e == 'T') {
  160 + fileList1.value = [];
  161 + showImg1.value = false;
  162 + showImg1Pic.value = '';
  163 + } else if (e == 'F') {
  164 + fileList2.value = [];
  165 + showImg2.value = false;
  166 + showImg2Pic.value = '';
  167 + } else {
  168 + fileList3.value = [];
  169 + showImg3.value = false;
  170 + showImg3Pic.value = '';
  171 + }
131 } else { 172 } else {
132 const isLt5M = file.size / 1024 / 1024 < 5; 173 const isLt5M = file.size / 1024 / 1024 < 5;
133 if (!isLt5M) { 174 if (!isLt5M) {
@@ -142,11 +183,49 @@ @@ -142,11 +183,49 @@
142 formData.append('file', file); 183 formData.append('file', file);
143 const response = await uploadApi(formData); 184 const response = await uploadApi(formData);
144 if (response.fileStaticUri) { 185 if (response.fileStaticUri) {
145 - e == 'T'  
146 - ? (caCertFileName.value = response.fileStaticUri)  
147 - : e == 'F'  
148 - ? (certFileName.value = response.fileStaticUri)  
149 - : (privateKeyFileName.value = response.fileStaticUri); 186 + if (e == 'T') {
  187 + caCertFileName.value = response.fileStaticUri;
  188 + const iscaCertFileNamePic = caCertFileName.value.split('.').pop();
  189 + if (
  190 + iscaCertFileNamePic == 'jpg' ||
  191 + iscaCertFileNamePic == 'png' ||
  192 + iscaCertFileNamePic == 'jpeg' ||
  193 + iscaCertFileNamePic == 'gif'
  194 + ) {
  195 + showImg1.value = true;
  196 + showImg1Pic.value = response.fileStaticUri;
  197 + } else {
  198 + showImg1.value = false;
  199 + }
  200 + } else if (e == 'F') {
  201 + certFileName.value = response.fileStaticUri;
  202 + const iscertFileNamePic = certFileName.value.split('.').pop();
  203 + if (
  204 + iscertFileNamePic == 'jpg' ||
  205 + iscertFileNamePic == 'png' ||
  206 + iscertFileNamePic == 'jpeg' ||
  207 + iscertFileNamePic == 'gif'
  208 + ) {
  209 + showImg2.value = true;
  210 + showImg2Pic.value = response.fileStaticUri;
  211 + } else {
  212 + showImg2.value = false;
  213 + }
  214 + } else {
  215 + privateKeyFileName.value = response.fileStaticUri;
  216 + const isprivateKeyFileNamePic = privateKeyFileName.value.split('.').pop();
  217 + if (
  218 + isprivateKeyFileNamePic == 'jpg' ||
  219 + isprivateKeyFileNamePic == 'png' ||
  220 + isprivateKeyFileNamePic == 'jpeg' ||
  221 + isprivateKeyFileNamePic == 'gif'
  222 + ) {
  223 + showImg3.value = true;
  224 + showImg3Pic.value = response.fileStaticUri;
  225 + } else {
  226 + showImg3.value = false;
  227 + }
  228 + }
150 } 229 }
151 } 230 }
152 } 231 }
@@ -182,6 +261,42 @@ @@ -182,6 +261,42 @@
182 caCertFileName.value = v.credentials?.caCertFileName; 261 caCertFileName.value = v.credentials?.caCertFileName;
183 certFileName.value = v.credentials?.certFileName; 262 certFileName.value = v.credentials?.certFileName;
184 privateKeyFileName.value = v.credentials?.privateKeyFileName; 263 privateKeyFileName.value = v.credentials?.privateKeyFileName;
  264 + const iscaCertFileNamePic = v.credentials?.caCertFileName.split('.').pop();
  265 + const iscertFileNamePic = v.credentials?.certFileName.split('.').pop();
  266 + const isprivateKeyFileNamePic = v.credentials?.privateKeyFileName.split('.').pop();
  267 + if (
  268 + iscaCertFileNamePic == 'jpg' ||
  269 + iscaCertFileNamePic == 'png' ||
  270 + iscaCertFileNamePic == 'jpeg' ||
  271 + iscaCertFileNamePic == 'gif'
  272 + ) {
  273 + showImg1.value = true;
  274 + showImg1Pic.value = v.credentials?.caCertFileName;
  275 + } else {
  276 + showImg1.value = false;
  277 + }
  278 + if (
  279 + iscertFileNamePic == 'jpg' ||
  280 + iscertFileNamePic == 'png' ||
  281 + iscertFileNamePic == 'jpeg' ||
  282 + iscertFileNamePic == 'gif'
  283 + ) {
  284 + showImg2.value = true;
  285 + showImg2Pic.value = v.credentials?.certFileName;
  286 + } else {
  287 + showImg2.value = false;
  288 + }
  289 + if (
  290 + isprivateKeyFileNamePic == 'jpg' ||
  291 + isprivateKeyFileNamePic == 'png' ||
  292 + isprivateKeyFileNamePic == 'jpeg' ||
  293 + isprivateKeyFileNamePic == 'gif'
  294 + ) {
  295 + showImg3.value = true;
  296 + showImg3Pic.value = v.credentials?.privateKeyFileName;
  297 + } else {
  298 + showImg3.value = false;
  299 + }
185 }; 300 };
186 const customClearStepTwoValueFunc = async () => { 301 const customClearStepTwoValueFunc = async () => {
187 nextTick(() => { 302 nextTick(() => {
@@ -192,6 +307,12 @@ @@ -192,6 +307,12 @@
192 caCertFileName.value = ''; 307 caCertFileName.value = '';
193 privateKeyFileName.value = ''; 308 privateKeyFileName.value = '';
194 certFileName.value = ''; 309 certFileName.value = '';
  310 + showImg1.value = false;
  311 + showImg1Pic.value = '';
  312 + showImg2.value = false;
  313 + showImg2Pic.value = '';
  314 + showImg3.value = false;
  315 + showImg3Pic.value = '';
195 }); 316 });
196 }; 317 };
197 async function customResetFunc() { 318 async function customResetFunc() {
@@ -233,6 +354,12 @@ @@ -233,6 +354,12 @@
233 caCertFileName, 354 caCertFileName,
234 privateKeyFileName, 355 privateKeyFileName,
235 certFileName, 356 certFileName,
  357 + showImg1,
  358 + showImg1Pic,
  359 + showImg2,
  360 + showImg2Pic,
  361 + showImg3,
  362 + showImg3Pic,
236 }; 363 };
237 }, 364 },
238 }); 365 });
@@ -19,7 +19,7 @@ @@ -19,7 +19,7 @@
19 }); 19 });
20 20
21 const [register, { validate, setFieldsValue, resetFields: defineClearFunc }] = useForm({ 21 const [register, { validate, setFieldsValue, resetFields: defineClearFunc }] = useForm({
22 - labelWidth: 120, 22 + labelWidth: 140,
23 schemas: modeRabbitMqForm, 23 schemas: modeRabbitMqForm,
24 actionColOptions: { 24 actionColOptions: {
25 span: 14, 25 span: 14,
@@ -16,7 +16,7 @@ @@ -16,7 +16,7 @@
16 title="您确定要批量删除数据" 16 title="您确定要批量删除数据"
17 ok-text="确定" 17 ok-text="确定"
18 cancel-text="取消" 18 cancel-text="取消"
19 - @confirm="handleDeleteOrBatchDelete(null)" 19 + @confirm="handleConfirm"
20 > 20 >
21 <a-button 21 <a-button
22 type="primary" 22 type="primary"
@@ -29,19 +29,21 @@ @@ -29,19 +29,21 @@
29 </a-button> 29 </a-button>
30 </Popconfirm> 30 </Popconfirm>
31 </Authority> 31 </Authority>
32 - <a-button 32 + <!-- <a-button
33 :disabled="disabledStatus2" 33 :disabled="disabledStatus2"
34 @click="handleMutiuteDisable" 34 @click="handleMutiuteDisable"
35 :type="disabledStatus2 ? 'default' : 'primary'" 35 :type="disabledStatus2 ? 'default' : 'primary'"
36 > 36 >
37 <span :style="{ color: disabledStatus2 ? 'grey' : 'white' }">批量禁用</span> 37 <span :style="{ color: disabledStatus2 ? 'grey' : 'white' }">批量禁用</span>
38 - </a-button> 38 + </a-button> -->
39 <a-button 39 <a-button
40 - :disabled="disabledStatus3" 40 + :disabled="hasBatchDelete || disabledStatus3"
41 @click="handleMutiuteEnable" 41 @click="handleMutiuteEnable"
42 - :type="disabledStatus3 ? 'default' : 'primary'" 42 + :type="hasBatchDelete || disabledStatus3 ? 'default' : 'primary'"
43 > 43 >
44 - <span :style="{ color: disabledStatus3 ? 'grey' : 'white' }">批量启用</span> 44 + <span :style="{ color: hasBatchDelete || disabledStatus3 ? 'grey' : 'white' }"
  45 + >批量启用</span
  46 + >
45 </a-button> 47 </a-button>
46 </template> 48 </template>
47 <template #action="{ record }"> 49 <template #action="{ record }">
@@ -127,9 +129,10 @@ @@ -127,9 +129,10 @@
127 const disabledStatus3 = ref(true); 129 const disabledStatus3 = ref(true);
128 const loading = ref(true); 130 const loading = ref(true);
129 const { createMessage } = useMessage(); 131 const { createMessage } = useMessage();
130 - let selectedRowKeys: any = ref([]);  
131 let getSelectRowsArr: any = ref([]); 132 let getSelectRowsArr: any = ref([]);
132 let isJudgeSelectRowsArr: any = ref([]); 133 let isJudgeSelectRowsArr: any = ref([]);
  134 + let hasDisableStatus = [];
  135 +
133 const handleSuccess = () => { 136 const handleSuccess = () => {
134 reload(); 137 reload();
135 resetSelectedRowKeys(); 138 resetSelectedRowKeys();
@@ -163,6 +166,11 @@ @@ -163,6 +166,11 @@
163 const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions, resetSelectedRowKeys } = 166 const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions, resetSelectedRowKeys } =
164 useBatchDelete(deleteConvertApi, handleSuccess, setProps); 167 useBatchDelete(deleteConvertApi, handleSuccess, setProps);
165 selectionOptions.rowSelection.getCheckboxProps = (record: Recordable) => { 168 selectionOptions.rowSelection.getCheckboxProps = (record: Recordable) => {
  169 + if (record.length == 0) {
  170 + disabledStatus1.value = true;
  171 + disabledStatus2.value = true;
  172 + disabledStatus3.value = true;
  173 + }
166 //status为1的选择框禁用 174 //status为1的选择框禁用
167 if (record.status === 1) { 175 if (record.status === 1) {
168 return { disabled: true }; 176 return { disabled: true };
@@ -194,39 +202,40 @@ @@ -194,39 +202,40 @@
194 }, 10); 202 }, 10);
195 }; 203 };
196 const useSelectionChange = () => { 204 const useSelectionChange = () => {
197 - selectedRowKeys.value = getSelectRowKeys();  
198 isJudgeSelectRowsArr.value = getSelectRows(); 205 isJudgeSelectRowsArr.value = getSelectRows();
199 - const hasDisableStatus = isJudgeSelectRowsArr.value.map((m) => { 206 + hasDisableStatus = isJudgeSelectRowsArr.value.map((m) => {
200 return m.status; 207 return m.status;
201 }); 208 });
  209 + console.log(hasDisableStatus);
202 if (hasDisableStatus.length == 0) { 210 if (hasDisableStatus.length == 0) {
203 disabledStatus1.value = true; 211 disabledStatus1.value = true;
204 disabledStatus2.value = true; 212 disabledStatus2.value = true;
205 disabledStatus3.value = true; 213 disabledStatus3.value = true;
206 - }  
207 - hasDisableStatus.every((e) => {  
208 - if (e == 1) {  
209 - disabledStatus3.value = true;  
210 - disabledStatus2.value = false;  
211 - } else if (e == 0) {  
212 - disabledStatus2.value = true;  
213 - disabledStatus3.value = false;  
214 - }  
215 - });  
216 - let i1 = hasDisableStatus.indexOf(0);  
217 - let i2 = hasDisableStatus.indexOf(1);  
218 - if (i1 !== -1 && i2 !== -1) {  
219 - disabledStatus2.value = true;  
220 - disabledStatus3.value = true;  
221 - }  
222 - if (isJudgeSelectRowsArr.value.length == 0) {  
223 - disabledStatus1.value = true;  
224 } else { 214 } else {
225 - disabledStatus1.value = false;  
226 - }  
227 - if (hasDisableStatus.includes(1)) {  
228 - disabledStatus1.value = true; 215 + hasDisableStatus.every((e) => {
  216 + if (e == 1) {
  217 + disabledStatus3.value = true;
  218 + disabledStatus2.value = false;
  219 + } else if (e == 0) {
  220 + disabledStatus2.value = true;
  221 + disabledStatus3.value = false;
  222 + }
  223 + });
229 } 224 }
  225 + // let i1 = hasDisableStatus.indexOf(0);
  226 + // let i2 = hasDisableStatus.indexOf(1);
  227 + // if (i1 !== -1 && i2 !== -1) {
  228 + // disabledStatus2.value = true;
  229 + // disabledStatus3.value = true;
  230 + // }
  231 + // if (isJudgeSelectRowsArr.value.length == 0) {
  232 + // disabledStatus1.value = true;
  233 + // } else {
  234 + // disabledStatus1.value = false;
  235 + // }
  236 + // if (hasDisableStatus.includes(1)) {
  237 + // disabledStatus1.value = true;
  238 + // }
230 }; 239 };
231 const handleMutiuteDisable = async () => { 240 const handleMutiuteDisable = async () => {
232 enableObj.convertIds.length = 0; 241 enableObj.convertIds.length = 0;
@@ -322,6 +331,10 @@ @@ -322,6 +331,10 @@
322 }); 331 });
323 }); 332 });
324 } 333 }
  334 + const handleConfirm = () => {
  335 + handleDeleteOrBatchDelete(null);
  336 + disabledStatus3.value = true;
  337 + };
325 338
326 return { 339 return {
327 disabledStatus1, 340 disabledStatus1,
@@ -342,6 +355,7 @@ @@ -342,6 +355,7 @@
342 statusChange, 355 statusChange,
343 disabledSwitch, 356 disabledSwitch,
344 handleView, 357 handleView,
  358 + handleConfirm,
345 }; 359 };
346 }, 360 },
347 }); 361 });