4 changed files with 199 additions and 579 deletions
@ -0,0 +1,199 @@ |
|||||
|
<!-- 编辑弹窗 --> |
||||
|
<template> |
||||
|
<ele-modal |
||||
|
:width="600" |
||||
|
:visible="visible" |
||||
|
:maskClosable="false" |
||||
|
:maxable="maxable" |
||||
|
:title="'批量更新'" |
||||
|
:body-style="{ paddingBottom: '28px' }" |
||||
|
@update:visible="updateVisible" |
||||
|
@ok="save" |
||||
|
> |
||||
|
<a-form |
||||
|
ref="formRef" |
||||
|
:model="form" |
||||
|
:rules="rules" |
||||
|
:label-col="styleResponsive ? { md: 3, sm: 5, xs: 24 } : { flex: '90px' }" |
||||
|
:wrapper-col=" |
||||
|
styleResponsive ? { md: 24, sm: 24, xs: 24 } : { flex: '1' } |
||||
|
" |
||||
|
> |
||||
|
<a-form-item> |
||||
|
<a-alert :message="'提示：每次最多修改 50000 条数据'" banner /> |
||||
|
</a-form-item> |
||||
|
<a-form-item label="选择栏目"> |
||||
|
<a-tree-select |
||||
|
allow-clear |
||||
|
:tree-data="navigationList" |
||||
|
tree-default-expand-all |
||||
|
style="width: 400px" |
||||
|
placeholder="请选择栏目" |
||||
|
:value="form.categoryId || undefined" |
||||
|
:dropdown-style="{ maxHeight: '360px', overflow: 'auto' }" |
||||
|
@update:value="(value?: number) => (form.categoryId = value)" |
||||
|
@change="onCategoryId" |
||||
|
/> |
||||
|
</a-form-item> |
||||
|
</a-form> |
||||
|
</ele-modal> |
||||
|
</template> |
||||
|
|
||||
|
<script lang="ts" setup> |
||||
|
import { ref, reactive, watch } from 'vue'; |
||||
|
import { Form, message } from 'ant-design-vue'; |
||||
|
import { useThemeStore } from '@/store/modules/theme'; |
||||
|
import { storeToRefs } from 'pinia'; |
||||
|
import { FormInstance, RuleObject } from 'ant-design-vue/es/form'; |
||||
|
import { CmsNavigation } from "@/api/cms/cmsNavigation/model"; |
||||
|
import {updateBatchCmsLink} from "@/api/cms/cmsLink"; |
||||
|
import {CmsLink} from "@/api/cms/cmsLink/model"; |
||||
|
|
||||
|
// 是否是修改 |
||||
|
const useForm = Form.useForm; |
||||
|
// 是否开启响应式布局 |
||||
|
const themeStore = useThemeStore(); |
||||
|
const { styleResponsive } = storeToRefs(themeStore); |
||||
|
|
||||
|
const props = defineProps<{ |
||||
|
// 弹窗是否打开 |
||||
|
visible: boolean; |
||||
|
// 表格选中数据 |
||||
|
selection?: CmsLink[]; |
||||
|
// 栏目数据 |
||||
|
navigationList?: CmsNavigation[]; |
||||
|
}>(); |
||||
|
|
||||
|
const emit = defineEmits<{ |
||||
|
(e: 'done'): void; |
||||
|
(e: 'update:visible', visible: boolean): void; |
||||
|
}>(); |
||||
|
|
||||
|
// 提交状态 |
||||
|
const loading = ref(false); |
||||
|
// 是否显示最大化切换按钮 |
||||
|
const maxable = ref(true); |
||||
|
// 表格选中数据 |
||||
|
const formRef = ref<FormInstance | null>(null); |
||||
|
const content = ref(''); |
||||
|
|
||||
|
// 用户信息 |
||||
|
const form = reactive<CmsLink>({ |
||||
|
// 自增ID |
||||
|
id: undefined, |
||||
|
// 链接名称 |
||||
|
name: undefined, |
||||
|
// 图标 |
||||
|
icon: undefined, |
||||
|
// 链接地址 |
||||
|
url: undefined, |
||||
|
// 链接分类 |
||||
|
categoryId: undefined, |
||||
|
// 应用ID |
||||
|
appId: undefined, |
||||
|
// 用户ID |
||||
|
userId: undefined, |
||||
|
// 语言 |
||||
|
lang: undefined, |
||||
|
// 是否推荐 |
||||
|
recommend: undefined, |
||||
|
// 备注 |
||||
|
comments: undefined, |
||||
|
// 排序(数字越小越靠前) |
||||
|
sortNumber: undefined, |
||||
|
// 是否删除, 0否, 1是 |
||||
|
deleted: undefined, |
||||
|
// 状态, 0正常, 1待确认 |
||||
|
status: undefined, |
||||
|
// 租户id |
||||
|
tenantId: undefined, |
||||
|
// 创建时间 |
||||
|
createTime: undefined, |
||||
|
}); |
||||
|
|
||||
|
/* 更新visible */ |
||||
|
const updateVisible = (value: boolean) => { |
||||
|
emit('update:visible', value); |
||||
|
}; |
||||
|
|
||||
|
// 表单验证规则 |
||||
|
const rules = reactive({ |
||||
|
title: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: '请选择文章标题', |
||||
|
type: 'string', |
||||
|
trigger: 'blur' |
||||
|
} |
||||
|
], |
||||
|
categoryId: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
message: '请选择栏目', |
||||
|
type: 'number', |
||||
|
trigger: 'blur' |
||||
|
} |
||||
|
], |
||||
|
content: [ |
||||
|
{ |
||||
|
required: true, |
||||
|
type: "string", |
||||
|
message: "请输入文章内容", |
||||
|
trigger: "blur", |
||||
|
validator: async (_rule: RuleObject, value: string) => { |
||||
|
if (content.value == "") { |
||||
|
return Promise.reject("请输入文字内容"); |
||||
|
} |
||||
|
return Promise.resolve(); |
||||
|
} |
||||
|
} |
||||
|
], |
||||
|
}); |
||||
|
|
||||
|
// 选择栏目 |
||||
|
const onCategoryId = (id: number) => { |
||||
|
console.log(id); |
||||
|
form.categoryId = id; |
||||
|
}; |
||||
|
|
||||
|
const { resetFields } = useForm(form, rules); |
||||
|
|
||||
|
/* 保存编辑 */ |
||||
|
const save = () => { |
||||
|
if (!formRef.value) { |
||||
|
return; |
||||
|
} |
||||
|
formRef.value |
||||
|
.validate() |
||||
|
.then(() => { |
||||
|
loading.value = true; |
||||
|
props.selection?.map(d => d.id) |
||||
|
updateBatchCmsLink({ |
||||
|
ids: props.selection?.map(d => d.id), |
||||
|
data: { |
||||
|
categoryId: form.categoryId |
||||
|
} |
||||
|
}).then((msg) => { |
||||
|
message.success(msg); |
||||
|
loading.value = false; |
||||
|
updateVisible(false); |
||||
|
emit('done'); |
||||
|
}) |
||||
|
.catch((e) => { |
||||
|
message.error(e.message); |
||||
|
}); |
||||
|
}) |
||||
|
.catch(() => {}); |
||||
|
}; |
||||
|
|
||||
|
watch( |
||||
|
() => props.visible, |
||||
|
(visible) => { |
||||
|
if (visible) { |
||||
|
} else { |
||||
|
resetFields(); |
||||
|
} |
||||
|
}, |
||||
|
{ immediate: true } |
||||
|
); |
||||
|
</script> |
||||
@ -1,283 +0,0 @@ |
|||||
<!-- 编辑弹窗 --> |
|
||||
<template> |
|
||||
<ele-modal |
|
||||
:width="800" |
|
||||
:visible="visible" |
|
||||
:maskClosable="false" |
|
||||
:maxable="maxable" |
|
||||
:title="isUpdate ? '编辑小程序信息' : '添加小程序信息'" |
|
||||
:body-style="{ paddingBottom: '28px' }" |
|
||||
@update:visible="updateVisible" |
|
||||
@ok="save" |
|
||||
> |
|
||||
<a-form |
|
||||
ref="formRef" |
|
||||
:model="form" |
|
||||
:rules="rules" |
|
||||
:label-col="styleResponsive ? { md: 4, sm: 5, xs: 24 } : { flex: '90px' }" |
|
||||
:wrapper-col=" |
|
||||
styleResponsive ? { md: 19, sm: 19, xs: 24 } : { flex: '1' } |
|
||||
" |
|
||||
> |
|
||||
<a-form-item label="头像" name="avatar"> |
|
||||
<SelectFile |
|
||||
:placeholder="`请选择图片`" |
|
||||
:limit="1" |
|
||||
:data="images" |
|
||||
@done="chooseImage" |
|
||||
@del="onDeleteItem" |
|
||||
/> |
|
||||
</a-form-item> |
|
||||
<a-form-item label="小程序码" name="mpQrcode"> |
|
||||
<SelectFile |
|
||||
:placeholder="`请选择图片`" |
|
||||
:limit="1" |
|
||||
:data="mpQrcode" |
|
||||
@done="chooseMpQrcode" |
|
||||
@del="onDeleteMpQrcode" |
|
||||
/> |
|
||||
</a-form-item> |
|
||||
<a-form-item label="小程序名称" name="mpName"> |
|
||||
<a-input |
|
||||
allow-clear |
|
||||
placeholder="请输入小程序名称" |
|
||||
v-model:value="form.mpName" |
|
||||
/> |
|
||||
</a-form-item> |
|
||||
<a-form-item label="小程序ID" name="appId"> |
|
||||
<a-input |
|
||||
allow-clear |
|
||||
placeholder="请输入小程序ID" |
|
||||
v-model:value="form.appId" |
|
||||
/> |
|
||||
</a-form-item> |
|
||||
<a-form-item label="小程序密钥" name="appSecret"> |
|
||||
<a-input |
|
||||
allow-clear |
|
||||
placeholder="请输入小程序密钥" |
|
||||
v-model:value="form.appSecret" |
|
||||
/> |
|
||||
</a-form-item> |
|
||||
<a-form-item label="主体信息" name="companyName"> |
|
||||
<a-input |
|
||||
allow-clear |
|
||||
placeholder="请输入主体信息" |
|
||||
v-model:value="form.companyName" |
|
||||
/> |
|
||||
</a-form-item> |
|
||||
<a-form-item label="小程序备案" name="icpNo"> |
|
||||
<a-input |
|
||||
allow-clear |
|
||||
placeholder="请输入小程序备案" |
|
||||
v-model:value="form.icpNo" |
|
||||
/> |
|
||||
</a-form-item> |
|
||||
<a-form-item label="登录邮箱" name="email"> |
|
||||
<a-input |
|
||||
allow-clear |
|
||||
placeholder="请输入登录邮箱" |
|
||||
v-model:value="form.email" |
|
||||
/> |
|
||||
</a-form-item> |
|
||||
<a-form-item label="原始ID" name="ghId"> |
|
||||
<a-input |
|
||||
allow-clear |
|
||||
placeholder="请输入原始ID" |
|
||||
v-model:value="form.ghId" |
|
||||
/> |
|
||||
</a-form-item> |
|
||||
<a-form-item label="排序" name="sortNumber"> |
|
||||
<a-input-number |
|
||||
:min="0" |
|
||||
:max="9999" |
|
||||
class="ele-fluid" |
|
||||
placeholder="请输入排序号" |
|
||||
v-model:value="form.sortNumber" |
|
||||
/> |
|
||||
</a-form-item> |
|
||||
<a-form-item label="介绍" name="comments"> |
|
||||
<a-textarea |
|
||||
:rows="4" |
|
||||
:maxlength="200" |
|
||||
placeholder="请输入描述" |
|
||||
v-model:value="form.comments" |
|
||||
/> |
|
||||
</a-form-item> |
|
||||
<a-form-item label="微信认证" name="authentication"> |
|
||||
<a-radio-group v-model:value="form.authentication"> |
|
||||
<a-radio :value="0">已认证</a-radio> |
|
||||
<a-radio :value="1">未认证</a-radio> |
|
||||
</a-radio-group> |
|
||||
</a-form-item> |
|
||||
</a-form> |
|
||||
</ele-modal> |
|
||||
</template> |
|
||||
|
|
||||
<script lang="ts" setup> |
|
||||
import { ref, reactive, watch } from 'vue'; |
|
||||
import { Form, message } from 'ant-design-vue'; |
|
||||
import { assignObject, uuid } from 'ele-admin-pro'; |
|
||||
import { addCmsMp, updateCmsMp } from '@/api/cms/cmsMp'; |
|
||||
import { CmsMp } from '@/api/cms/cmsMp/model'; |
|
||||
import { useThemeStore } from '@/store/modules/theme'; |
|
||||
import { storeToRefs } from 'pinia'; |
|
||||
import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types'; |
|
||||
import { FormInstance } from 'ant-design-vue/es/form'; |
|
||||
import { FileRecord } from '@/api/system/file/model'; |
|
||||
|
|
||||
// 是否是修改 |
|
||||
const isUpdate = ref(false); |
|
||||
const useForm = Form.useForm; |
|
||||
// 是否开启响应式布局 |
|
||||
const themeStore = useThemeStore(); |
|
||||
const { styleResponsive } = storeToRefs(themeStore); |
|
||||
|
|
||||
const props = defineProps<{ |
|
||||
// 弹窗是否打开 |
|
||||
visible: boolean; |
|
||||
// 修改回显的数据 |
|
||||
data?: CmsMp | null; |
|
||||
}>(); |
|
||||
|
|
||||
const emit = defineEmits<{ |
|
||||
(e: 'done'): void; |
|
||||
(e: 'update:visible', visible: boolean): void; |
|
||||
}>(); |
|
||||
|
|
||||
// 提交状态 |
|
||||
const loading = ref(false); |
|
||||
// 是否显示最大化切换按钮 |
|
||||
const maxable = ref(true); |
|
||||
// 表格选中数据 |
|
||||
const formRef = ref<FormInstance | null>(null); |
|
||||
const images = ref<ItemType[]>([]); |
|
||||
// 表格选中数据 |
|
||||
const mpQrcode = ref<ItemType[]>([]); |
|
||||
|
|
||||
// 用户信息 |
|
||||
const form = reactive<CmsMp>({ |
|
||||
mpId: undefined, |
|
||||
type: undefined, |
|
||||
appId: undefined, |
|
||||
appSecret: undefined, |
|
||||
mpName: undefined, |
|
||||
shortName: undefined, |
|
||||
avatar: undefined, |
|
||||
mpQrcode: undefined, |
|
||||
authentication: undefined, |
|
||||
companyName: undefined, |
|
||||
icpNo: undefined, |
|
||||
email: undefined, |
|
||||
password: undefined, |
|
||||
ghId: undefined, |
|
||||
mainPath: undefined, |
|
||||
expirationTime: undefined, |
|
||||
comments: undefined, |
|
||||
userId: undefined, |
|
||||
status: undefined, |
|
||||
deleted: undefined, |
|
||||
tenantId: undefined, |
|
||||
createTime: undefined, |
|
||||
sortNumber: 100 |
|
||||
}); |
|
||||
|
|
||||
/* 更新visible */ |
|
||||
const updateVisible = (value: boolean) => { |
|
||||
emit('update:visible', value); |
|
||||
}; |
|
||||
|
|
||||
// 表单验证规则 |
|
||||
const rules = reactive({ |
|
||||
cmsMpName: [ |
|
||||
{ |
|
||||
required: true, |
|
||||
type: 'string', |
|
||||
message: '请填写小程序信息名称', |
|
||||
trigger: 'blur' |
|
||||
} |
|
||||
] |
|
||||
}); |
|
||||
|
|
||||
const chooseImage = (data: FileRecord) => { |
|
||||
images.value.push({ |
|
||||
uid: data.id, |
|
||||
url: data.path, |
|
||||
status: 'done' |
|
||||
}); |
|
||||
form.avatar = data.path; |
|
||||
}; |
|
||||
|
|
||||
const onDeleteItem = (index: number) => { |
|
||||
images.value.splice(index, 1); |
|
||||
form.avatar = ''; |
|
||||
}; |
|
||||
|
|
||||
const chooseMpQrcode = (data: FileRecord) => { |
|
||||
mpQrcode.value.push({ |
|
||||
uid: data.id, |
|
||||
url: data.path, |
|
||||
status: 'done' |
|
||||
}); |
|
||||
form.mpQrcode = data.downloadUrl; |
|
||||
}; |
|
||||
|
|
||||
const onDeleteMpQrcode = (index: number) => { |
|
||||
mpQrcode.value.splice(index, 1); |
|
||||
form.mpQrcode = ''; |
|
||||
}; |
|
||||
|
|
||||
const { resetFields } = useForm(form, rules); |
|
||||
|
|
||||
/* 保存编辑 */ |
|
||||
const save = () => { |
|
||||
if (!formRef.value) { |
|
||||
return; |
|
||||
} |
|
||||
formRef.value |
|
||||
.validate() |
|
||||
.then(() => { |
|
||||
loading.value = true; |
|
||||
const formData = { |
|
||||
...form |
|
||||
}; |
|
||||
const saveOrUpdate = isUpdate.value ? updateCmsMp : addCmsMp; |
|
||||
saveOrUpdate(formData) |
|
||||
.then((msg) => { |
|
||||
loading.value = false; |
|
||||
message.success(msg); |
|
||||
updateVisible(false); |
|
||||
emit('done'); |
|
||||
}) |
|
||||
.catch((e) => { |
|
||||
loading.value = false; |
|
||||
message.error(e.message); |
|
||||
}); |
|
||||
}) |
|
||||
.catch(() => {}); |
|
||||
}; |
|
||||
|
|
||||
watch( |
|
||||
() => props.visible, |
|
||||
(visible) => { |
|
||||
if (visible) { |
|
||||
images.value = []; |
|
||||
if (props.data) { |
|
||||
assignObject(form, props.data); |
|
||||
if(props.data.avatar){ |
|
||||
images.value.push({ |
|
||||
uid: uuid(), |
|
||||
url: props.data.avatar, |
|
||||
status: 'done' |
|
||||
}) |
|
||||
} |
|
||||
isUpdate.value = true; |
|
||||
} else { |
|
||||
isUpdate.value = false; |
|
||||
} |
|
||||
} else { |
|
||||
resetFields(); |
|
||||
} |
|
||||
}, |
|
||||
{ immediate: true } |
|
||||
); |
|
||||
</script> |
|
||||
@ -1,42 +0,0 @@ |
|||||
<!-- 搜索表单 --> |
|
||||
<template> |
|
||||
<a-space :size="10" style="flex-wrap: wrap"> |
|
||||
<a-button type="primary" class="ele-btn-icon" @click="add"> |
|
||||
<template #icon> |
|
||||
<PlusOutlined /> |
|
||||
</template> |
|
||||
<span>添加</span> |
|
||||
</a-button> |
|
||||
</a-space> |
|
||||
</template> |
|
||||
|
|
||||
<script lang="ts" setup> |
|
||||
import { PlusOutlined } from '@ant-design/icons-vue'; |
|
||||
import type { GradeParam } from '@/api/user/grade/model'; |
|
||||
import { watch } from 'vue'; |
|
||||
|
|
||||
const props = withDefaults( |
|
||||
defineProps<{ |
|
||||
// 选中的角色 |
|
||||
selection?: []; |
|
||||
}>(), |
|
||||
{} |
|
||||
); |
|
||||
|
|
||||
const emit = defineEmits<{ |
|
||||
(e: 'search', where?: GradeParam): void; |
|
||||
(e: 'add'): void; |
|
||||
(e: 'remove'): void; |
|
||||
(e: 'batchMove'): void; |
|
||||
}>(); |
|
||||
|
|
||||
// 新增 |
|
||||
const add = () => { |
|
||||
emit('add'); |
|
||||
}; |
|
||||
|
|
||||
watch( |
|
||||
() => props.selection, |
|
||||
() => {} |
|
||||
); |
|
||||
</script> |
|
||||
@ -1,254 +0,0 @@ |
|||||
<template> |
|
||||
<div class="page"> |
|
||||
<div class="ele-body"> |
|
||||
<a-card :bordered="false" :body-style="{ padding: '16px' }"> |
|
||||
<ele-pro-table |
|
||||
ref="tableRef" |
|
||||
row-key="cmsMpId" |
|
||||
:columns="columns" |
|
||||
:datasource="datasource" |
|
||||
:customRow="customRow" |
|
||||
tool-class="ele-toolbar-form" |
|
||||
class="sys-org-table" |
|
||||
> |
|
||||
<template #toolbar> |
|
||||
<search |
|
||||
@search="reload" |
|
||||
:selection="selection" |
|
||||
@add="openEdit" |
|
||||
@remove="removeBatch" |
|
||||
@batchMove="openMove" |
|
||||
/> |
|
||||
</template> |
|
||||
<template #bodyCell="{ column, record }"> |
|
||||
<template v-if="column.key === 'avatar'"> |
|
||||
<a-image :src="record.avatar" :width="50" /> |
|
||||
</template> |
|
||||
<template v-if="column.key === 'mpQrcode'"> |
|
||||
<a-image :src="record.mpQrcode" :width="50" /> |
|
||||
</template> |
|
||||
<template v-if="column.key === 'status'"> |
|
||||
<a-tag v-if="record.status === 0" color="green">显示</a-tag> |
|
||||
<a-tag v-if="record.status === 1" color="red">隐藏</a-tag> |
|
||||
</template> |
|
||||
<template v-if="column.key === 'action'"> |
|
||||
<a-space> |
|
||||
<a @click="openEdit(record)">修改</a> |
|
||||
<a-divider type="vertical" /> |
|
||||
<a-popconfirm |
|
||||
title="确定要删除此记录吗？" |
|
||||
@confirm="remove(record)" |
|
||||
> |
|
||||
<a class="ele-text-danger">删除</a> |
|
||||
</a-popconfirm> |
|
||||
</a-space> |
|
||||
</template> |
|
||||
</template> |
|
||||
</ele-pro-table> |
|
||||
</a-card> |
|
||||
|
|
||||
<!-- 编辑弹窗 --> |
|
||||
<CmsMpEdit v-model:visible="showEdit" :data="current" @done="reload" /> |
|
||||
</div> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script lang="ts" setup> |
|
||||
import { createVNode, ref } from 'vue'; |
|
||||
import { message, Modal } from 'ant-design-vue'; |
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue'; |
|
||||
import type { EleProTable } from 'ele-admin-pro'; |
|
||||
import { toDateString } from 'ele-admin-pro'; |
|
||||
import type { |
|
||||
DatasourceFunction, |
|
||||
ColumnItem |
|
||||
} from 'ele-admin-pro/es/ele-pro-table/types'; |
|
||||
import Search from './components/search.vue'; |
|
||||
import CmsMpEdit from './components/cmsMpEdit.vue'; |
|
||||
import { pageCmsMp, removeCmsMp, removeBatchCmsMp } from '@/api/cms/cmsMp'; |
|
||||
import type { CmsMp, CmsMpParam } from '@/api/cms/cmsMp/model'; |
|
||||
|
|
||||
// 表格实例 |
|
||||
const tableRef = ref<InstanceType<typeof EleProTable> | null>(null); |
|
||||
|
|
||||
// 表格选中数据 |
|
||||
const selection = ref<CmsMp[]>([]); |
|
||||
// 当前编辑数据 |
|
||||
const current = ref<CmsMp | null>(null); |
|
||||
// 是否显示编辑弹窗 |
|
||||
const showEdit = ref(false); |
|
||||
// 是否显示批量移动弹窗 |
|
||||
const showMove = ref(false); |
|
||||
// 加载状态 |
|
||||
const loading = ref(true); |
|
||||
|
|
||||
// 表格数据源 |
|
||||
const datasource: DatasourceFunction = ({ |
|
||||
page, |
|
||||
limit, |
|
||||
where, |
|
||||
orders, |
|
||||
filters |
|
||||
}) => { |
|
||||
if (filters) { |
|
||||
where.status = filters.status; |
|
||||
} |
|
||||
return pageCmsMp({ |
|
||||
...where, |
|
||||
...orders, |
|
||||
page, |
|
||||
limit |
|
||||
}); |
|
||||
}; |
|
||||
|
|
||||
// 表格列配置 |
|
||||
const columns = ref<ColumnItem[]>([ |
|
||||
{ |
|
||||
title: '小程序名称', |
|
||||
dataIndex: 'mpName', |
|
||||
key: 'mpName', |
|
||||
align: 'center' |
|
||||
}, |
|
||||
{ |
|
||||
title: '头像', |
|
||||
dataIndex: 'avatar', |
|
||||
key: 'avatar', |
|
||||
align: 'center' |
|
||||
}, |
|
||||
{ |
|
||||
title: '小程序码', |
|
||||
dataIndex: 'mpQrcode', |
|
||||
key: 'mpQrcode', |
|
||||
align: 'center' |
|
||||
}, |
|
||||
{ |
|
||||
title: '主体信息', |
|
||||
dataIndex: 'companyName', |
|
||||
key: 'companyName', |
|
||||
align: 'center' |
|
||||
}, |
|
||||
{ |
|
||||
title: '介绍', |
|
||||
dataIndex: 'comments', |
|
||||
key: 'comments', |
|
||||
align: 'center' |
|
||||
}, |
|
||||
{ |
|
||||
title: '主账号', |
|
||||
dataIndex: 'type', |
|
||||
key: 'type', |
|
||||
align: 'center' |
|
||||
}, |
|
||||
{ |
|
||||
title: '状态', |
|
||||
dataIndex: 'status', |
|
||||
key: 'status', |
|
||||
align: 'center', |
|
||||
hideInTable: true |
|
||||
}, |
|
||||
{ |
|
||||
title: '创建时间', |
|
||||
dataIndex: 'createTime', |
|
||||
key: 'createTime', |
|
||||
align: 'center', |
|
||||
sorter: true, |
|
||||
ellipsis: true, |
|
||||
customRender: ({ text }) => toDateString(text, 'yyyy-MM-dd') |
|
||||
}, |
|
||||
{ |
|
||||
title: '操作', |
|
||||
key: 'action', |
|
||||
width: 120, |
|
||||
fixed: 'right', |
|
||||
align: 'center', |
|
||||
hideInSetting: true |
|
||||
} |
|
||||
]); |
|
||||
|
|
||||
/* 搜索 */ |
|
||||
const reload = (where?: CmsMpParam) => { |
|
||||
selection.value = []; |
|
||||
tableRef?.value?.reload({ where: where }); |
|
||||
}; |
|
||||
|
|
||||
/* 打开编辑弹窗 */ |
|
||||
const openEdit = (row?: CmsMp) => { |
|
||||
current.value = row ?? null; |
|
||||
showEdit.value = true; |
|
||||
}; |
|
||||
|
|
||||
/* 打开批量移动弹窗 */ |
|
||||
const openMove = () => { |
|
||||
showMove.value = true; |
|
||||
}; |
|
||||
|
|
||||
/* 删除单个 */ |
|
||||
const remove = (row: CmsMp) => { |
|
||||
const hide = message.loading('请求中..', 0); |
|
||||
removeCmsMp(row.cmsMpId) |
|
||||
.then((msg) => { |
|
||||
hide(); |
|
||||
message.success(msg); |
|
||||
reload(); |
|
||||
}) |
|
||||
.catch((e) => { |
|
||||
hide(); |
|
||||
message.error(e.message); |
|
||||
}); |
|
||||
}; |
|
||||
|
|
||||
/* 批量删除 */ |
|
||||
const removeBatch = () => { |
|
||||
if (!selection.value.length) { |
|
||||
message.error('请至少选择一条数据'); |
|
||||
return; |
|
||||
} |
|
||||
Modal.confirm({ |
|
||||
title: '提示', |
|
||||
content: '确定要删除选中的记录吗?', |
|
||||
icon: createVNode(ExclamationCircleOutlined), |
|
||||
maskClosable: true, |
|
||||
onOk: () => { |
|
||||
const hide = message.loading('请求中..', 0); |
|
||||
removeBatchCmsMp(selection.value.map((d) => d.cmsMpId)) |
|
||||
.then((msg) => { |
|
||||
hide(); |
|
||||
message.success(msg); |
|
||||
reload(); |
|
||||
}) |
|
||||
.catch((e) => { |
|
||||
hide(); |
|
||||
message.error(e.message); |
|
||||
}); |
|
||||
} |
|
||||
}); |
|
||||
}; |
|
||||
|
|
||||
/* 查询 */ |
|
||||
const query = () => { |
|
||||
loading.value = true; |
|
||||
}; |
|
||||
|
|
||||
/* 自定义行属性 */ |
|
||||
const customRow = (record: CmsMp) => { |
|
||||
return { |
|
||||
// 行点击事件 |
|
||||
onClick: () => { |
|
||||
// console.log(record); |
|
||||
}, |
|
||||
// 行双击事件 |
|
||||
onDblclick: () => { |
|
||||
openEdit(record); |
|
||||
} |
|
||||
}; |
|
||||
}; |
|
||||
query(); |
|
||||
</script> |
|
||||
|
|
||||
<script lang="ts"> |
|
||||
export default { |
|
||||
name: 'CmsMp' |
|
||||
}; |
|
||||
</script> |
|
||||
|
|
||||
<style lang="less" scoped></style> |
|
||||
Loading…
Reference in new issue