fix: bug#16275、16087

This commit is contained in:
leiqiaochu 2023-07-13 09:29:01 +08:00
parent 42970df453
commit 3a90a25f3e
8 changed files with 175 additions and 50 deletions

View File

@ -1,35 +1,35 @@
<!-- webhook请求头可编辑表格 -->
<template>
<div class="table-wrapper">
<j-table
:columns="columns"
:data-source="dataSource"
bordered
:pagination="false"
>
<template #bodyCell="{ column, text, record }">
<template v-if="['key', 'value'].includes(column.dataIndex)">
<j-input v-model:value="record[column.dataIndex]" />
<j-form :model="dataSource.table" ref="tableRef">
<j-table :columns="columns" :data-source="dataSource.table" bordered :pagination="false" rowKey="_key">
<template #bodyCell="{ column, text, record, index }">
<template v-if="['key', 'value'].includes(column.dataIndex)">
<j-form-item :name="[index, column.dataIndex]" :rules="[
{
max: 64,
message: '最多可输入64个字符'
},
{ required: true, message: `请输入${column.title}`, trigger: 'blur' }]"
>
<j-input v-model:value="record[column.dataIndex]"/></j-form-item>
</template>
<template v-else-if="column.dataIndex === 'operation'">
<j-button type="text">
<template #icon>
<delete-outlined @click="handleDelete(record.id)" />
</template>
</j-button>
</template>
</template>
<template v-else-if="column.dataIndex === 'operation'">
<j-button type="text">
<template #icon>
<delete-outlined @click="handleDelete(record.id)" />
</template>
</j-button>
</j-table>
<j-button type="dashed" @click="handleAdd" style="width: 100%; margin-top: 5px">
<template #icon>
<plus-outlined />
</template>
</template>
</j-table>
<j-button
type="dashed"
@click="handleAdd"
style="width: 100%; margin-top: 5px"
>
<template #icon>
<plus-outlined />
</template>
添加
</j-button>
添加
</j-button>
</j-form>
</div>
</template>
@ -37,7 +37,8 @@
import { PlusOutlined, DeleteOutlined } from '@ant-design/icons-vue';
import { PropType } from 'vue';
import type { IHeaders } from '../../types';
import { randomString } from '@/utils/utils'
import { reject } from 'lodash-es';
type Emits = {
(e: 'update:headers', data: IHeaders[]): void;
};
@ -50,6 +51,8 @@ const props = defineProps({
},
});
const tableRef = ref();
const columns = [
{
title: 'KEY',
@ -66,23 +69,48 @@ const columns = [
fixed: 'right',
},
];
const dataSource = computed({
get: () => props.headers,
set: (val) => emit('update:headers', val),
const dataSource = reactive({
table:props.headers
});
const handleHeader= (data:any) =>{
return data.map((item:any)=>{
return {...item,_key: randomString()}
})
}
watch(()=>JSON.stringify(props.headers),()=>{
dataSource.table = handleHeader(props.headers)
})
const handleDelete = (id: number) => {
const idx = dataSource.value.findIndex((f) => f.id === id);
dataSource.value.splice(idx, 1);
const idx = dataSource.table.findIndex((f) => f.id === id);
dataSource.table.splice(idx, 1);
};
const valueChange = () =>{
return dataSource.table.map((item:any)=>{
const {_key,...extra}=item;
return extra
})
}
const handleAdd = () => {
dataSource.value.push({
id: dataSource.value.length,
dataSource.table.push({
_key: randomString(),
key: '',
value: '',
});
};
const validate = () =>{
tableRef.value.validate().then(()=>{
return valueChange()
}).catch((err:any)=>{
return false
})
}
defineExpose({
validate
})
</script>
<style lang="less" scoped></style>
<style lang="less" scoped>
:deep(.ant-form-item){
margin-top: -20px ;
}
</style>

View File

@ -288,7 +288,8 @@
</j-form-item>
<j-form-item label="请求头">
<EditTable
v-model:headers="
ref="editTable"
:headers="
formData.configuration.headers
"
/>
@ -340,6 +341,7 @@ const router = useRouter();
const route = useRoute();
const useForm = Form.useForm;
const flag = ref<boolean>(false)
const editTable = ref();
//
const msgType = ref([
@ -544,7 +546,8 @@ const resetPublicFiles = () => {
*/
const btnLoading = ref<boolean>(false);
const handleSubmit = () => {
validate()
if(editTable.value.validate()){
validate()
.then(async () => {
btnLoading.value = true;
let res;
@ -570,6 +573,59 @@ const handleSubmit = () => {
.finally(() => {
btnLoading.value = false;
});
}
// Promise.all([validate(),editTable.value.validate()]).then(async()=>{
// btnLoading.value = true;
// let res;
// if (!formData.value.id) {
// res = await configApi.save(formData.value);
// } else {
// res = await configApi.update(formData.value);
// }
// if (res?.success) {
// onlyMessage('');
// if (route.query?.notifyType) {
// // @ts-ignore
// window?.onTabSaveSuccess(res.result);
// setTimeout(() => window.close(), 300);
// } else {
// router.back();
// }
// }
// }) .catch((err) => {
// console.log('err: ', err);
// })
// .finally(() => {
// btnLoading.value = false;
// });
// validate()
// .then(async () => {
// const a = editTable.value.validate();
// console.log(a);
// btnLoading.value = true;
// let res;
// if (!formData.value.id) {
// res = await configApi.save(formData.value);
// } else {
// res = await configApi.update(formData.value);
// }
// if (res?.success) {
// onlyMessage('');
// if (route.query?.notifyType) {
// // @ts-ignore
// window?.onTabSaveSuccess(res.result);
// setTimeout(() => window.close(), 300);
// } else {
// router.back();
// }
// }
// })
// .catch((err) => {
// console.log('err: ', err);
// })
// .finally(() => {
// btnLoading.value = false;
// });
};
watchEffect(() => {

View File

@ -1,4 +1,5 @@
export interface IHeaders {
_key?: string;
id?: number;
key: string;
value: string;

View File

@ -25,6 +25,10 @@ const context = ref()
const replaceData = async (data: any) => {
detailData.value = data
context.value = data.context
if (context.value.detailJson) {
context.value.detailJson = context.value.detailJson.replace(/\\\"/g, '\"')
}
if (context.value.hasOwnProperty('userIdList') || context.value.hasOwnProperty('toUser')) {
templateApi.getUser(
typeObj[detailData.value.notifyType],

View File

@ -111,7 +111,7 @@ import dayjs from 'dayjs';
const departmentStore = useDepartmentStore();
const emits = defineEmits(['confirm', 'update:visible']);
const emits = defineEmits(['confirm', 'update:visible','next']);
const props = defineProps<{
visible: boolean;
queryColumns: any[];
@ -149,6 +149,7 @@ const confirm = () => {
onlyMessage('操作成功');
emits('confirm');
emits('update:visible', false);
emits('next',table.selectedRows.map((item: any) => item.id))
})
.finally(() => {
loading.value = false;
@ -457,13 +458,19 @@ const selectAll = (selected: Boolean, selectedRows: any,changeRows:any) => {
}
}
const cancel = () => {
departmentStore.setProductId()
departmentStore.setProductId(undefined)
emits('update:visible', false)
}
const search = (query: any) => {
queryParams.value = query
}
onUnmounted(()=>{
if(props.assetType ==='device'){
departmentStore.setProductId(undefined)
}
console.log(departmentStore.productId)
})
</script>
<style lang="less" scoped>

View File

@ -277,7 +277,7 @@ const columns = [
handleValue(value: string, data: any) {
return value && value.length ? [{
column: 'id',
termType: data.termType === 'not' ? 'nin' : 'in',
termType: data?.termType === 'not' ? 'nin' : 'in',
value: `${value.toString()}`
}] : undefined;
},

View File

@ -230,6 +230,7 @@
asset-type="product"
:defaultPermission="tableData.defaultPermission"
@confirm="table.refresh"
@next="next"
/>
<NextDialog
v-if="dialogs.nextShow"
@ -613,6 +614,9 @@ watch(
if (!val) tableData.selectedRows = [];
},
);
const next = (data:any) =>{
}
</script>
<style lang="less" scoped>

View File

@ -14,7 +14,9 @@
:params="queryParams"
:rowSelection="{
selectedRowKeys: table._selectedRowKeys,
onChange: table.onSelectChange,
onSelect: table.onSelectChange,
onSelectAll: selectAll,
onSelectNone: () => table._selectedRowKeys = []
}"
model="TABLE"
>
@ -156,7 +158,6 @@ const table = reactive({
_selectedRowKeys: [] as string[],
requestFun: async (oParams: any) => {
table.cancelSelect();
if (props.parentId) {
const params = {
...oParams,
@ -199,14 +200,19 @@ const table = reactive({
unBindUser_api(props.parentId, ids).then(() => {
onlyMessage('操作成功');
table._selectedRowKeys = []
table.refresh();
});
},
onSelectChange: (keys: string[]) => {
table._selectedRowKeys = keys;
},
cancelSelect: () => {
table._selectedRowKeys = [];
onSelectChange: (row:any,selected:Boolean) => {
const arr = new Set(table._selectedRowKeys);
console.log(row)
if(selected){
arr.add(row.id)
}else{
arr.delete(row.id)
}
table._selectedRowKeys = [...arr.values()]
},
//
refresh: () => {
@ -216,10 +222,29 @@ const table = reactive({
const dialogVisible = ref(false);
const selectAll = (selected: Boolean, selectedRows: any,changeRows:any) => {
if (selected) {
changeRows.map((i: any) => {
if (!table._selectedRowKeys.includes(i.id)) {
table._selectedRowKeys.push(i.id)
}
})
} else {
const arr = changeRows.map((item: any) => item.id)
const _ids: string[] = [];
table._selectedRowKeys.map((i: any) => {
if (!arr.includes(i)) {
_ids.push(i)
}
})
table._selectedRowKeys = _ids;
}
}
watch(
() => props.parentId,
() => {
table.refresh();
table._selectedRowKeys = []
},
);
</script>