优化布局推荐

This commit is contained in:
zjl 2024-12-12 13:29:34 +08:00
parent a87d8b4bad
commit fae37e2738
6 changed files with 119 additions and 37 deletions

View File

@ -13,16 +13,16 @@ export const columns = [
fixed: 'left',
width: 50,
},
{
title: '位置编号',
key: 'location',
width: 100,
},
{
title: '位置描述',
key: 'description',
width: 200,
},
{
title: '位置编号',
key: 'location',
width: 100,
},
{
title: '排序',
key: 'sort',

View File

@ -14,6 +14,9 @@
label-placement="left"
label-width="85px"
>
<n-form-item label="描述" path="description">
<n-input type="textarea" v-model:value="formData.description" placeholder="请输入描述" />
</n-form-item>
<n-form-item
label="位置编号"
path="location"
@ -21,9 +24,6 @@
>
<number-input v-model="formData.location" placeholder="请输入位置编号" clearable />
</n-form-item>
<n-form-item label="描述" path="description">
<n-input type="textarea" v-model:value="formData.description" placeholder="请输入描述" />
</n-form-item>
<n-form-item label="排序" path="sort">
<n-input-number v-model:value="formData.sort" />
</n-form-item>
@ -66,11 +66,16 @@
default: 0,
},
});
/**
* 定义模态
*/
const [modalRegister, { openModal, setSubLoading }] = useModal({
title: props.layoutId ? '编辑布局' : '添加布局',
subBtuText: '确定',
width: 600,
});
/**
* 执行提交
*/
@ -118,7 +123,10 @@
setFormData();
}
});
//
/**
* 定义函数
*/
defineExpose({
openModal,
});

View File

@ -27,7 +27,6 @@
</template>
新建
</n-button>
<n-button
type="error"
@click="handleDelete"
@ -63,12 +62,13 @@
import { getLayoutList, layoutDelete, layoutBatchDelete } from '@/api/content/layout';
import { columns } from './columns';
import { PlusOutlined, DeleteOutlined, FormOutlined } from '@vicons/antd';
import CreateModal from './CreateModal.vue';
import editDialog from './edit.vue';
import { basicModal, useModal } from '@/components/Modal';
import { schemas } from './querySchemas';
import { renderIcon } from '@/utils';
/**
* 定义常量
*/
const message = useMessage();
const dialog = useDialog();
const basicTableRef = ref();
@ -76,15 +76,20 @@
const editVisible = ref(false);
const layoutId = ref(0);
const rowKeys = ref([]);
const exportLoading = ref(false);
const showModal = ref(false);
/**
* 定义查询参数
*/
const formParams = reactive({
description: '',
});
/**
* 定义操作栏
*/
const actionColumn = reactive({
width: 400,
width: 200,
title: '操作',
align: 'center',
key: 'action',
@ -112,24 +117,36 @@
},
});
function addTable() {
showModal.value = true;
}
/**
* 加载数据列表
* @param res 参数
*/
const loadDataTable = async (res) => {
rowKeys.value = [];
const result = await getLayoutList({ ...formParams, ...res });
return result;
};
/**
* 数据行选中事件
* @param keys 参数
*/
function onCheckedRow(keys) {
rowKeys.value = keys;
}
/**
* 刷新数据表
* @param noRefresh 参数
*/
function reloadTable(noRefresh = '') {
basicTableRef.value.reload(noRefresh ? {} : { pageNo: 1 });
}
/**
* 执行提交表单
* @param values 参数
*/
function handleSubmit(values: Recordable) {
for (const key in formParams) {
formParams[key] = '';
@ -140,6 +157,9 @@
reloadTable();
}
/**
* 执行重置
*/
function handleReset(values: Recordable) {
for (const key in formParams) {
formParams[key] = '';
@ -150,6 +170,9 @@
reloadTable();
}
/**
* 执行注册
*/
const [register, {}] = useForm({
gridProps: { cols: '1 s:1 m:2 l:3 xl:4 2xl:4' },
labelWidth: 80,
@ -165,6 +188,7 @@
await nextTick();
createModalRef.value.openModal();
};
/**
* 执行编辑
*/
@ -174,6 +198,7 @@
await nextTick();
createModalRef.value.openModal();
}
/**
* 执行删除
* @param id 参数

View File

@ -94,20 +94,23 @@
import chooseArticle from './layout/index.vue';
import { useLockFn } from '@/utils/useLockFn';
/**
* 定义常量
*/
const emit = defineEmits(['success', 'update:visible']);
const formRef = ref();
const articleRef = ref();
const message = useMessage();
const chooseVisible = ref(false);
const layoutList = ref([]);
/**
* 定义表单参数
*/
const message = useMessage();
const chooseVisible = ref(false);
const layoutList = ref([]);
const formData = reactive({
id: '',
layoutId: undefined,
type: undefined,
layoutId: '',
type: '',
typeText: '',
typeId: '',
image: '',
@ -130,6 +133,9 @@
},
});
/**
* 定义数据
*/
const typeList = [
{ label: 'CMS文章', value: 1 },
{ label: '通知公告', value: 2 },
@ -171,6 +177,7 @@
.catch((error) => {});
};
const { isLock: subLoading, lockFn: submit } = useLockFn(handleSubmit);
/**
* 关闭窗体
*/
@ -190,6 +197,7 @@
}
}
};
/**
* 选择推荐内容成功回调事件
*/
@ -213,6 +221,7 @@
let list = await getLayoutAllList();
layoutList.value = list ? list : [];
};
/**
* 钩子函数
*/

View File

@ -27,7 +27,6 @@
</template>
新建
</n-button>
<n-button
type="error"
@click="handleDelete"
@ -63,12 +62,13 @@
import { getLayoutList, layoutDelete, layoutBatchDelete } from '@/api/content/layoutItem';
import { columns } from './columns';
import { PlusOutlined, DeleteOutlined, FormOutlined } from '@vicons/antd';
import CreateModal from './CreateModal.vue';
import editDialog from './edit.vue';
import { basicModal, useModal } from '@/components/Modal';
import { schemas } from './querySchemas';
import { renderIcon } from '@/utils';
/**
* 定义常量
*/
const message = useMessage();
const dialog = useDialog();
const basicTableRef = ref();
@ -76,14 +76,19 @@
const editVisible = ref(false);
const layoutId = ref(0);
const rowKeys = ref([]);
const exportLoading = ref(false);
const showModal = ref(false);
/**
* 定义查询参数
*/
const formParams = reactive({
name: '',
status: '',
layoutId: '',
type: '',
});
/**
* 定义操作栏
*/
const actionColumn = reactive({
width: 200,
title: '操作',
@ -113,24 +118,36 @@
},
});
function addTable() {
showModal.value = true;
}
/**
* 加载数据列表
* @param res 参数
*/
const loadDataTable = async (res) => {
rowKeys.value = [];
const result = await getLayoutList({ ...formParams, ...res });
return result;
};
/**
* 数据行选中事件
* @param keys 参数
*/
function onCheckedRow(keys) {
rowKeys.value = keys;
}
/**
* 刷新数据列表
* @param noRefresh 参数
*/
function reloadTable(noRefresh = '') {
basicTableRef.value.reload(noRefresh ? {} : { pageNo: 1 });
}
/**
* 执行提交表单
* @param values 参数
*/
function handleSubmit(values: Recordable) {
for (const key in formParams) {
formParams[key] = '';
@ -141,6 +158,10 @@
reloadTable();
}
/**
* 执行重置
* @param values 参数
*/
function handleReset(values: Recordable) {
for (const key in formParams) {
formParams[key] = '';
@ -151,6 +172,9 @@
reloadTable();
}
/**
* 执行注册
*/
const [register, {}] = useForm({
gridProps: { cols: '1 s:1 m:2 l:3 xl:4 2xl:4' },
labelWidth: 80,
@ -165,6 +189,7 @@
await nextTick();
editVisible.value = true;
};
/**
* 执行编辑
*/
@ -173,6 +198,7 @@
await nextTick();
editVisible.value = true;
}
/**
* 执行删除
* @param id 参数

View File

@ -40,6 +40,7 @@
const emit = defineEmits(['success', 'update:visible', 'update:checked-row-keys']);
const message = useMessage();
/**
* 定义接收的参数
*/
@ -58,10 +59,15 @@
const selectRow = ref({});
const tableRef = ref();
const checkedKeys = ref([]);
/**
* 定义模态
*/
const [modalRegister, { openModal, setSubLoading }] = useModal({
title: '选择文章',
width: 1000,
});
/**
* 定义查询参数
*/
@ -127,7 +133,7 @@
}
/**
* 注册
* 执行注册
*/
const [register, {}] = useForm({
gridProps: { cols: '1 s:1 m:2 l:3 xl:4 2xl:4' },
@ -173,6 +179,12 @@
},
};
};
/**
* 行点击事件
* @param record 数据记录
* @param row 数据行
*/
const rowClick = (record, row) => {
console.log(record);
checkedKeys.value = record;
@ -184,7 +196,9 @@
*/
onMounted(() => {});
//
/**
* 定义函数
*/
defineExpose({
openModal,
});