0017
/
iot-ui-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: bug#10647、10644、10640

This commit is contained in:
JiangQiming 2023-03-21 16:43:09 +08:00
parent cc879c1731
commit 9759fea2cc
1 changed files with 70 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

123
src/views/system/Permission/components/EditDialog.vue
View File

@ -11,19 +11,7 @@
<j-form ref="formRef" :model="form.data" layout="vertical">
<j-form-item
name="id"
:rules="[
{
required: true,
message: '请输入标识(ID)',
trigger: 'change',
},
{
max: 64,
message: '最多可输入64个字符',
trigger: 'change',
},
{ validator: form.rules.idCheck, trigger: 'blur' },
]"
:rules="[{ validator: form.rules.idCheck, trigger: 'blur' }]"
class="question-item"
>
<template #label>
@ -61,38 +49,57 @@
placeholder="请输入名称"
/>
</j-form-item>
<!-- 操作权限列表 -->
<j-table
:columns="table.columns"
:data-source="form.data.actionTableData"
:pagination="false"
>
<template #bodyCell="{ column, record, index }">
<template v-if="column.key === 'index'">
{{
`#${
(pager.current - 1) * pager.pageSize +
(index + 1)
}.`
}}
</template>
<template
v-else-if="
column.key !== 'index' && column.key !== 'act'
"
>
<j-form-item
:name="['actionTableData', index, column.key]"
:rules="[
{
required: column.key !== 'describe',
message: `请输入${column.title}`,
},
{
max: 64,
message: '最多可输入64个字符',
},
]"
>
<j-input v-model:value="record[column.key]" />
</j-form-item>
</template>
<template v-else-if="column.key === 'act'">
<j-button
class="delete-btn"
style="padding: 0"
type="link"
@click="table.clickRemove(index)"
>
<AIcon type="DeleteOutlined" />
</j-button>
</template>
</template>
</j-table>
</j-form>
<j-table
:columns="table.columns"
:data-source="actionTableData"
:pagination="false"
>
<template #bodyCell="{ column, record, index }">
<template v-if="column.key === 'index'">
{{
`#${
(pager.current - 1) * pager.pageSize + (index + 1)
}.`
}}
</template>
<template
v-else-if="column.key !== 'index' && column.key !== 'act'"
>
<j-input v-model:value="record[column.key]" />
</template>
<template v-else-if="column.key === 'act'">
<j-button
class="delete-btn"
style="padding: 0"
type="link"
@click="table.clickRemove(index)"
>
<AIcon type="DeleteOutlined" />
</j-button>
</template>
</template>
</j-table>
<div class="pager" v-show="pager.total > pager.pageSize">
<j-select v-model:value="pager.current" style="width: 60px">
<j-select-option v-for="(val, i) in pageArr" :value="i + 1">{{
@ -156,6 +163,16 @@ const form = reactive({
name: '',
id: '',
...props.data,
actionTableData: computed(() => {
const startIndex = (pager.current - 1) * pager.pageSize;
const endIndex = Math.min(
pager.current * pager.pageSize,
table.data.length,
);
console.log(startIndex, endIndex);
return table.data.slice(startIndex, endIndex);
}),
},
rules: {
// 校验标识是否可用
@ -216,7 +233,7 @@ const table = reactive({
key: 'act',
},
],
data: props.data.id ? props.data.actions : [...defaultAction],
data: props.data.id ? [...props.data.actions] : [...defaultAction],
clickRemove: (index: number) => {
pager.total -= 1;
table.data.splice(index, 1);
@ -245,16 +262,16 @@ const pageArr = computed(() => {
const maxPageNum = Math.ceil(pager.total / pager.pageSize);
return new Array(maxPageNum).fill(1);
});
const actionTableData = computed(() => {
const startIndex = (pager.current - 1) * pager.pageSize;
const endIndex = Math.min(
pager.current * pager.pageSize,
table.data.length,
);
console.log(startIndex, endIndex);
// const actionTableData = computed(() => {
// const startIndex = (pager.current - 1) * pager.pageSize;
// const endIndex = Math.min(
// pager.current * pager.pageSize,
// table.data.length,
// );
// console.log(startIndex, endIndex);
return table.data.slice(startIndex, endIndex);
});
// return table.data.slice(startIndex, endIndex);
// });
</script>
<style lang="less" scoped>