banner、协议

This commit is contained in:
cxc
2022-07-21 17:29:19 +08:00
parent 4db5098aed
commit d1db4aa979
17 changed files with 2627 additions and 49 deletions

80
src/api/config.js Normal file
View File

@ -0,0 +1,80 @@
import request from "@/utils/request";
// 项目配置
export function config(data) {
return request({
url: "/admin/v1/config",
method: "post",
data,
});
}
// 项目配置 添加
export function configAdd(data) {
return request({
url: "/admin/v1/config/add",
method: "post",
data,
});
}
// 项目配置 修改
export function configEdit(data) {
return request({
url: "/admin/v1/config/edit",
method: "post",
data,
});
}
// 租户列表 省市区选择
export function areaList(params) {
return request({
url: "/admin/v1/config/area",
method: "get",
params,
});
}
// 省列表
export function provinceList() {
return request({
url: "/region/allProvince",
method: "get",
});
}
// 市列表
export function cityList(provinceCode) {
return request({
url: "/region/allCity",
method: "get",
params: {
provinceCode,
},
});
}
// 县区列表
export function districtList(cityCode) {
return request({
url: "/region/allArea",
method: "get",
params: {
cityCode,
},
});
}
// 身份
export function identity(params) {
return request({
url: "/admin/v1/config/identity",
method: "get",
params,
});
}
// 领域
export function industry(params) {
return request({
url: "/admin/v1/config/industry",
method: "get",
params,
});
}

View File

@ -0,0 +1,79 @@
import request from "@/utils/request";
// 活动列表
export function activityList(params) {
return request({
url: "/business/casActivity/list",
method: "get",
params,
});
}
// 活动-添加
export function activityAdd(data) {
return request({
url: "/business/casActivity",
method: "post",
data,
});
}
// 活动-详情
export function activityDetail(id) {
return request({
url: `/business/casActivity/${id}`,
method: "get",
});
}
// 活动-修改
export function activityEdit(data) {
return request({
url: "/business/casActivity",
method: "put",
data,
});
}
// 活动-删除
export function activityDelete(ids) {
return request({
url: `/business/casActivity/${ids}`,
method: "delete",
});
}
// 报名列表
export function signUpList(data) {
return request({
url: "/business/casActivityApply/list",
method: "post",
data,
});
}
// 活动申请列表
export function applyList(params) {
return request({
url: "/business/casActivityApply/list",
method: "get",
params,
});
}
// 活动申请详情
export function applyDetail(id) {
return request({
url: `/business/casActivityApply/${id}`,
method: "get",
});
}
// 活动申请-处理
export function applyHandle(data) {
return request({
url: "/business/casActivityApply",
method: "put",
data,
});
}
// 活动申请-删除
export function applyDelete(ids) {
return request({
url: `/business/casActivityApply/${ids}`,
method: "delete",
});
}

114
src/api/website/siteSet.js Normal file
View File

@ -0,0 +1,114 @@
import request from "@/utils/request";
// 轮播图位置列表
export function bannerLocal(data) {
return request({
url: "/admin/v1/sys/banner/local",
method: "post",
data,
});
}
// 轮播图列表
export function bannerList(params) {
return request({
url: "/business/casBanner/list",
method: "get",
params,
});
}
// 轮播图添加
export function bannerAdd(data) {
return request({
url: "/business/casBanner",
method: "post",
data,
});
}
// 轮播图修改
export function bannerEdit(data) {
return request({
url: "/business/casBanner",
method: "put",
data,
});
}
// 轮播图删除
export function bannerDelete(ids) {
return request({
url: `/business/casBanner/${ids}`,
method: "post",
});
}
// 协议列表
export function agreementList(params) {
return request({
url: "/business/casAgreement/list",
method: "get",
params,
});
}
// 协议添加
export function agreementAdd(data) {
return request({
url: "/business/casAgreement",
method: "post",
data,
});
}
// 协议详情
export function agreementDetail(id) {
return request({
url: `/business/casAgreement/${id}`,
method: "get",
});
}
// 协议修改
export function agreementEdit(data) {
return request({
url: "/business/casAgreement",
method: "put",
data,
});
}
// 协议删除
export function agreementDelete(ids) {
return request({
url: `/business/casAgreement/${ids}`,
method: "delete",
});
}
// 尾部导航栏信息
export function navigationList(data) {
return request({
url: "/admin/v1/sys/navigation",
method: "post",
data,
});
}
// 尾部导航栏添加
export function navigationAdd(data) {
return request({
url: "/admin/v1/sys/navigation/add",
method: "post",
data,
});
}
// 尾部导航栏修改
export function navigationEdit(data) {
return request({
url: "/admin/v1/sys/navigation/edit",
method: "post",
data,
});
}
// 尾部导航栏删除
export function navigationDelete(data) {
return request({
url: "/admin/v1/sys/navigation/delete",
method: "post",
data,
});
}

View File

@ -4,7 +4,7 @@
fit="cover" fit="cover"
:style="`width:${realWidth};height:${realHeight};`" :style="`width:${realWidth};height:${realHeight};`"
:preview-src-list="realSrcList" :preview-src-list="realSrcList"
append-to-body="true" :preview-teleported="true"
> >
<template #error> <template #error>
<div class="image-slot"> <div class="image-slot">
@ -20,16 +20,16 @@ import { isExternal } from "@/utils/validate";
const props = defineProps({ const props = defineProps({
src: { src: {
type: String, type: String,
required: true required: true,
}, },
width: { width: {
type: [Number, String], type: [Number, String],
default: "" default: "",
}, },
height: { height: {
type: [Number, String], type: [Number, String],
default: "" default: "",
} },
}); });
const realSrc = computed(() => { const realSrc = computed(() => {
@ -43,7 +43,7 @@ const realSrc = computed(() => {
const realSrcList = computed(() => { const realSrcList = computed(() => {
let real_src_list = props.src.split(","); let real_src_list = props.src.split(",");
let srcList = []; let srcList = [];
real_src_list.forEach(item => { real_src_list.forEach((item) => {
if (isExternal(item)) { if (isExternal(item)) {
return srcList.push(item); return srcList.push(item);
} }

View File

@ -19,7 +19,14 @@
<script> <script>
import "@wangeditor/editor/dist/css/style.css"; // 引入 css import "@wangeditor/editor/dist/css/style.css"; // 引入 css
import { onBeforeUnmount, ref, shallowRef, toRefs, watch } from "vue"; import {
onBeforeUnmount,
onMounted,
ref,
shallowRef,
toRefs,
watch,
} from "vue";
import { Editor, Toolbar } from "@wangeditor/editor-for-vue"; import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
export default { export default {
@ -49,11 +56,15 @@ export default {
type: String, type: String,
default: "default", default: "default",
}, },
readonly: {
type: Boolean,
default: false,
},
}, },
setup(props, context) { setup(props, context) {
// 编辑器实例,必须用 shallowRef // 编辑器实例,必须用 shallowRef
const editorRef = shallowRef(); const editorRef = shallowRef();
// console.log(editorRef.value.getAllMenuKeys());
// 内容 HTML // 内容 HTML
const valueHtml = ref(""); const valueHtml = ref("");
watch( watch(
@ -84,11 +95,15 @@ export default {
placeholder: "请输入内容...", placeholder: "请输入内容...",
autoFocus: props.focus, autoFocus: props.focus,
maxLength: 140, maxLength: 140,
readOnly: props.readonly,
}; };
onMounted(() => {
// console.log(editorRef.value.getConfig());
});
// 组件销毁时,也及时销毁编辑器 // 组件销毁时,也及时销毁编辑器
onBeforeUnmount(() => { onBeforeUnmount(() => {
const editor = editorRef.value; const editor = editorRef.value;
if (editor == null) return; if (editor == null) return;
editor.destroy(); editor.destroy();
}); });

View File

@ -126,14 +126,6 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="上级导航" prop="parentId"> <el-form-item label="上级导航" prop="parentId">
<!-- <treeselect
v-model="form.parentId"
:options="menuOptions"
:normalizer="normalizer"
:show-count="true"
placeholder="选择上级导航"
/> -->
<TreeSelect <TreeSelect
:objMap="{ :objMap="{
value: 'id', // ID字段名 value: 'id', // ID字段名
@ -150,7 +142,6 @@
</el-form-item> </el-form-item>
<el-form-item label="内容:" prop="content"> <el-form-item label="内容:" prop="content">
<WangEditor v-model="form.content" minHeight="150px" /> <WangEditor v-model="form.content" minHeight="150px" />
<!-- <Editor v-model="form.content" :minHeight="150" /> -->
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
@ -176,7 +167,6 @@ import WangEditor from "@/components/WangEditor/index.vue";
const queryFormRef = ref(null); const queryFormRef = ref(null);
const dataList = ref([]); const dataList = ref([]);
const loading = ref(true); const loading = ref(true);
const total = ref(0);
const showEditDialog = ref(false); const showEditDialog = ref(false);
const formRef = ref(null); const formRef = ref(null);
const siteList = ref([]); // 站点列表 const siteList = ref([]); // 站点列表

View File

@ -0,0 +1,793 @@
<template>
<div class="app-container">
<el-form
:model="queryParams"
ref="queryFormRef"
v-show="showSearch"
:inline="true"
>
<el-form-item label="活动名称" prop="title">
<el-input
v-model="queryParams.title"
placeholder="请输入活动名称"
clearable
size="default"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="所属站点" prop="tenantId">
<el-select
v-model="queryParams.tenantId"
placeholder="请选择,支持搜索"
size="default"
filterable
clearable
>
<el-option
v-for="item in siteList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="联系人" prop="contact">
<el-input
v-model="queryParams.contact"
placeholder="请输入联系人"
clearable
size="default"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="手机号码" prop="contactMobile">
<el-input
v-model="queryParams.contactMobile"
placeholder="请输入手机号码"
clearable
size="default"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="search"
size="default"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="refresh" size="default" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="plus"
size="default"
@click="handleAdd"
>新增</el-button
>
</el-col>
<right-toolbar
v-model:showSearch="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="dataList">
<el-table-column label="数据编号" prop="id" align="center" />
<el-table-column
label="活动名称"
prop="title"
align="center"
show-overflow-tooltip
/>
<el-table-column
label="开始时间"
prop="beginTime"
align="center"
width="100"
>
<template #default="{ row }">
<span>{{ row.beginTime }}</span>
</template>
</el-table-column>
<el-table-column
label="结束时间"
prop="finishTime"
align="center"
width="100"
>
<template #default="{ row }">
<span>{{ row.finishTime }}</span>
</template>
</el-table-column>
<el-table-column
label="截止时间"
prop="joinDeadline"
align="center"
width="100"
>
<template #default="{ row }">
<span>{{ row.joinDeadline }}</span>
</template>
</el-table-column>
<el-table-column label="活动分类" align="center" show-overflow-tooltip>
<template #default="{ row }"> {{ row.industry }}</template>
</el-table-column>
<el-table-column label="人数上限" prop="maxNumber" align="center" />
<el-table-column label="报名费用" prop="amount" align="center" />
<el-table-column label="已报名" prop="join_count" align="center">
<template #default="{ row }">
<router-link
:to="{
path: 'signUp',
query: { id: row.id },
}"
>
<el-link type="primary">{{ row.joinCount }}</el-link>
</router-link>
</template>
</el-table-column>
<el-table-column label="站点" align="center">
<template #default="{ row }">
{{ siteList.find((el) => el.id === row.tenantId)?.name || "无" }}
</template>
</el-table-column>
<el-table-column label="联系人" prop="contact" align="center" />
<el-table-column label="手机号码" prop="contactMobile" align="center" />
<el-table-column label="发布时间" align="center" width="100">
<template #default="{ row }">
<span>{{ row.createTime }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
width="120"
class-name="small-padding fixed-width"
>
<template #default="{ row }">
<el-button
size="small"
type="text"
icon="edit"
@click="handleUpdate(row)"
>编辑</el-button
>
<el-button
size="small"
type="text"
icon="delete"
@click="handleDelete(row)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改对话框 -->
<el-dialog :title="title" v-model="showEditDialog" width="35%">
<el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
<el-form-item label="所属站点" prop="tenantId">
<el-select
v-model="form.tenantId"
placeholder="请选择,支持搜索"
size="default"
filterable
clearable
>
<el-option
v-for="item in siteList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="活动名称:" prop="title">
<el-input v-model="form.title" placeholder="请输入活动名称" />
</el-form-item>
<el-form-item label="联系人:" prop="contact">
<el-input v-model="form.contact" placeholder="请输入联系人" />
</el-form-item>
<el-form-item label="手机号码:" prop="contactMobile">
<el-input
v-model="form.contactMobile"
placeholder="请输入手机号码"
maxlength="11"
/>
</el-form-item>
<el-form-item label="开始时间:" prop="beginTime">
<el-date-picker
value-format="yyyy-MM-dd HH:mm:ss"
v-model="form.beginTime"
type="datetime"
placeholder="选择开始时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="结束时间:" prop="finishTime">
<el-date-picker
value-format="yyyy-MM-dd HH:mm:ss"
v-model="form.finishTime"
type="datetime"
placeholder="选择结束时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="截止时间:" prop="joinDeadline">
<el-date-picker
value-format="yyyy-MM-dd HH:mm:ss"
v-model="form.joinDeadline"
type="datetime"
placeholder="选择截止时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="地点:" required>
<el-row type="flex" justify="space-between" :gutter="10">
<el-col :span="8">
<el-form-item prop="province">
<el-select
v-model="form.province"
clearable
placeholder="请选择"
:disabled="provinceSelectList.length === 0"
@change="provinceChange"
>
<el-option
v-for="item in provinceSelectList"
:key="item.provinceCode"
:label="item.provinceName"
:value="item.provinceCode"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item prop="city">
<el-select
v-model="form.city"
clearable
placeholder="请选择"
:disabled="citySelectList.length === 0"
@change="cityChange"
>
<el-option
v-for="item in citySelectList"
:key="item.cityCode"
:label="item.cityName"
:value="item.cityCode"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item prop="district">
<el-select
v-model="form.district"
clearable
placeholder="请选择"
:disabled="districtSelectList.length === 0"
>
<el-option
v-for="item in districtSelectList"
:key="item.areaCode"
:label="item.areaName"
:value="item.areaCode"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="详细地址:" prop="address">
<el-input v-model="form.address" placeholder="请输入详细地址" />
</el-form-item>
<!-- <el-form-item label="活动分类:" required>
<el-row type="flex" justify="space-between">
<el-col :span="8">
<el-form-item prop="industrys">
<el-select
v-model="form.industrys[0]"
clearable
placeholder="请选择"
@change="field1Change"
>
<el-option
v-for="item in field1SelectList"
:key="item.id"
:label="item.name"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8" style="margin: 0 10px">
<el-form-item>
<el-select
v-model="form.industrys[1]"
clearable
placeholder="请选择"
@change="field2Change"
>
<el-option
v-for="item in field2SelectList"
:key="item.id"
:label="item.name"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item>
<el-select
v-model="form.industrys[2]"
clearable
placeholder="请选择"
>
<el-option
v-for="item in field3SelectList"
:key="item.id"
:label="item.name"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form-item> -->
<el-form-item label="通知人群:" prop="notifyCrowd">
<el-select v-model="form.notifyCrowd" multiple placeholder="请选择">
<el-option
v-for="(key, value) in identityList"
:key="value"
:label="key"
:value="value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="报名人数上限:" prop="maxNumber">
<el-input
v-model.number="form.maxNumber"
placeholder="请输入报名人数"
/>
</el-form-item>
<el-form-item label="宣传图:" prop="image">
<ImageUpload v-model="form.image" :isShowTip="false" :limit="1" />
</el-form-item>
<el-form-item label="活动简介:" prop="description">
<el-input
v-model="form.description"
placeholder="请输入活动简介"
type="textarea"
:autosize="{ minRows: 2, maxRows: 4 }"
/>
</el-form-item>
<el-form-item label="活动介绍:" prop="content">
<WangEditor v-model="form.content" minHeight="150px" />
<!-- <Editor v-model="form.content" :minHeight="150" /> -->
</el-form-item>
<el-form-item label="报名费用:" prop="amount">
<el-input v-model.number="form.amount">
<template slot="append"></template>
</el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script setup name="Active">
import {
activityList,
activityAdd,
activityDetail,
activityEdit,
activityDelete,
} from "@/api/website/activity";
import { tenantSelect } from "@/api/subPlatform/tenant";
import {
areaList,
industry,
identity,
provinceList,
cityList,
districtList,
} from "@/api/config";
import { cloneDeep } from "lodash";
import { reactive, toRefs } from "vue";
// import { constants } from "buffer";
import { ElMessage, ElMessageBox } from "element-plus";
import WangEditor from "../../../../components/WangEditor/index.vue";
const dataList = ref([]);
const loading = ref(true);
const total = ref(0);
const showEditDialog = ref(false);
const siteList = ref([]);
const formRef = ref(null);
const queryFormRef = ref(null);
const showSearch = ref(true);
const title = ref("");
// 省市区
const provinceSelectList = ref([]);
const citySelectList = ref([]);
const districtSelectList = ref([]);
// 领域
const field1SelectList = ref([]);
const field2SelectList = ref([]);
const field3SelectList = ref([]);
// 人群类型
const identityList = ref([]);
// 表单参数
const data = reactive({
queryParams: {
title: undefined,
tenantId: undefined,
contact: undefined,
contactMobile: undefined,
pageNum: 1,
pageSize: 10,
},
form: {
industrys: [],
},
rules: {
title: [{ required: true, message: "活动名称不能为空", trigger: "blur" }],
contact: [{ required: true, message: "联系人不能为空", trigger: "blur" }],
contactMobile: [
{ required: true, message: "手机号码不能为空", trigger: "blur" },
{
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
message: "请输入正确的手机号码",
trigger: ["blur", "change"],
},
],
tenantId: [
{
required: true,
message: "所属站点不能为空",
trigger: ["blur", "change"],
},
],
beginTime: [
{ required: true, message: "开始时间不能为空", trigger: "change" },
],
finishTime: [
{ required: true, message: "结束时间不能为空", trigger: "change" },
],
joinDeadline: [
{ required: true, message: "截止时间不能为空", trigger: "change" },
],
province: [{ required: true, message: "请选择", trigger: "change" }],
city: [{ required: true, message: "请选择", trigger: "change" }],
district: [{ required: true, message: "请选择", trigger: "change" }],
address: [{ required: true, message: "详细地址不能为空", trigger: "blur" }],
industrys: [
{
type: "array",
required: true,
message: "请选择",
trigger: "change",
},
],
notifyCrowd: [
{
type: "array",
required: true,
message: "请选择",
trigger: "change",
},
],
maxNumber: [
{ required: true, message: "报名人数不能为空", trigger: "blur" },
],
image: [{ required: true, message: "请上传宣传图", trigger: "blur" }],
description: [
{ required: true, message: "活动简介不能为空", trigger: "blur" },
],
content: [{ required: true, message: "活动介绍不能为空", trigger: "blur" }],
amount: [{ required: true, message: "报名费用不能为空", trigger: "blur" }],
},
});
const { queryParams, form, rules } = toRefs(data);
const resetQuery = () => {
if (queryFormRef.value) {
queryFormRef.value.resetFields();
}
handleQuery();
};
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
const getList = async () => {
loading.value = true;
const resp = await activityList(queryParams.value);
dataList.value = resp.rows;
total.value = resp.total;
loading.value = false;
};
// 获取站点列表
const getSiteList = async () => {
const resp = await tenantSelect();
siteList.value = resp.rows;
};
// 取消按钮
const cancel = () => {
showEditDialog.value = false;
// this.memberOpen = false;
reset();
};
// 表单重置
const reset = () => {
form.value = {
id: undefined,
tenantId: undefined,
title: undefined,
industrys: [],
notifyCrowd: [],
maxNumber: 0,
isHome: 1,
};
if (formRef.value) {
formRef.value.resetFields();
}
};
const handleAdd = () => {
// getProvinceList();
reset();
showEditDialog.value = true;
title.value = "新增";
};
// 获取省列表
const getProvinceList = async () => {
const { data } = await provinceList();
provinceSelectList.value = data;
};
// 根据省id获取地级市列表
const getCityListByProvinceId = async (provinceId) => {
const { data } = await cityList(provinceId);
citySelectList.value = data;
};
// 根据市id获取县区列表
const getAreaListByCityId = async (cityId) => {
const { data } = await districtList(cityId);
districtSelectList.value = data;
};
// 当修改province时或清除province时
const provinceChange = () => {
// 清除市县代码列表
form.value.city = undefined;
form.value.district = undefined;
// 清除市县列表
citySelectList.value = [];
districtSelectList.value = [];
// 重新请求城市列表
form.value.province && getCityListByProvinceId(form.value.province);
};
const cityChange = () => {
// 清除县区代码列表
form.value.district = undefined;
districtSelectList.value = [];
form.value.city && getAreaListByCityId(form.value.city);
};
// const getProvinceByParent = (id) => {
// return new Promise((resolve, reject) => {
// areaList({ code: id })
// .then(({ code, msg, data }) => {
// if (code == 200) {
// resolve(data);
// } else {
// ElMessage.error(msg);
// reject({ msg, code });
// }
// })
// .catch((error) => {
// reject(error);
// });
// });
// };
// const provinceCodeChange = async (id) => {
// delete form.value.city;
// delete form.value.district;
// if (!id) {
// citySelectList.value = [];
// districtSelectList.value = [];
// return false;
// }
// citySelectList.value = await getProvinceByParent(id);
// };
// const cityCodeChange = async (id) => {
// delete form.value.district;
// if (!id) {
// districtSelectList.value = [];
// return false;
// }
// districtSelectList.value = await getProvinceByParent(id);
// };
const getFieldByParent = (id) => {
return new Promise((resolve, reject) => {
industry({ parent_id: id })
.then(({ code, msg, data }) => {
if (code == 200) {
resolve(data);
} else {
ElMessage.error(msg);
reject({ msg, code });
}
})
.catch((error) => {
reject(error);
});
});
};
const field1Change = async (id) => {
delete form.value.industrys[1];
delete form.value.industrys[2];
if (!id) {
field2SelectList.value = [];
field3SelectList.value = [];
return false;
}
field2SelectList.value = await getFieldByParent(id);
};
const field2Change = async (id) => {
delete form.value.industrys[2];
if (!id) {
field3SelectList.value = [];
return false;
}
field3SelectList.value = await getFieldByParent(id);
};
const handleUpdate = async (row) => {
reset();
const resp = await activityDetail(row.id);
// resp.data.beginTime = resp.data.beginTime;
// resp.data.finishTime = resp.data.finishTime;
// resp.data.joinDeadline = resp.data.joinDeadline;
const formData = resp.data;
// provinceCodeChange(resp.data.province);
// cityCodeChange(resp.data.city);
// let arr = [];
// for (const key in identityList.value) {
// if (Object.hasOwnProperty.call(identityList.value, key)) {
// if (((key - 0) & formData.notifyCrowd) > 0) {
// arr.push(key);
// }
// }
// }
// formData.industrys = formData.industrys[0].split("-");
// if (formData.industrys.length == 2) {
// field1Change(formData.industrys[0]);
// } else if (formData.industrys.length == 3) {
// field1Change(formData.industrys[0]);
// field2Change(formData.industrys[1]);
// }
// formData.notifyCrowd = arr;
form.value = formData;
showEditDialog.value = true;
title.value = "修改";
};
const submitForm = () => {
// let notifys = 0;
// form.value.notifyCrowd.map((item) => {
// notifys = notifys | (item - 0);
// });
// let formData = cloneDeep(form.value);
// formData.notifyCrowd = notifys;
// formData.industrys = [form.value.industrys.join("-")];
this.$refs["form"].validate((valid) => {
if (valid) {
if (formData.id != undefined) {
activityEdit(formData).then((response) => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
activityAdd(formData).then((response) => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
};
/** 删除按钮操作 */
const handleDelete = (row) => {
ElMessageBox.confirm(`是否确认删除名为${row.title}的数据项?`)
.then(async () => {
await activityDelete(row.id);
getList();
ElMessage.success("删除成功");
})
.catch(() => {});
};
getList();
getSiteList();
getProvinceList();
</script>
<!-- <script>
export default {
data() {
return {
is_super: this.$store.getters.is_super,
loading: true,
showSearch: true,
total: 0,
dataList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 省市区
provinceSelectList: [],
citySelectList: [],
districtSelectList: [],
// 领域
field1SelectList: [],
field2SelectList: [],
field3SelectList: [],
// 人群类型
identityList: [],
// 表单参数
};
},
methods: {
},
created() {
this.getList();
areaList().then((res) => {
this.provinceSelectList = res.data;
});
industry().then((res) => {
this.field1SelectList = res.data;
});
identity().then((res) => {
this.identityList = res.data;
});
},
};
</script> -->

View File

@ -0,0 +1,139 @@
<template>
<div class="app-container">
<el-form
:model="queryParams"
ref="queryForm"
v-show="showSearch"
:inline="true"
@submit.native.prevent
>
<el-form-item label="姓名/单位" prop="name">
<el-input
v-model="queryParams.name"
placeholder="请输入关键字"
clearable
size="small"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
<!-- <el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd()"
>新增</el-button
>
</el-col>
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row> -->
<el-table v-loading="loading" :data="dataList">
<el-table-column label="数据编号" prop="id" align="center" />
<el-table-column label="姓名单位名称" prop="name" align="center" />
<!-- <el-table-column label="分类" prop="name" align="center" /> -->
<!-- <el-table-column label="所属领域" prop="name" align="center" /> -->
<el-table-column label="联系电话" prop="mobile" align="center" />
<el-table-column label="报名时间" align="center" prop="created_at">
<template slot-scope="scope">
<span>{{ formatTime(scope.row.created_at) }}</span>
</template>
</el-table-column>
<!-- <el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
>删除</el-button
>
</template>
</el-table-column> -->
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.page_num"
:limit.sync="queryParams.page_size"
@pagination="getList"
/>
</div>
</template>
<script>
import { signUpList } from "@/api/website/activity";
export default {
data() {
return {
// 遮罩层
loading: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
dataList: [],
queryParams: {
activity_id: undefined,
name: undefined,
page_num: 1,
page_size: 10,
},
};
},
methods: {
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.page_num = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
getList() {
this.loading = true;
signUpList(this.queryParams).then((response) => {
this.dataList = response.data.data;
this.total = response.data.count;
this.loading = false;
});
},
},
created() {
let { id } = this.$route.query;
if (!id) {
this.$message.error("无ID");
this.$router.go(-1);
return;
}
this.queryParams.activity_id = id;
this.getList();
},
};
</script>

View File

@ -0,0 +1,376 @@
<template>
<div class="app-container">
<el-form
:model="queryParams"
ref="queryFormRef"
v-show="showSearch"
:inline="true"
>
<el-form-item label="活动名称" prop="title">
<el-input
v-model="queryParams.title"
placeholder="请输入活动名称"
clearable
size="default"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="所属站点" prop="tenantId">
<el-select
v-model="queryParams.tenantId"
placeholder="请选择,支持搜索"
size="default"
filterable
clearable
>
<el-option
v-for="item in siteList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="申请人" prop="contact">
<el-input
v-model="queryParams.contact"
placeholder="请输入申请人"
clearable
size="default"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="手机号码" prop="contactMobile">
<el-input
v-model="queryParams.contactMobile"
placeholder="请输入手机号码"
clearable
size="default"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="search"
size="default"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="refresh" size="default" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
<!-- <el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="plus"
size="default"
@click="handleAdd"
>新增</el-button
>
</el-col>
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row> -->
<el-table v-loading="loading" :data="dataList">
<el-table-column label="数据编号" prop="id" align="center" />
<el-table-column
label="活动标题"
prop="title"
align="center"
show-overflow-tooltip
/>
<el-table-column label="联系人" prop="contact" align="center" />
<el-table-column label="手机号" prop="contactMobile" align="center" />
<!-- <el-table-column label="用户分类" prop="notify_crowd" align="center">
<template #default="{ row }">
<div>{{ handleIdentity(row.identity) }}</div>
</template>
</el-table-column> -->
<el-table-column label="活动时间" align="center">
<template #default="{ row }">
<span>{{ row.beginTime }}</span>
</template>
</el-table-column>
<el-table-column label="站点" align="center">
<template #default="{ row }">
{{
siteList.find((el) => el.id === row.tenantId)?.name || "无"
}}</template
>
</el-table-column>
<el-table-column label="备注" prop="handleRemark" align="center" />
<el-table-column label="备注处理人" prop="handleRemark" align="center" />
<el-table-column label="申请时间" align="center" width="100">
<template #default="{ row }">
<span>{{ row.createTime }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template #default="{ row }">
<el-button
size="small"
type="text"
icon="view"
@click="handleSee(row)"
>查看</el-button
>
<el-button
size="small"
type="text"
icon="edit"
@click="handleUpdate(row)"
v-if="row.status == 0"
>处理</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改对话框 -->
<el-dialog title="查看" v-model="showEditDialog" width="35%">
<el-form ref="formRef" :model="form" disabled label-width="120px">
<el-form-item label="活动名称:" prop="title">
<el-input v-model="form.title" placeholder="请输入活动名称" />
</el-form-item>
<el-form-item label="联系人:" prop="contact">
<el-input v-model="form.contact" placeholder="请输入联系人" />
</el-form-item>
<el-form-item label="手机号码:" prop="contactMobile">
<el-input
v-model="form.contactMobile"
placeholder="请输入手机号码"
maxlength="11"
/>
</el-form-item>
<el-form-item label="开始时间:" prop="begin_at">
<el-date-picker
value-format="yyyy-MM-dd HH:mm:ss"
v-model="form.begin_at"
type="datetime"
placeholder="选择开始时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="结束时间:" prop="finish_at">
<el-date-picker
value-format="yyyy-MM-dd HH:mm:ss"
v-model="form.finish_at"
type="datetime"
placeholder="选择结束时间"
>
</el-date-picker>
</el-form-item>
<el-form-item label="活动地点:" prop="address">
<el-input v-model="form.address" placeholder="请输入详细地址" />
</el-form-item>
<el-form-item label="报名人数上限:" prop="max_number">
<el-input
v-model.number="form.max_number"
placeholder="请输入报名人数"
/>
</el-form-item>
<el-form-item label="邀请对象:" prop="notify_crowd">
<el-select v-model="form.notify_crowd" multiple placeholder="请选择">
<el-option
v-for="(key, value) in identityList"
:key="value"
:label="key"
:value="value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="活动介绍:" prop="content">
<WangEditor
v-model="form.content"
minHeight="150px"
:readonly="true"
/>
</el-form-item>
<el-form-item label="宣传图:" prop="image">
<ImageUpload v-model="form.image" :isShowTip="false" :limit="1" />
</el-form-item>
<el-form-item label="报名费用:" prop="amount">
<el-input v-model.number="form.amount">
<template slot="append"></template>
</el-input>
</el-form-item>
</el-form>
</el-dialog>
</div>
</template>
<script setup name="Apply">
import {
applyList,
activityAdd,
applyDetail,
activityEdit,
applyDelete,
applyHandle,
} from "@/api/website/activity";
import { reactive, ref, toRefs } from "vue";
import WangEditor from "../../../../components/WangEditor/index.vue";
const queryFormRef = ref(null);
const dataList = ref([]);
const loading = ref(true);
const showEditDialog = ref(false);
const formRef = ref(null);
const siteList = ref([]); // 站点列表
const showSearch = ref(true);
const title = ref("");
const total = ref(0);
const data = reactive({
queryParams: {
title: undefined,
tenantId: undefined,
contact: undefined,
contactMobile: undefined,
pageNum: 1,
pageSize: 10,
},
form: {},
});
const { queryParams, form } = toRefs(data);
const resetQuery = () => {
if (queryFormRef.value) {
queryFormRef.value.resetFields();
}
handleQuery();
};
const handleQuery = () => {
queryForm.value.pageNum = 1;
getList();
};
const getList = async () => {
loading.value = true;
const resp = await applyList(queryParams.value);
dataList.value = resp.rows;
total.value = resp.total;
loading.value = false;
};
// 获取站点列表
const getSiteList = async () => {
const resp = await tenantSelect();
siteList.value = resp.rows;
};
// 取消按钮
const cancel = () => {
showEditDialog.value = false;
// memberOpen = false;
reset();
};
const handleIdentity = (identity) => {
let arr = [];
for (const key in this.identityList) {
if (Object.hasOwnProperty.call(this.identityList, key)) {
if (((key - 0) & identity) > 0) {
arr.push(this.identityList[key]);
}
}
}
return arr.join(",");
};
// 查看按钮
const handleSee = async (row) => {
const resp = await applyDetail(row.id);
const formData = resp.data;
let arr = [];
for (const key in identityList.value) {
if (Object.hasOwnProperty.call(identityList.value, key)) {
if (((key - 0) & formData.notify_crowd) > 0) {
arr.push(key);
}
}
}
formData.notify_crowd = arr;
form.value = formData;
showEditDialog.value = true;
title.value = "修改";
};
const handleUpdate = (row) => {
this.$prompt('请输入数据编号为"' + row.id + '"的处理结果', "处理", {
confirmButtonText: "确定",
cancelButtonText: "取消",
closeOnClickModal: false,
inputType: "textarea",
// inputPattern: /^.{5,20}$/,
// inputErrorMessage: "长度必须介于 5 和 20 之间",
})
.then(({ value }) => {
applyHandle({ id: row.id, remark: value }).then((response) => {
this.getList();
this.$modal.msgSuccess("处理成功");
});
})
.catch(() => {});
};
getList();
</script>
<!-- <script>
import {
applyList,
activityAdd,
applyDetail,
activityEdit,
applyDelete,
applyHandle,
} from "@/api/website/activity";
import { areaList, industry, identity } from "@/api/config";
export default {
data() {
return {
is_super: this.$store.getters.is_super,
loading: true,
showSearch: true,
queryParams: {
title: undefined,
tenantId: undefined,
contact: undefined,
contactMobile: undefined,
pageNum: 1,
pageSize: 10,
},
total: 0,
dataList: [],
// 是否显示弹出层
open: false,
// 人群类型
identityList: [],
// 表单参数
form: {},
};
},
methods: {},
created() {
this.getList();
identity().then((res) => {
this.identityList = res.data;
});
},
};
</script> -->

View File

@ -59,7 +59,7 @@
<el-table-column label="导航名称" prop="title" width="120" /> <el-table-column label="导航名称" prop="title" width="120" />
<el-table-column label="所属站点" align="center"> <el-table-column label="所属站点" align="center">
<template #default="{ row }"> <template #default="{ row }">
{{ getSiteName(row.tenantId) }} {{ siteList.find((el) => el.id === row.tenantId)?.name || "无" }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="创建时间" align="center"> <el-table-column label="创建时间" align="center">
@ -196,12 +196,12 @@ const getSiteList = async () => {
siteList.value = resp.rows; siteList.value = resp.rows;
}; };
const getSiteName = (tenantId) => { // const getSiteName = (tenantId) => {
const item = siteList.value.find((el) => { // const item = siteList.value.find((el) => {
return el.id === tenantId; // return el.id === tenantId;
}); // });
return item ? item.name : "无"; // return item ? item.name : "无";
}; // };
// 取消按钮 // 取消按钮
const cancel = () => { const cancel = () => {
showEditDialog.value = false; showEditDialog.value = false;

View File

@ -65,7 +65,7 @@
</el-table-column> </el-table-column>
<el-table-column label="所属站点" align="center"> <el-table-column label="所属站点" align="center">
<template #default="{ row }"> <template #default="{ row }">
{{ getSiteName(row.tenantId) }} {{ siteList.find((el) => el.id === row.tenantId)?.name || "无" }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="创建时间" align="center"> <el-table-column label="创建时间" align="center">
@ -149,7 +149,6 @@
</el-form-item> </el-form-item>
<el-form-item label="服务描述:" prop="content"> <el-form-item label="服务描述:" prop="content">
<WangEditor v-model="form.content" minHeight="150px"></WangEditor> <WangEditor v-model="form.content" minHeight="150px"></WangEditor>
<!-- <Editor v-model="form.content" :minHeight="150" /> -->
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
@ -242,13 +241,13 @@ const getSiteList = async () => {
siteList.value = resp.rows; siteList.value = resp.rows;
}; };
// 获取站点名称 // // 获取站点名称
const getSiteName = (tenantId) => { // const getSiteName = (tenantId) => {
const item = siteList.value.find((el) => { // const item = siteList.value.find((el) => {
return el.id === tenantId; // return el.id === tenantId;
}); // });
return item ? item.name : "无"; // return item ? item.name : "无";
}; // };
// 获取分类名称 // 获取分类名称
const getCategoryName = (categoryId) => { const getCategoryName = (categoryId) => {

View File

@ -0,0 +1,272 @@
<template>
<div class="app-container">
<el-form
:model="queryParams"
ref="queryFormRef"
v-show="showSearch"
:inline="true"
@submit.native.prevent
>
<el-form-item label="所属站点:" prop="tenantId">
<el-select
v-model="queryParams.tenantId"
placeholder="请选择,支持搜索"
size="default"
filterable
>
<el-option
v-for="item in siteList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="search"
size="default"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="refresh" size="default" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="plus"
size="default"
@click="handleAdd"
>新增</el-button
>
</el-col>
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="dataList">
<el-table-column label="数据编码" prop="id" align="center" />
<el-table-column label="协议名称" prop="title" />
<el-table-column label="状态" align="center">
<template #default="{ row }">
{{ row.status == 1 ? "启用" : "停用" }}
</template>
</el-table-column>
<el-table-column label="所属站点" align="center">
<template #default="{ row }">
{{ siteList.find((el) => el.id === row.tenantId)?.name || "无" }}
</template>
</el-table-column>
<el-table-column label="更新时间" align="center">
<template #default="{ row }">
<span>{{ row.updated_at }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template #default="{ row }">
<el-button
size="small"
type="text"
icon="edit"
@click="handleUpdate(row)"
>编辑</el-button
>
<el-button
size="small"
type="text"
icon="delete"
@click="handleDelete(row)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改对话框 -->
<el-dialog :title="title" v-model="showEditDialog" width="40%">
<el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
<el-form-item label="所属站点:" prop="tenantId">
<el-select
v-model="form.tenantId"
placeholder="请选择,支持搜索"
size="default"
filterable
>
<el-option
v-for="item in siteList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="启用状态:" prop="status">
<el-radio v-model="form.status" :label="1">启用</el-radio>
<el-radio v-model="form.status" :label="2">停用</el-radio>
</el-form-item>
<el-form-item label="导航名称:" prop="title">
<el-input v-model="form.title" placeholder="请输入导航名称" />
</el-form-item>
<el-form-item label="内容:" prop="content">
<!-- <Editor v-model="form.content" :minHeight="150" /> -->
<WangEditor v-model="form.content" minHeight="150px" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script setup name="Agreement">
import {
agreementList,
agreementAdd,
agreementDetail,
agreementEdit,
agreementDelete,
} from "@/api/website/siteSet";
import { reactive, toRefs } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { tenantSelect } from "@/api/subPlatform/tenant";
import WangEditor from "../../../../components/WangEditor/index.vue";
const loading = ref(true); // 是否正在加载
const showSearch = ref(true); // 是否显示搜索栏
const showEditDialog = ref(false);
const queryFormRef = ref(null);
const formRef = ref(null);
const siteList = ref([]);
const total = ref(0);
const title = ref("");
const dataList = ref([]);
const data = reactive({
queryParams: {
title: undefined,
tenantId: undefined,
pageNum: 1,
pageSize: 10,
},
// 表单参数
form: {},
rules: {
title: [{ required: true, message: "导航名称不能为空", trigger: "blur" }],
tenantId: [
{
required: true,
message: "所属站点不能为空",
trigger: ["blur", "change"],
},
],
content: [
{
required: true,
message: "内容不能为空",
trigger: "blur",
},
],
},
});
const { queryParams, form, rules } = toRefs(data);
const resetQuery = () => {
if (queryFormRef.value) {
queryFormRef.value.resetFields();
}
handleQuery();
};
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
const getList = async () => {
loading.value = true;
const resp = await agreementList(queryParams.value);
dataList.value = resp.rows;
total.value = resp.total;
loading.value = false;
};
// 获取站点列表
const getSiteList = async () => {
const resp = await tenantSelect();
siteList.value = resp.rows;
};
// 取消按钮
const cancel = () => {
showEditDialog.value = false;
// this.memberOpen = false;
reset();
};
// 表单重置
const reset = () => {
form.value = {
id: undefined,
tenantId: undefined,
title: undefined,
content: "",
status: 1,
};
if (formRef.value) {
formRef.value.resetFields();
}
};
const handleAdd = () => {
reset();
showEditDialog.value = true;
title.value = "新增";
};
const handleUpdate = async (row) => {
reset();
const resp = await agreementDetail(row.id);
form.value = resp.data;
showEditDialog.value = true;
title.value = "修改";
};
const submitForm = async () => {
await formRef.value.validate();
if (form.value.id != undefined) {
await agreementEdit(form.value);
ElMessage.success("修改成功");
showEditDialog.value = false;
getList();
} else {
await agreementAdd(form.value);
ElMessage.success("新增成功");
showEditDialog.value = false;
getList();
}
};
/** 删除按钮操作 */
const handleDelete = (row) => {
ElMessageBox.confirm(`是否确认删除编号为${row.id}的数据项?`)
.then(async () => {
await agreementDelete(row.id);
getList();
ElMessage.success("删除成功");
})
.catch(() => {});
};
getList();
getSiteList();
</script>

View File

@ -0,0 +1,418 @@
<template>
<div class="app-container">
<el-form
:model="queryParams"
ref="queryFormRef"
v-show="showSearch"
:inline="true"
@submit.native.prevent
>
<el-form-item label="所在位置" prop="local">
<!-- <el-cascader
size="default"
style="width: 240px"
v-model="queryParams.local"
clearable
separator="-"
placeholder="请选择,支持搜索"
:options="bannerLocalList"
filterable
:props="{ emitPath: false, value: 'title', label: 'title' }"
></el-cascader> -->
<el-input
v-model="queryParams.locals"
placeholder="请输入所在位置"
clearable
size="default"
style="width: 240px"
@keyup.enter.native="handleQuery"
></el-input>
</el-form-item>
<el-form-item label="所属站点" prop="tenantId">
<el-select
v-model="queryParams.tenantId"
placeholder="请选择,支持搜索"
size="default"
filterable
>
<el-option
v-for="item in siteList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="search"
size="default"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="refresh" size="default" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="plus"
size="default"
@click="handleAdd"
>新增</el-button
>
</el-col>
<right-toolbar
v-model:showSearch="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="dataList">
<el-table-column label="数据编号" prop="id" align="center" />
<el-table-column label="banner图名称" prop="title" align="center" />
<el-table-column label="所在位置" prop="locals" align="center" />
<el-table-column label="是否显示多图" align="center">
<template #default="{ row }">
{{ row.multipleFlag === "1" ? "是" : "否" }}
</template>
</el-table-column>
<el-table-column label="图片" prop="images" align="center">
<template #default="{ row }">
<ImagePreview :width="50" :height="50" :src="row.images" />
</template>
</el-table-column>
<el-table-column label="建议上传图片尺寸" prop="sizes" align="center" />
<el-table-column label="所属站点" prop="area" align="center">
<template #default="{ row }">
{{ siteList.find((el) => el.id === row.tenantId)?.name || "无" }}
</template>
</el-table-column>
<el-table-column label="创建时间" prop="created_at" align="center">
<template #default="{ row }">
<span>{{ row.createTime }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template #default="{ row }">
<el-button
size="small"
type="text"
icon="edit"
@click="handleUpdate(row)"
>编辑</el-button
>
<el-button
size="small"
type="text"
icon="delete"
@click="handleDelete(row)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改对话框 -->
<el-dialog :title="title" v-model="showEditDialog" width="500px">
<el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
<el-form-item label="所属站点:" prop="tenantId">
<el-select
v-model="form.tenantId"
placeholder="请选择,支持搜索"
size="default"
filterable
>
<el-option
v-for="item in siteList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="所在位置:" prop="local">
<div style="display: flex">
<el-autocomplete
style="flex: 1"
v-model="form.local"
:fetch-suggestions="querySearch"
placeholder="请输入"
value-key="title"
@select="handleSelect"
></el-autocomplete>
<el-button
type="primary"
style="margin-left: 15px"
@click="addDomain"
v-if="form.domains ? (form.domains.length ? false : true) : false"
>添加子节点</el-button
>
</div>
</el-form-item>
<el-form-item
v-for="(domain, index) in form.domains"
:label="'上级子节点'"
:key="domain.key"
:prop="'domains.' + index + '.title'"
:rules="{
required: true,
message: '子节点不能为空',
trigger: 'blur',
}"
>
<div style="display: flex">
<el-input v-model="domain.title"></el-input>
<el-button
style="margin-left: 30px"
@click.prevent="removeDomain(domain)"
>删除</el-button
>
<el-button
v-if="index + 1 == form.domains.length"
type="primary"
@click="addDomain"
>添加</el-button
>
</div>
</el-form-item>
<el-form-item label="图片名称:" prop="title">
<el-input v-model="form.title" placeholder="请输入banner图名称" />
</el-form-item>
<el-form-item label="建议尺寸:" prop="size">
<el-input v-model="form.size" placeholder="请输入图片建议尺寸" />
</el-form-item>
<el-form-item label="图片:" prop="images">
<ImageUpload v-model="form.images" :isShowTip="false" :limit="2" />
</el-form-item>
<el-form-item label="显示多张:" prop="multipleFlag">
<el-radio v-model="form.multipleFlag" :label="1">是</el-radio>
<el-radio v-model="form.multipleFlag" :label="0"></el-radio>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script setup name="Banner">
import {
bannerLocal,
bannerList,
bannerAdd,
bannerEdit,
bannerDelete,
} from "@/api/website/siteSet";
import { tenantSelect } from "@/api/subPlatform/tenant";
import { reactive, toRefs } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
const loading = ref(true); // 是否正在加载
const showSearch = ref(true); // 是否显示搜索栏
const queryFormRef = ref(null);
const formRef = ref(null);
const siteList = ref([]);
const total = ref(0);
const dataList = ref([]);
const bannerLocalList = ref([]);
const restaurants = ref([]);
// 弹出层标题
const title = ref("");
// 是否显示弹出层
const showEditDialog = ref(false);
const data = reactive({
queryParams: {
locals: undefined,
tenantId: undefined,
pageNum: 1,
pageSize: 10,
}, // 表单参数
form: {},
rules: {
tenantId: [
{
required: true,
message: "所属站点不能为空",
trigger: ["blur", "change"],
},
],
local: [{ required: true, message: "所在位置不能为空", trigger: "change" }],
title: [{ required: true, message: "数据名称不能为空", trigger: "blur" }],
size: [{ required: true, message: "建议尺寸不能为空", trigger: "blur" }],
images: [
{
required: true,
message: "图片不能为空",
trigger: ["blur", "change"],
},
],
},
});
const { queryParams, form, rules } = toRefs(data);
const filterLocal = (data, parentTitle, out) => {
data.forEach((item) => {
let title = item.title;
if (parentTitle != "") title = parentTitle + ">" + item.title;
out.push({ title: title });
if (item.children && item.children.length > 0) {
this.filterLocal(item.children, title, out);
}
});
};
const resetQuery = () => {
if (queryFormRef.value) {
queryFormRef.value.resetFields();
}
handleQuery();
};
const handleQuery = () => {
queryParams.value.pageNum = 1;
getList();
};
const getList = async () => {
loading.value = true;
const resp = await bannerList(queryParams.value);
dataList.value = resp.rows;
total.value = resp.total;
loading.value = false;
};
// 获取站点列表
const getSiteList = async () => {
const resp = await tenantSelect();
siteList.value = resp.rows;
};
const getBannerLocal = () => {
bannerLocal({}).then((res) => {
bannerLocalList.value = res.data;
filterLocal(res.data, "", restaurants.value);
});
};
// 取消按钮
const cancel = () => {
this.open = false;
this.memberOpen = false;
this.reset();
};
// 表单重置
const reset = () => {
form.value = {
id: undefined,
tenantId: undefined,
title: undefined,
locals: undefined,
size: undefined,
domains: [],
images: undefined,
multipleFlag: 0,
};
// this.resetForm("form");
if (formRef.value) {
formRef.value.resetFields();
}
};
const handleAdd = () => {
reset();
showEditDialog.value = true;
title.value = "新增";
};
const querySearch = (queryString, cb) => {
let restaurants = this.restaurants;
let results = queryString
? restaurants.filter(this.createFilter(queryString))
: restaurants;
// 调用 callback 返回建议列表的数据
cb(results);
};
const createFilter = (queryString) => {
return (restaurant) => {
return (
restaurant.title.toLowerCase().indexOf(queryString.toLowerCase()) != -1
);
};
};
const handleSelect = (item) => {
console.log(item);
};
const removeDomain = (item) => {
let index = this.form.domains.indexOf(item);
if (index !== -1) {
this.form.domains.splice(index, 1);
}
};
const addDomain = () => {
this.form.domains.push({
title: "",
});
};
const handleUpdate = (row) => {
reset();
form.value = Object.assign({}, form.value, row);
let arr = form.value.locals.split(">");
form.value.locals = arr[0];
for (let i = 1; i < arr.length; i++) {
form.value.domains.push({ title: arr[i] });
}
showEditDialog.value = true;
title.value = "修改";
};
const submitForm = async () => {
let formData = Object.assign({}, form.value);
for (let i = 0; i < formData.domains.length; i++) {
const item = formData.domains[i];
formData.local += ">" + item.title;
}
await formRef.value.validate();
if (formData.id != undefined) {
await bannerEdit(formData);
ElMessage.success("修改成功");
showEditDialog.value = false;
getList();
// this.getBannerLocal();
} else {
await bannerAdd(formData);
ElMessage.success("新增成功");
showEditDialog.value = false;
getList();
// this.getBannerLocal();
}
};
/** 删除按钮操作 */
const handleDelete = (row) => {
ElMessageBox.confirm(`是否确认删除编号为${row.id}的数据项?`)
.then(async () => {
await bannerDelete(row.id);
getList();
ElMessage.success("删除成功");
})
.catch(() => {});
};
getList();
getSiteList();
// getBannerLocal();
</script>

View File

@ -0,0 +1,296 @@
<template>
<div class="app-container">
<el-form
v-if="is_super"
:model="queryParams"
ref="queryForm"
v-show="showSearch"
:inline="true"
@submit.native.prevent
>
<el-form-item label="所属站点" prop="tenant_id">
<SiteOptions v-model="queryParams" />
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
>
新增
</el-button>
</el-col>
</el-row>
<el-table
v-if="refreshTable"
v-loading="loading"
:data="dataList"
row-key="id"
:default-expand-all="isExpandAll"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
>
<el-table-column prop="title" label="导航名称"></el-table-column>
<el-table-column
prop="link"
label="链接"
align="center"
></el-table-column>
<el-table-column
prop="area"
label="站点"
align="center"
></el-table-column>
<el-table-column prop="updated_at" label="更新时间" align="center">
<template slot-scope="scope">
<span>{{ formatTime(scope.row.updated_at) }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
>修改</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
>删除</el-button
>
<el-button
v-if="scope.row.parent_id == ''"
size="mini"
type="text"
icon="el-icon-plus"
@click="handleAdd(scope.row)"
>新增子导航</el-button
>
</template>
</el-table-column>
</el-table>
<!-- 添加或修改导航对话框 -->
<el-dialog :title="title" v-model="show" width="680px" append-to-body>
<el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
<el-form-item label="所属站点:" prop="tenant_id">
<SiteOptions v-model="form" />
</el-form-item>
<el-form-item label="上级导航" prop="parent_id">
<treeselect
v-model="form.parent_id"
:options="menuOptions"
:normalizer="normalizer"
:show-count="true"
placeholder="选择上级导航"
/>
</el-form-item>
<el-form-item label="导航名称" prop="title">
<el-input v-model="form.title" placeholder="请输入导航名称" />
</el-form-item>
<el-form-item label="导航链接" prop="link">
<el-input v-model="form.link" placeholder="请输入链接" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
navigationList,
navigationAdd,
navigationEdit,
navigationDelete,
} from "@/api/website/siteSet";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
components: { Treeselect },
data() {
return {
is_super: this.$store.getters.is_super,
// 遮罩层
loading: true,
// 显示搜索条件
showSearch: true,
// 导航表格树数据
dataList: [],
// 导航树选项
menuOptions: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 是否展开,默认全部折叠
isExpandAll: false,
// 重新渲染表格状态
refreshTable: true,
// 查询参数
queryParams: {
tenant_id: undefined,
},
// 表单参数
form: {},
// 表单校验
rules: {
tenant_id: [
{
required: true,
message: "所属站点不能为空",
trigger: ["blur", "change"],
},
],
title: [
{ required: true, message: "导航名称不能为空", trigger: "blur" },
],
link: [
{ required: true, message: "导航链接不能为空", trigger: "blur" },
],
},
};
},
created() {
this.getList();
},
methods: {
/** 查询导航列表 */
getList() {
this.loading = true;
navigationList(this.queryParams).then((response) => {
this.getTreeselect(response.data);
this.dataList = response.data;
this.loading = false;
});
},
/** 转换导航数据结构 */
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children;
}
return {
id: node.id,
label: node.title,
children: node.children,
};
},
/** 查询导航下拉树结构 */
getTreeselect(options) {
const arr = JSON.parse(JSON.stringify(options));
arr.forEach((item) => {
delete item.children;
});
this.menuOptions = [];
const menu = { id: "", title: "主类目", children: [] };
menu.children = arr;
this.menuOptions.push(menu);
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
tenant_id: undefined,
parent_id: undefined,
title: undefined,
link: undefined,
status: 1,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
/** 新增按钮操作 */
handleAdd(row) {
this.reset();
if (row != null && row.parent_id == "") {
this.form.parent_id = row.id;
} else {
this.form.parent_id = "";
}
this.open = true;
this.title = "添加导航";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
this.form = Object.assign({}, row);
this.open = true;
this.title = "修改导航";
},
/** 提交按钮 */
submitForm: function () {
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.id) {
navigationEdit(this.form).then((response) => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
navigationAdd(this.form).then((response) => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
this.$modal
.confirm('是否确认删除编号为"' + row.id + '"的数据项?')
.then(function () {
return navigationDelete({ id: row.id });
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => {});
},
},
};
</script>

View File

@ -0,0 +1,3 @@
<template>
<div>客服二维码</div>
</template>

View File

@ -98,7 +98,7 @@
</el-table-column> </el-table-column>
<el-table-column label="所属站点" align="center"> <el-table-column label="所属站点" align="center">
<template #default="{ row }"> <template #default="{ row }">
{{ getSiteName(row.tenantId) }} {{ siteList.find((el) => el.id === row.tenantId)?.name || "无" }}
</template> </template>
</el-table-column> </el-table-column>
@ -298,12 +298,12 @@ const getSiteList = async () => {
const resp = await tenantSelect(); const resp = await tenantSelect();
siteList.value = resp.rows; siteList.value = resp.rows;
}; };
const getSiteName = (tenantId) => { // const getSiteName = (tenantId) => {
const item = siteList.value.find((el) => { // const item = siteList.value.find((el) => {
return el.id === tenantId; // return el.id === tenantId;
}); // });
return item ? item.name : "无"; // return item ? item.name : "无";
}; // };
// 取消按钮 // 取消按钮
const cancel = () => { const cancel = () => {
showEditDialog.value = false; showEditDialog.value = false;

View File

@ -79,7 +79,11 @@
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="所属站点" align="center"> <el-table-column label="所属站点" align="center">
<template #default="{ row }"> {{ getSiteName(row.tenantId) }}</template> <template #default="{ row }">
{{
siteList.find((el) => el.id === row.tenantId)?.name || "无"
}}</template
>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
label="描述" label="描述"
@ -304,12 +308,12 @@ const reset = () => {
formRef.value.resetFields(); formRef.value.resetFields();
} }
}; };
const getSiteName = (tenantId) => { // const getSiteName = (tenantId) => {
const item = siteList.value.find((el) => { // const item = siteList.value.find((el) => {
return el.id === tenantId; // return el.id === tenantId;
}); // });
return item ? item.name : "无"; // return item ? item.name : "无";
}; // };
const handleAdd = () => { const handleAdd = () => {
reset(); reset();
showEditDialog.value = true; showEditDialog.value = true;