19 Commits

Author SHA1 Message Date
lcc 902ab2b403 修改专题配置 2024-08-26 11:31:53 +08:00
lcc a8e3edce9a 增加私域专题底部图片配置 2024-08-22 17:35:24 +08:00
lcc 1f263ae30b 修改专题模块 2024-08-12 23:24:46 +08:00
lcc 111efc1b40 修改专题 2024-08-11 18:26:44 +08:00
lcc 5654eca107 修改专题模块 2024-08-09 16:23:11 +08:00
lcc 8f6dcd2884 增加模块类型 2024-08-08 16:36:36 +08:00
lcc 0c6d0b22ae 修改报名状态修改判断 2024-08-08 11:52:00 +08:00
lcc 55ee6f735a 增加配置报名处理方式 2024-08-07 18:10:02 +08:00
小鱼开发 511a5908f5 1 2024-08-04 16:33:50 +08:00
lcc bc4bdda418 修改专题 2024-07-29 19:23:52 +08:00
lcc 3d53c51cd0 修改专题 2024-07-28 17:51:10 +08:00
lcc b858ac3ed0 增加私域专题模块 2024-07-26 14:08:55 +08:00
小鱼开发 a55e221e4b 77 2024-07-12 22:29:44 +08:00
小鱼开发 e66ba02af3 level 2024-06-25 17:49:53 +08:00
chenrx 92e14f6c22 活动配置新增订单归属 2024-06-17 14:07:59 +08:00
chenrx da563d7b12 修改活动配置1 2024-06-14 17:50:14 +08:00
chenrx f80deebb51 修改活动配置 2024-06-14 16:31:51 +08:00
xiaoyu 27b8f6343c logo 2023-09-03 20:08:42 +08:00
dengbw b1b6628af7 加黑名单 2023-06-13 09:39:06 +08:00
25 changed files with 3165 additions and 302 deletions
+1 -1
View File
@@ -1,2 +1,2 @@
VUE_APP_API_BASE_URL=http://market.dev.liche.cn/api
VUE_APP_API_BASE_URL=http://market.lc.haodian.cn/api
#npm run serve 加载环境
+2 -2
View File
@@ -57,7 +57,7 @@
let link = document.querySelector("link[rel*='icon']") || document.createElement('link');
link.type = 'image/x-icon';
link.rel = 'shortcut icon';
link.href = 'https://bo.liche.cn/favicon_liche.ico';
link.href = 'https://bo.liche.cn/favicon_hd.ico';
document.getElementsByTagName('head')[0].appendChild(link);
}else if(hostname=='dongfeng.haodian.cn'){
let link = document.querySelector("link[rel*='icon']") || document.createElement('link');
@@ -68,7 +68,7 @@
let link = document.querySelector("link[rel*='icon']") || document.createElement('link');
link.type = 'image/x-icon';
link.rel = 'shortcut icon';
link.href = 'https://bo.liche.cn/favicon_liche.ico';
link.href = 'https://bo.liche.cn/favicon_hd.ico';
}
}
</script>
+64
View File
@@ -0,0 +1,64 @@
import request from '@/utils/request';
/**
* 分页查询黑名单
* @param params 查询条件
*/
export async function pageBlacklist(params) {
const res = await request.get('/sylive/blacklist/page', {
params
});
if (res.data.code === 0) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 添加黑名单
* @param data 黑名单信息
*/
export async function addBlacklist(data) {
const res = await request.post('/sylive/blacklist', data);
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 删除黑名单
* @param id 黑名单id
*/
export async function removeBlacklist(id) {
return removeBlacklists([id]);
}
/**
* 批量删除黑名单
* @param ids 黑名单id集合
*/
export async function removeBlacklists(ids) {
const res = await request.delete('/sylive/blacklist/batch', {
data: { ids }
});
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 导入黑名单
* @param file excel文件
*/
export async function importBlacklist(file, activityId) {
const formData = new FormData();
formData.append('file', file);
formData.append('activityId', activityId);
const res = await request.post('/sylive/blacklist/import', formData);
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
+56
View File
@@ -0,0 +1,56 @@
import request from '@/utils/request';
/**
* 分页查询专题
* @param params 查询条件
*/
export async function pageSyTopicEnroll(params) {
const res = await request.get('/sytopic/enroll/page', {
params
});
if (res.data.code === 0) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
export async function pageSyTopicEnrollTypes() {
const res = await request.get('/sytopic/enroll/status', {});
if (res.data.code === 0) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
export async function updateTopicEnrollStatus(id, status) {
const res = await request.put('/sytopic/enroll/status', {
id,
status
});
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 导出订单
* @param params 查询条件
*/
export async function exportTopicEnroll(params) {
const res = await request.get('/sytopic/enroll/export', {
params
});
if (res.data.code === 0) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
export async function pageSyTopicEnrollTopic() {
const res = await request.get('/sytopic/enroll/topicList', {});
if (res.data.code === 0) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
+114
View File
@@ -0,0 +1,114 @@
import request from '@/utils/request';
/**
* 分页查询模块
* @param params 查询条件
*/
export async function pageSyTopicModule(params) {
const res = await request.get('/sytopic/module/page', {
params
});
if (res.data.code === 0) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 添加专题
* @param data
*/
export async function addTopicModule(data) {
const res = await request.post('/sytopic/module', data);
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 修改专题
* @param data
*/
export async function updateTopicModule(data) {
const res = await request.put('/sytopic/module', data);
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 批量删除
* @param ids id集合
*/
export async function removeTopicModule(ids) {
const res = await request.delete('/sytopic/module/delete', {
data: { ids }
});
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 获取类型列表
*/
export async function pageTopicModuleTypes(params) {
const res = await request.get('/sytopic/module/types', {
params
});
if (res.data.code === 0) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 分页查询模块配置项
* @param params 查询条件
*/
export async function pageSyTopicModuleOptions(params) {
const res = await request.get('/sytopic/module/options', {
params
});
if (res.data.code === 0) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 添加专题配置项
* @param data
*/
export async function addTopicModuleOptions(data) {
const res = await request.post('/sytopic/module/options', data);
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 删除模块配置
* @param id id
*/
export async function removeTopicModuleOption(id) {
const res = await request.delete('/sytopic/module/options', {
data: { id }
});
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
export async function updateTopicModuleStatus(data) {
const res = await request.put('/sytopic/module/status', data);
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
+83
View File
@@ -0,0 +1,83 @@
import request from '@/utils/request';
/**
* 分页查询专题
* @param params 查询条件
*/
export async function pageSyTopic(params) {
const res = await request.get('/sytopic/topic/page', {
params
});
if (res.data.code === 0) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 添加专题
* @param data
*/
export async function addTopic(data) {
const res = await request.post('/sytopic/topic', data);
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 修改专题
* @param data
*/
export async function updateTopic(data) {
const res = await request.put('/sytopic/topic', data);
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 修改活动状态
* @param id 专题id
* @param status 状态
*/
export async function updateTopicStatus(id, status) {
const res = await request.put('/sytopic/topic/status', {
id,
status
});
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 批量删除
* @param ids id集合
*/
export async function removeTopic(ids) {
const res = await request.delete('/sytopic/topic/delete', {
data: { ids }
});
if (res.data.code === 0) {
return res.data.message;
}
return Promise.reject(new Error(res.data.message));
}
/**
* 专题详情
* @param params
*/
export async function getTopicDetail(params) {
const res = await request.get('/sytopic/topic/detail', {
params
});
if (res.data.code === 0) {
return res.data.data;
}
return Promise.reject(new Error(res.data.message));
}
+108
View File
@@ -0,0 +1,108 @@
<!-- 上传图片组件 -->
<template>
<ele-image-upload
v-model="imgs"
:limit="limit"
:drag="true"
:multiple="multiple"
:upload-handler="onHandler"
@upload="onUpload"
/>
</template>
<script>
import EleImageUpload from 'ele-admin/es/ele-image-upload';
import request from '@/utils/request';
export default {
components: {
EleImageUpload
},
name: 'UploadImg',
props: {
limit: {
type: Number,
default: 1
},
multiple: {
type: Boolean,
default: false
},
images: {
default: null,
type: Array
}
},
data() {
return {
imgs: []
};
},
mounted() {
if (this.images && this.images.length > 0) {
this.imgs = this.images;
}
},
methods: {
emitInput() {
this.$emit('input', this.imgs);
},
onHandler(file) {
const item = {
file,
uid: file.uid,
name: file.name,
progress: 0,
status: null
};
if (!file.type.startsWith('image')) {
this.$message.error('只能选择图片');
return;
}
if (file.size / 1024 / 1024 > 2) {
this.$message.error('大小不能超过 2MB');
return;
}
item.url = window.URL.createObjectURL(file);
// 关键就是这里要自己 push 添加数据而不是靠 v-modal 自动更新
this.imgs.push(item);
this.onUpload(item);
},
/* 上传 item */
onUpload(item) {
let that = this;
item.status = 'uploading';
const formData = new FormData();
formData.append('file', item.file);
request({
url: '/upload',
method: 'post',
data: formData,
onUploadProgress: (e) => {
if (e.lengthComputable) {
item.progress = (e.loaded / e.total) * 100;
}
}
})
.then((res) => {
if (res.data.code === 0) {
item.status = 'done';
item.url = res.data.data.full_url;
item.fileUrl = res.data.data.url;
that.emitInput();
}
})
.catch(() => {
item.status = 'exception';
});
}
},
watch: {
imgs: function () {
this.emitInput();
},
images: function () {
this.imgs = this.images;
}
}
};
</script>
+2 -2
View File
@@ -136,13 +136,13 @@
let hostname = window.location.hostname;
if (hostname == 'bo.liche.cn') {
this.logo =
'https://qs.haodian.cn/web/images/project/Admin-ShiYu/logo_liche.png';
'https://qs.haodian.cn/web/images/project/Admin-ShiYu/logo_hd.png';
} else if (hostname == 'dongfeng.haodian.cn') {
this.logo =
'https://qs.haodian.cn/web/images/project/Admin-ShiYu/logo_df.png';
} else {
this.logo =
'https://qs.haodian.cn/web/images/project/Admin-ShiYu/logo_liche.png';
'https://qs.haodian.cn/web/images/project/Admin-ShiYu/logo_hd.png';
}
},
computed: {
@@ -55,6 +55,16 @@
/>
<div class="ele-text-secondary">建议尺寸100X100</div>
</el-form-item>
<el-form-item
label="线索处理:"
v-show="form.organizationType == 1 ? true : false"
>
<el-select v-model="form.enrollDeal">
<el-option value="0" label="不处理" />
<el-option value="1" label="后台客服清洗" />
<el-option value="2" label="派发理车宝" />
</el-select>
</el-form-item>
</el-col>
<el-col v-bind="styleResponsive ? { sm: 12 } : { span: 12 }">
<el-form-item label="机构类型:" prop="organizationType">
@@ -127,7 +137,8 @@
sortNumber: null,
comments: '',
logo: [],
city: []
city: [],
enrollDeal: 0
};
return {
defaultForm,
@@ -1,235 +0,0 @@
<!-- 编辑弹窗 -->
<template>
<ele-modal
width="930px"
:visible="visible"
:append-to-body="true"
:close-on-click-modal="true"
custom-class="ele-dialog-form"
title="修改黑名单"
@update:visible="updateVisible"
>
<el-form ref="form" :model="form" label-width="82px">
<el-form-item label="导入名单:">
<el-upload
drag
action=""
class="ele-block"
v-loading="loading"
accept=".xls,.xlsx"
:show-file-list="false"
:before-upload="doUpload"
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
将文件拖到此处, <em>点击上传</em>
</div>
<template v-slot:tip>
<div class="el-upload__tip ele-text-center">
<span>只能上传xlsxlsx文件, </span>
<el-link
download
:href="url"
type="primary"
:underline="false"
style="vertical-align: baseline"
>
下载模板
</el-link>
</div>
</template>
</el-upload>
<el-button
icon="el-icon-plus"
style="width: 100%; margin-top: 15px"
@click="addMobile"
>
新增手机号
</el-button>
</el-form-item>
<el-form-item label="名单列表:">
<el-table :data="form.blacklist" :border="true" style="width: 100%">
<el-table-column label="手机号" align="center">
<template v-slot="{ row }">
<el-input
v-if="row.type == 'add'"
v-model="row.mobile"
placeholder="请输入手机号"
/>
{{ row.type != 'add' ? row.mobile : '' }}
</template>
</el-table-column>
<el-table-column
label="操作"
width="70px"
align="center"
:resizable="false"
>
<template v-slot="{ row, $index }">
<span class="ele-action" v-if="row.type != 'del'">
<el-popconfirm
title="确定要删除此手机号?"
@confirm="removeMobile($index)"
>
<template v-slot:reference>
<el-link
icon="el-icon-delete"
type="danger"
:underline="false"
>
删除
</el-link>
</template>
</el-popconfirm>
</span>
<span class="ele-action" v-else>已删除</span>
</template>
</el-table-column>
</el-table>
</el-form-item>
</el-form>
<template v-slot:footer>
<el-button @click="updateVisible(false)">取消</el-button>
<el-button type="primary" :loading="loading" @click="save">
保存
</el-button>
</template>
</ele-modal>
</template>
<script>
import {
updateActivityBlacklist,
importActivityBlacklist
} from '@/api/sylive/activity';
import { API_BASE_URL } from '@/config/setting';
export default {
components: {},
props: {
// 弹窗是否打开
visible: Boolean,
// 修改回显的数据
data: Object
},
data() {
const defaultForm = {
activityId: null,
blacklist: []
};
return {
defaultForm,
// 表单数据
form: { ...defaultForm },
// 提交状态
loading: false,
// 是否是修改
isUpdate: false,
// 导入请求状态
// 导入模板下载地址
url: API_BASE_URL.replace('api', '') + 'temp/blacklist.xlsx'
};
},
computed: {
// 是否开启响应式布局
styleResponsive() {
return this.$store.state.theme.styleResponsive;
}
},
methods: {
/* 上传 */
doUpload(file) {
if (
![
'application/vnd.ms-excel',
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
].includes(file.type)
) {
this.$message.error('只能选择 excel 文件');
return false;
}
if (file.size / 1024 / 1024 > 5) {
this.$message.error('大小不能超过 5MB');
return false;
}
this.loading = true;
importActivityBlacklist(file, this.form.activityId)
.then((msg) => {
this.loading = false;
this.$message.success(msg);
this.updateVisible(false);
this.$emit('done');
})
.catch((e) => {
this.loading = false;
this.$message.error(e.message);
});
return false;
},
/* 保存编辑 */
save() {
this.$refs.form.validate((valid) => {
if (!valid) {
return false;
}
this.loading = true;
const data = {
...this.form
};
updateActivityBlacklist(data)
.then((msg) => {
this.loading = false;
this.$message.success(msg);
this.updateVisible(false);
this.$emit('done');
})
.catch((e) => {
this.loading = false;
this.$message.error(e.message);
});
});
},
/* 添加手机 */
addMobile() {
this.form.blacklist.push({ mobile: '', type: 'add' });
},
/* 删除手机 */
removeMobile(index) {
if (!this.form.blacklist[index].id) {
this.form.blacklist.splice(index, 1);
} else {
this.form.blacklist[index].type = 'del';
}
},
/* 更新visible */
updateVisible(value) {
this.$emit('update:visible', value);
}
},
watch: {
visible(visible) {
if (visible) {
if (this.data) {
this.$util.assignObject(this.form, {
...this.data
});
this.isUpdate = true;
} else {
this.form.blacklist = [];
this.isUpdate = false;
}
} else {
this.$refs.form.clearValidate();
this.form = { ...this.defaultForm };
}
}
}
};
</script>
<style lang="scss" scoped>
.ele-block {
:deep(.el-upload),
:deep(.el-upload-dragger) {
width: 100%;
}
}
</style>
@@ -86,6 +86,12 @@
<el-form-item label="收款账户:" prop="mchId">
<activity-mch-id-select v-model="form.mchId" />
</el-form-item>
<el-form-item label="订单归属:">
<el-radio-group v-model="form.orderType">
<el-radio :label="0">按首次</el-radio>
<el-radio :label="1">按支付</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="banner:">
<ele-image-upload
v-model="form.banner"
@@ -150,13 +156,6 @@
<el-radio :label="1"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="按扭文案:">
<el-input
clearable
v-model="form.button.title"
placeholder="请输入按扭文案"
/>
</el-form-item>
<el-form-item label="弹幕颜色:">
<el-radio-group v-model="form.barrage.color">
<el-radio :label="0"></el-radio>
@@ -168,13 +167,36 @@
placeholder="请输入弹幕文案"
/>
</el-form-item>
<el-form-item label="报名预约:">
<el-form-item label="按扭文案:">
<el-input
clearable
v-model="form.button.title"
placeholder="请输入按扭文案"
/>
</el-form-item>
<el-form-item label="按钮类型:">
<el-radio-group v-model="form.signBespeak.status">
<el-radio :label="0"></el-radio>
<el-radio :label="1"></el-radio>
<el-radio :label="0">商品</el-radio>
<el-radio :label="1">报名</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="支付商品:">
<el-select
v-model="form.signBespeak.payItemId"
placeholder="请选择关联商品"
clearable
class="ele-fluid"
>
<el-option
v-for="item in payGoodsLists"
:key="item.itemId"
:value="item.itemId"
:label="item.title"
/>
</el-select>
</el-form-item>
<el-form-item label="报名配置:">
<el-select
v-if="form.signBespeak.status"
v-model="form.signBespeak.itemId"
placeholder="请选择关联商品"
clearable
@@ -188,16 +210,12 @@
/>
</el-select>
<el-input
v-if="form.signBespeak.status"
v-model="form.signBespeak.title"
style="padding-top: 10px"
clearable
placeholder="请输入弹窗标题"
/>
<div
style="padding-top: 10px"
v-if="form.signBespeak.status && editVersion"
>
<div style="padding-top: 10px">
<tinymce-editor
:init="editoption"
v-model="form.signBespeak.content"
@@ -217,6 +235,8 @@
<el-select v-model="row.urlType" class="ele-fluid">
<el-option label="链接" value="link" />
<el-option label="小程序" value="miniProgram" />
<el-option label="报名" value="enroll" />
<el-option label="订阅" value="appoint" />
</el-select>
</template>
</el-table-column>
@@ -362,11 +382,19 @@
bottoms: [],
blacklist: 0,
button: { title: '' },
signBespeak: { status: 0, title: '', content: '', itemId: 0 },
barrage: { color: 0, title: '' }
signBespeak: {
status: 0,
title: '',
content: '',
itemId: 0,
payItemId: ''
},
barrage: { color: 0, title: '' },
orderType: 0
};
return {
goodsList: [],
payGoodsLists: [],
editVersion: false,
editoption: {
height: 300,
@@ -448,6 +476,17 @@
.catch((e) => {
this.$message.error(e.message);
});
listGoods({
activityId: this.form.activityId,
price: 0,
price_type: 'gt'
})
.then((list) => {
this.payGoodsLists = list;
})
.catch((e) => {
this.$message.error(e.message);
});
},
/* 添加海报描述 */
addShareTitle() {
+1 -13
View File
@@ -153,11 +153,6 @@
:visible.sync="showEditVisitTag"
@done="reload"
/>
<activity-blacklist
:data="current"
:visible.sync="showEditBlacklist"
@done="reload"
/>
</div>
</template>
@@ -169,7 +164,6 @@
import ActivityCoupon from './components/activity-coupon.vue';
import ActivityDraw from './components/activity-draw.vue';
import ActivityVisitTag from './components/activity-visit-tag';
import ActivityBlacklist from './components/activity-blacklist';
import {
pageActivity,
@@ -183,7 +177,6 @@
export default {
name: 'syliveActivity',
components: {
ActivityBlacklist,
ActivityVisitTag,
QrCode,
ActivitySearch,
@@ -277,7 +270,6 @@
// 是否显示编辑券弹窗
showEditDraw: false,
showEditVisitTag: false,
showEditBlacklist: false,
// 是否显示二维码弹窗
showCode: false
};
@@ -310,11 +302,7 @@
};
this.showEditVisitTag = true;
} else if (command === 'blacklist') {
this.current = {
blacklist: row.showBlacklist,
activityId: row.activityId
};
this.showEditBlacklist = true;
this.$router.replace('/sylive/blacklist?id=' + row.activityId);
} else if (command === 'goods') {
this.$router.replace('/sylive/goods?id=' + row.activityId);
} else if (command === 'groups') {
@@ -0,0 +1,110 @@
<!-- 用户编辑弹窗 -->
<template>
<ele-modal
width="750px"
:visible="visible"
:append-to-body="true"
:close-on-click-modal="true"
custom-class="ele-dialog-form"
title="添加黑名单"
@update:visible="updateVisible"
>
<el-form ref="form" :model="form" :rules="rules" label-width="82px">
<el-form-item label="手机号:" prop="mobile">
<el-input
clearable
:maxlength="60"
v-model="form.mobile"
placeholder="请输入手机号"
/>
</el-form-item>
</el-form>
<template v-slot:footer>
<el-button @click="updateVisible(false)">取消</el-button>
<el-button type="primary" :loading="loading" @click="save">
保存
</el-button>
</template>
</ele-modal>
</template>
<script>
import { addBlacklist } from '@/api/sylive/blacklist';
export default {
props: {
// 弹窗是否打开
visible: Boolean,
// 修改回显的数据
data: Object
},
data() {
const defaultForm = {
blacklistId: null,
activityId: null,
mobile: ''
};
return {
defaultForm,
// 表单数据
form: { ...defaultForm },
// 表单验证规则
rules: {
mobile: [
{
required: true,
message: '请输入手机号',
trigger: 'blur'
}
]
},
// 提交状态
loading: false
};
},
computed: {
// 是否开启响应式布局
styleResponsive() {
return this.$store.state.theme.styleResponsive;
}
},
methods: {
/* 保存编辑 */
save() {
this.$refs.form.validate((valid) => {
if (!valid) {
return false;
}
this.loading = true;
const data = {
...this.form
};
addBlacklist(data)
.then((msg) => {
this.loading = false;
this.$message.success(msg);
this.updateVisible(false);
this.$emit('done');
})
.catch((e) => {
this.loading = false;
this.$message.error(e.message);
});
});
},
/* 更新visible */
updateVisible(value) {
this.$emit('update:visible', value);
}
},
watch: {
visible(visible) {
if (visible) {
this.form.activityId = this.data.activityId;
} else {
this.$refs.form.clearValidate();
this.form = { ...this.defaultForm };
}
}
}
};
</script>
@@ -0,0 +1,103 @@
<!-- 导入弹窗 -->
<template>
<ele-modal
width="520px"
title="导入黑名单"
:visible="visible"
@update:visible="updateVisible"
>
<el-upload
drag
action=""
class="ele-block"
v-loading="loading"
accept=".xls,.xlsx"
:show-file-list="false"
:before-upload="doUpload"
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处, <em>点击上传</em></div>
<template v-slot:tip>
<div class="el-upload__tip ele-text-center">
<span>只能上传xlsxlsx文件, </span>
<el-link
download
:href="url"
type="primary"
:underline="false"
style="vertical-align: baseline"
>
下载模板
</el-link>
</div>
</template>
</el-upload>
</ele-modal>
</template>
<script>
import { importBlacklist } from '@/api/sylive/blacklist';
import { API_BASE_URL } from '@/config/setting';
export default {
props: {
// 是否打开弹窗
visible: Boolean,
// 修改回显的数据
data: Object
},
data() {
return {
// 导入请求状态
loading: false,
// 导入模板下载地址
url: API_BASE_URL.replace('api', '') + 'temp/blacklist.xlsx'
};
},
methods: {
/* 上传 */
doUpload(file) {
if (
![
'application/vnd.ms-excel',
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
].includes(file.type)
) {
this.$message.error('只能选择 excel 文件');
return false;
}
if (file.size / 1024 / 1024 > 5) {
this.$message.error('大小不能超过 5MB');
return false;
}
this.loading = true;
let activityId = this.data.activityId;
importBlacklist(file, activityId)
.then((msg) => {
this.loading = false;
this.$message.success(msg);
this.updateVisible(false);
this.$emit('done');
})
.catch((e) => {
this.loading = false;
this.$message.error(e.message);
});
return false;
},
/* 更新visible */
updateVisible(value) {
this.$emit('update:visible', value);
}
}
};
</script>
<style lang="scss" scoped>
.ele-block {
:deep(.el-upload),
:deep(.el-upload-dragger) {
width: 100%;
}
}
</style>
@@ -0,0 +1,62 @@
<!-- 搜索表单 -->
<template>
<el-form
label-width="77px"
class="ele-form-search"
@keyup.enter.native="search"
@submit.native.prevent
>
<el-row :gutter="15">
<el-col v-bind="styleResponsive ? { lg: 8, md: 16 } : { span: 8 }">
<el-form-item label="手机号:">
<el-input clearable v-model="where.mobile" placeholder="请输入" />
</el-form-item>
</el-col>
<el-col v-bind="styleResponsive ? { lg: 4, md: 8 } : { span: 4 }">
<div class="ele-form-actions">
<el-button
type="primary"
icon="el-icon-search"
class="ele-btn-icon"
@click="search"
>
查询
</el-button>
<el-button @click="reset">重置</el-button>
</div>
</el-col>
</el-row>
</el-form>
</template>
<script>
export default {
data() {
// 默认表单数据
const defaultWhere = {
mobile: ''
};
return {
// 表单数据
where: { ...defaultWhere }
};
},
computed: {
// 是否开启响应式布局
styleResponsive() {
return this.$store.state.theme.styleResponsive;
}
},
methods: {
/* 搜索 */
search() {
this.$emit('search', this.where);
},
/* 重置 */
reset() {
this.where = { ...this.defaultWhere };
this.search();
}
}
};
</script>
+239
View File
@@ -0,0 +1,239 @@
<template>
<div class="ele-body">
<el-card shadow="never">
<!-- 搜索表单 -->
<blacklist-search @search="reload" />
<!-- 数据表格 -->
<ele-pro-table
ref="table"
:columns="columns"
:datasource="datasource"
:selection.sync="selection"
cache-key="syliveActivityBlacklistTable"
>
<!-- 表头工具栏 -->
<template v-slot:toolbar>
<el-button
size="small"
type="primary"
icon="el-icon-plus"
class="ele-btn-icon"
@click="openEdit()"
>
新建
</el-button>
<el-button
size="small"
type="danger"
icon="el-icon-delete"
class="ele-btn-icon"
@click="removeBatch"
>
删除
</el-button>
<el-button
size="small"
icon="el-icon-upload2"
class="ele-btn-icon"
@click="openImport"
>
导入
</el-button>
</template>
<!-- 操作列 -->
<template v-slot:action="{ row }">
<el-popconfirm
class="ele-action"
title="确定要删除此手机号吗?"
@confirm="remove(row)"
>
<template v-slot:reference>
<el-link type="danger" :underline="false" icon="el-icon-delete">
删除
</el-link>
</template>
</el-popconfirm>
</template>
</ele-pro-table>
</el-card>
<!-- 编辑弹窗 -->
<blacklist-edit :data="current" :visible.sync="showEdit" @done="reload" />
<!-- 导入弹窗 -->
<blacklist-import
:data="current"
:visible.sync="showImport"
@done="reload"
/>
</div>
</template>
<script>
import { setPageTabTitle } from '@/utils/page-tab-util';
import BlacklistSearch from './components/blacklist-search.vue';
import BlacklistEdit from './components/blacklist-edit.vue';
import BlacklistImport from './components/blacklist-import';
import { getActivity } from '@/api/sylive/activity';
import {
pageBlacklist,
removeBlacklist,
removeBlacklists
} from '@/api/sylive/blacklist';
const ROUTE_PATH = '/sylive/blacklist';
export default {
name: 'syliveBlacklist',
components: { BlacklistSearch, BlacklistEdit, BlacklistImport },
data() {
return {
// 加载状态
title: '黑名单',
loading: true,
// 表格选中数据
selection: [],
// 当前编辑数据
current: null,
// 是否显示编辑弹窗
showEdit: false,
showImport: false,
activityId: null,
// 表格列配置
columns: [
{
columnKey: 'selection',
type: 'selection',
width: 45,
align: 'center',
fixed: 'left'
},
{
prop: 'blacklistId',
label: 'ID',
width: 80,
align: 'center',
showOverflowTooltip: true,
fixed: 'left'
},
{
prop: 'mobile',
label: '手机号',
sortable: 'custom',
showOverflowTooltip: true,
minWidth: 150
},
{
prop: 'createTime',
label: '创建时间',
sortable: 'custom',
showOverflowTooltip: true,
minWidth: 120,
formatter: (_row, _column, cellValue) => {
return this.$util.toDateString(cellValue);
}
},
{
columnKey: 'action',
label: '操作',
width: 200,
align: 'center',
resizable: false,
slot: 'action'
}
]
};
},
methods: {
/* 表格数据源 */
datasource({ page, limit, where, order }) {
const activityId = this.activityId;
return pageBlacklist({ ...where, ...order, page, limit, activityId });
},
query() {
this.activityId = Number(this.$route.query.id);
if (!this.activityId) {
return;
}
this.loading = true;
getActivity(this.activityId)
.then((data) => {
this.loading = false;
// 修改页签标题
if (this.$route.path === ROUTE_PATH) {
this.title = data.title + '-黑名单';
setPageTabTitle(this.title);
}
})
.catch((e) => {
this.loading = false;
this.$message.error(e.message);
});
},
/* 打开导入弹窗 */
openImport() {
this.current = { activityId: this.activityId };
this.showImport = true;
},
/* 刷新表格 */
reload(where) {
this.$refs.table.reload({ page: 1, where: where });
},
/* 显示编辑 */
openEdit() {
this.current = { activityId: this.activityId };
this.showEdit = true;
},
/* 删除 */
remove(row) {
const loading = this.$loading({ lock: true });
removeBlacklist(row.blacklistId)
.then((msg) => {
loading.close();
this.$message.success(msg);
this.reload();
})
.catch((e) => {
loading.close();
this.$message.error(e.message);
});
},
/* 批量删除 */
removeBatch() {
if (!this.selection.length) {
this.$message.error('请至少选择一条数据');
return;
}
this.$confirm('确定要删除选中的黑名单吗?', '提示', {
type: 'warning'
})
.then(() => {
const loading = this.$loading({ lock: true });
removeBlacklists(this.selection.map((d) => d.blacklistId))
.then((msg) => {
loading.close();
this.$message.success(msg);
this.reload();
})
.catch((e) => {
loading.close();
this.$message.error(e.message);
});
})
.catch(() => {});
}
},
watch: {
$route: {
handler(route) {
const { path } = route;
if (path !== ROUTE_PATH) {
return;
}
this.query();
if (this.$refs.table) {
this.$refs.table.reload({ page: 1 });
}
},
immediate: true
}
}
};
</script>
@@ -135,20 +135,6 @@
showOverflowTooltip: true,
minWidth: 110
},
{
prop: 'consultant',
label: '参与顾问数',
align: 'center',
showOverflowTooltip: true,
minWidth: 100
},
{
prop: 'allConsultant',
label: '全部顾问数',
align: 'center',
showOverflowTooltip: true,
minWidth: 100
},
{
prop: 'browse',
label: '浏览数(人)',
@@ -166,8 +152,8 @@
minWidth: 120
},
{
prop: 'watch',
label: '观看数(',
prop: 'beforeOrder',
label: '留资数(',
align: 'center',
sortable: 'custom',
showOverflowTooltip: true,
@@ -180,20 +166,6 @@
sortable: 'custom',
showOverflowTooltip: true,
minWidth: 120
},
{
prop: 'livePV',
label: '观看数(人次)',
align: 'center',
showOverflowTooltip: true,
minWidth: 100
},
{
prop: 'watchDuration',
label: '人均观看(分)',
align: 'center',
showOverflowTooltip: true,
minWidth: 100
}
],
kpi: 'browse',
@@ -0,0 +1,99 @@
<!-- 用户编辑弹窗 -->
<template>
<ele-modal
width="700px"
:visible="visible"
:append-to-body="true"
:close-on-click-modal="true"
custom-class="ele-dialog-form"
title="链接"
@update:visible="updateVisible"
>
<el-form ref="form" :model="form" :rules="rules" label-width="82px">
<el-form-item label="状态:">
<el-select v-model="form.status" class="ele-fluid">
<el-option
v-for="(item, key) in statusLists"
:key="key"
:label="item"
:value="key"
/>
</el-select>
</el-form-item>
</el-form>
<template v-slot:footer>
<el-button @click="updateVisible(false)">取消</el-button>
<el-button type="primary" :loading="loading" @click="save">
保存
</el-button>
</template>
</ele-modal>
</template>
<script>
import { updateTopicEnrollStatus } from '@/api/sytopic/enroll';
export default {
components: {},
props: {
// 弹窗是否打开
visible: Boolean,
statusLists: Array,
// 修改回显的数据
data: Object
},
data() {
const defaultForm = {
id: '',
status: 0
};
return {
defaultForm,
// 表单数据
form: { ...defaultForm },
rules: {},
// 表单验证规则
// 提交状态
loading: false
};
},
created() {},
computed: {
// 是否开启响应式布局
styleResponsive() {
return this.$store.state.theme.styleResponsive;
}
},
methods: {
/* 更新visible */
updateVisible(value) {
this.$emit('update:visible', value);
},
save() {
const loading = this.$loading({ lock: true });
updateTopicEnrollStatus(this.form.id, this.form.status)
.then((msg) => {
loading.close();
this.$message.success(msg);
this.updateVisible(false);
this.$emit('done');
})
.catch((e) => {
loading.close();
this.$message.error(e.message);
});
}
},
watch: {
visible(visible) {
if (visible) {
if (this.data) {
this.$util.assignObject(this.form, {
...this.data
});
}
}
}
}
};
</script>
+302
View File
@@ -0,0 +1,302 @@
<template>
<div class="ele-body">
<el-card shadow="never">
<!-- 搜索表单 -->
<el-form label-width="77px" class="ele-form-search">
<el-row :gutter="15">
<el-col v-bind="styleResponsive ? { lg: 4, md: 8 } : { span: 4 }">
<el-form-item label="专题:">
<ele-tree-select
:data="topicLists"
label-key="title"
value-key="id"
v-model="where.topicId"
:clearable="true"
placeholder="请选择"
:disabled="false"
:default-expand-all="false"
:expand-on-click-node="false"
/>
</el-form-item>
</el-col>
<el-col v-bind="styleResponsive ? { lg: 5, md: 10 } : { span: 5 }">
<el-form-item label="姓名:">
<el-input
placeholder="请输入姓名"
clearable
v-model="where.name"
/>
</el-form-item>
</el-col>
<el-col v-bind="styleResponsive ? { lg: 5, md: 10 } : { span: 5 }">
<el-form-item label="手机号:">
<el-input
placeholder="请输入手机号"
clearable
v-model="where.mobile"
type="number"
/>
</el-form-item>
</el-col>
<el-col v-bind="styleResponsive ? { lg: 5, md: 10 } : { span: 5 }">
<el-form-item label="状态:">
<el-select
clearable
v-model="where.status"
placeholder="请选择"
class="ele-fluid"
>
<el-option
v-for="(item, key) in statusLists"
:key="key"
:value="key"
:label="item"
/>
</el-select>
</el-form-item>
</el-col>
<el-col v-bind="styleResponsive ? { lg: 5, md: 10 } : { span: 5 }">
<div class="ele-form-actions">
<el-button
type="primary"
icon="el-icon-search"
class="ele-btn-icon"
@click="reload"
>
查询
</el-button>
<el-button @click="reset">重置</el-button>
</div>
</el-col>
</el-row>
</el-form>
<!-- 数据表格 -->
<ele-pro-table
ref="table"
:columns="columns"
:datasource="datasource"
:selection.sync="selection"
cache-key="syliveActivityTable"
>
<!-- 表头工具栏 -->
<template v-slot:toolbar>
<el-button
size="small"
type="primary"
class="ele-btn-icon"
icon="el-icon-download"
@click="exportData"
>
导出
</el-button>
</template>
<!-- 状态列 -->
<template v-slot:status="{ row }">
{{ statusLists[row.status] }}
</template>
<!-- 操作列 -->
<template v-slot:action="{ row }">
<el-link
type="primary"
:underline="false"
icon="el-icon-edit"
:key="row.id"
@click="showEditStatus(row)"
v-if="row.enrollDeal === 0"
>
修改状态
</el-link>
</template>
</ele-pro-table>
</el-card>
<!-- 编辑弹窗 -->
<EditStatus
:data="current"
:visible.sync="showEdit"
:status-lists="statusLists"
@done="reload"
/>
</div>
</template>
<script>
import {
pageSyTopicEnroll,
pageSyTopicEnrollTypes,
exportTopicEnroll,
pageSyTopicEnrollTopic
} from '@/api/sytopic/enroll';
import EditStatus from '@/views/sytopic/enroll/components/edit-status.vue';
import { utils, writeFile } from 'xlsx';
export default {
name: 'syTopicEnroll',
components: { EditStatus },
data() {
return {
where: {
title: ''
},
// 门店数据
organizationList: [],
// 表格列配置
columns: [
{
prop: 'id',
label: 'ID',
minWidth: 40,
align: 'center',
showOverflowTooltip: true,
fixed: 'left'
},
{
prop: 'name',
label: '姓名',
showOverflowTooltip: true
},
{
prop: 'mobile',
label: '手机号',
showOverflowTooltip: true
},
{
prop: 'enTime',
label: '留资时间',
sortable: 'custom',
showOverflowTooltip: true,
minWidth: 90,
formatter: (_row, _column, cellValue) => {
return this.$util.toDateString(cellValue);
}
},
{
prop: 'channelName',
label: '来源人',
showOverflowTooltip: true
},
{
prop: 'bizName',
label: '门店',
showOverflowTooltip: true
},
{
prop: 'topicTitle',
label: '来源专题',
showOverflowTooltip: true
},
{
prop: 'status_cn',
label: '状态',
align: 'center',
resizable: false,
slot: 'status',
showOverflowTooltip: true
},
{
columnKey: 'action',
label: '操作',
width: 150,
align: 'center',
resizable: false,
slot: 'action'
}
],
// 表格选中数据
selection: [],
// 当前编辑数据
current: null,
// 是否显示编辑弹窗
showEdit: false,
statusLists: [],
title: '专题报名',
topicLists: []
};
},
computed: {
// 是否开启响应式布局
styleResponsive() {
return this.$store.state.theme.styleResponsive;
}
},
created() {
this.topicListsQuery();
},
methods: {
statusQuery() {
pageSyTopicEnrollTypes()
.then((list) => {
this.statusLists = list;
})
.catch((e) => {
this.$message.error(e.message);
});
},
topicListsQuery() {
pageSyTopicEnrollTopic()
.then((list) => {
console.log(list);
this.topicLists = this.$util.toTreeData({
data: list,
idField: 'id',
parentIdField: 'title'
});
})
.catch((e) => {
this.$message.error(e.message);
});
},
/* 表格数据源 */
datasource({ page, limit, where, order }) {
if (page === 1) {
this.statusQuery();
}
return pageSyTopicEnroll({ ...where, ...order, page, limit });
},
/* 刷新表格 */
reload() {
this.$refs.table.reload({ page: 1, where: this.where });
},
showEditStatus(row) {
this.showEdit = true;
this.current = row;
},
/* 更改状态 */
editStatus() {},
/* 重置搜索 */
reset() {
this.where = {};
},
/* 导出数据 */
exportData() {
const loading = this.$loading({ lock: true });
this.$refs.table.doRequest(({ where, order }) => {
exportTopicEnroll({ ...where, ...order })
.then((data) => {
loading.close();
const array = [data.columns];
data.list.forEach((d) => {
let arrayItem = [];
for (let key in d) {
arrayItem.push(d[key]);
}
array.push(arrayItem);
});
writeFile(
{
SheetNames: ['Sheet1'],
Sheets: {
Sheet1: utils.aoa_to_sheet(array)
}
},
this.title + '.xlsx'
);
})
.catch((e) => {
loading.close();
this.$message.error(e.message);
});
});
}
}
};
</script>
@@ -0,0 +1,156 @@
<template>
<ele-modal
width="800px"
:visible="visible"
:append-to-body="true"
:close-on-click-modal="true"
custom-class="ele-dialog-form"
:title="isUpdate ? '修改模块' : '添加模块'"
@update:visible="updateVisible"
>
<el-form ref="form" :model="form" :rules="rules" label-width="82px">
<el-form-item label="模块名称:" prop="title">
<el-input
clearable
:maxlength="60"
v-model="form.title"
placeholder="请输入模块名称"
/>
</el-form-item>
<el-form-item label="类型:" prop="type">
<el-radio-group
v-model="form.type"
:disabled="isUpdate"
style="line-height: 30px"
>
<el-radio
:label="parseInt(item.key)"
v-for="(item, key) in types"
:key="key"
>
{{ item.value }}
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="排序值:" prop="sort">
<el-input
clearable
:maxlength="60"
v-model="form.sort"
type="number"
placeholder="请输入排序值"
/>
<div class="ele-text-secondary"> 数值越大越靠前面 </div>
</el-form-item>
</el-form>
<template v-slot:footer>
<el-button @click="updateVisible(false)">取消</el-button>
<el-button type="primary" :loading="loading" @click="save">
保存
</el-button>
</template>
</ele-modal>
</template>
<script>
import { addTopicModule, updateTopicModule } from '@/api/sytopic/module';
export default {
components: {},
props: {
// 弹窗是否打开
visible: Boolean,
// 全部机构
types: Object,
// 修改回显的数据
data: Object,
topicId: String
},
data() {
const defaultForm = {
id: null,
title: '',
type: 1,
sort: 0,
topicId: this.topicId
};
return {
editVersion: false,
defaultForm,
// 表单数据
form: { ...defaultForm },
// 表单验证规则
rules: {
title: [
{
required: true,
message: '请输入活动标题',
trigger: 'blur'
}
]
},
// 提交状态
loading: false,
// 是否是修改
isUpdate: false
};
},
computed: {
// 是否开启响应式布局
styleResponsive() {
return this.$store.state.theme.styleResponsive;
}
},
methods: {
/* 保存编辑 */
save() {
this.$refs.form.validate((valid) => {
if (!valid) {
return false;
}
this.loading = true;
const data = {
...this.form
};
const saveOrUpdate = this.isUpdate
? updateTopicModule
: addTopicModule;
saveOrUpdate(data)
.then((msg) => {
this.loading = false;
this.$message.success(msg);
this.updateVisible(false);
this.$emit('done');
})
.catch((e) => {
this.loading = false;
this.$message.error(e.message);
});
});
},
/* 更新visible */
updateVisible(value) {
this.$emit('update:visible', value);
}
},
watch: {
visible(visible) {
this.editVersion = false;
if (visible) {
this.editVersion = true;
if (this.data.id) {
this.$util.assignObject(this.form, {
...this.data
});
this.isUpdate = true;
} else {
this.isUpdate = false;
}
} else {
this.$refs.form.clearValidate();
this.form = { ...this.defaultForm };
}
}
}
};
</script>
<style></style>
@@ -0,0 +1,354 @@
<template>
<ele-modal
width="800px"
:visible="visible"
:append-to-body="true"
:close-on-click-modal="true"
custom-class="ele-dialog-form"
title="添加模块配置"
@update:visible="updateVisible"
>
<el-container>
<el-aside width="150px">
<div
style="margin-top: 5px; width: 150px"
v-for="(item, key) in modelList"
:key="key"
>
<el-tag
:effect="selected === item.id ? 'dark' : 'plain'"
closable
class="tag-custom"
@close="handleClose(item)"
@click="showOption(item)"
>{{ item.title }}
</el-tag>
</div>
<el-button
:type="selected === 0 ? 'primary' : ''"
icon="el-icon-plus"
class="ele-btn-icon"
style="margin-top: 5px"
size="mini"
@click="addItem"
>
新增
</el-button>
</el-aside>
<el-container>
<el-form ref="form" :model="form" :rules="rules" label-width="82px">
<el-form-item label="标题:" prop="title">
<el-input
clearable
:maxlength="60"
v-model="form.title"
placeholder="请输入标题"
/>
</el-form-item>
<template v-if="moduleType !== 9">
<el-form-item
:label="moduleType === 8 ? '价格:' : '副标题:'"
prop="subTitle"
v-if="moduleType !== 1 && moduleType !== 3 && moduleType !== 6"
>
<el-input
clearable
:maxlength="60"
v-model="form.subTitle"
:placeholder="'请输入' + [moduleType === 8 ? '价格' : '副标题']"
/>
</el-form-item>
<el-form-item
label="跳转地址:"
prop="targetUrl"
v-if="moduleType === 1 || moduleType === 3"
>
<el-input
clearable
v-model="form.targetUrl"
placeholder="请输入跳转地址"
/>
</el-form-item>
<el-form-item label="主图:" prop="banner">
<upload-img v-model="form.banner" :images="form.banner" />
</el-form-item>
<template
v-if="moduleType !== 1 && moduleType !== 3 && moduleType !== 7"
>
<el-form-item
label="副图:"
v-if="moduleType !== 6 && moduleType !== 8 && moduleType !== 4"
>
<upload-img
v-model="form.otherImg"
:images="form.otherImg"
:limit="5"
:multiple="true"
/>
</el-form-item>
<template v-if="moduleType === 4">
<el-form-item label="优惠标题:">
<el-input
clearable
v-model="form.jsondata.dis_title"
placeholder="请输入优惠标题"
/>
</el-form-item>
<el-form-item label="优惠金额:">
<el-input
type="number"
clearable
v-model="form.jsondata.dis_money"
placeholder="请输入优惠金额"
/>
</el-form-item>
</template>
<el-form-item
label="报名:"
prop="showBtn"
v-if="moduleType !== 6"
>
<el-radio-group v-model="form.showBtn">
<el-radio label="0" key="0"></el-radio>
<el-radio label="1" key="1"></el-radio>
</el-radio-group>
</el-form-item>
<template v-if="form.showBtn === '1' && moduleType !== 6">
<el-form-item label="报名文案:" prop="btnText">
<el-input
clearable
:maxlength="60"
v-model="form.btnText"
placeholder="请输入报名文案"
/>
</el-form-item>
<el-form-item label="弹窗类型:" prop="popUpType">
<el-radio-group v-model="form.popUpType">
<el-radio label="0" key="0">居中</el-radio>
<el-radio label="1" key="1">底部</el-radio>
</el-radio-group>
</el-form-item>
<!--特惠报名-->
<template v-if="moduleType === 2 || moduleType === 8">
<el-form-item
label="人数限制:"
prop="btnText"
v-if="moduleType === 2"
>
<el-input
clearable
:maxlength="50"
v-model="form.enrollLimit"
placeholder=""
type="number"
/>
<div class="ele-text-secondary"> 0不限制 </div>
</el-form-item>
<el-form-item label="报名截止:" prop="btnText">
<el-date-picker
v-model="form.enrollEndTime"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
class="ele-fluid"
/>
<div class="ele-text-secondary"> </div>
</el-form-item>
</template>
</template>
<template v-if="moduleType === 6">
<el-form-item label="显示时间标题:" prop="showBtn">
<el-radio-group v-model="form.showBtn">
<el-radio label="0" key="0"></el-radio>
<el-radio label="1" key="1"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="文章内容:">
<tinymce-editor
:init="editoption"
v-model="form.introduction"
placeholder="请输入文章内容"
/>
</el-form-item>
</template>
<template v-else>
<el-form-item label="优惠信息:">
<el-input
clearable
:maxlength="50"
v-model="form.introduction"
placeholder=""
type="textarea"
/>
</el-form-item>
</template>
</template>
</template>
</el-form>
</el-container>
</el-container>
<template v-slot:footer>
<el-button @click="updateVisible(false)">取消</el-button>
<el-button type="primary" :loading="loading" @click="save">
保存
</el-button>
</template>
</ele-modal>
</template>
<script>
import {
addTopicModuleOptions,
updateTopicModule,
pageSyTopicModuleOptions,
removeTopicModuleOption
} from '@/api/sytopic/module';
import UploadImg from '@/components/UploadImg/index.vue';
import TinymceEditor from '@/components/TinymceEditor/index.vue';
export default {
components: { TinymceEditor, UploadImg },
props: {
// 弹窗是否打开
visible: Boolean,
moduleId: String,
moduleType: Number
},
data() {
const defaultForm = {
id: 0,
title: '',
subTitle: '',
banner: [],
otherImg: [],
introduction: '',
showBtn: '1',
btnText: '',
popUpType: '0',
targetUrl: '',
enrollLimit: 0,
enrollEndTime: '',
jsondata: {}
};
return {
editVersion: false,
editoption: {
height: 300,
toolbar: [
'code | forecolor backcolor bold italic underline strikethrough link anchor | alignleft aligncenter alignright alignjustify outdent indent | fontsizeselect | bullist numlist | \
table emoticons hr preview | fullscreen | bdmap indent2em lineheight formatpainter axupimgs| image emoticons hr '
]
},
defaultForm,
// 表单数据
form: { ...defaultForm },
// 表单验证规则
rules: {
title: [
{
required: true,
message: '请输入标题',
trigger: 'blur'
}
]
},
// 提交状态
loading: false,
// 是否是修改
isUpdate: false,
modelList: [],
selected: 0
};
},
computed: {
// 是否开启响应式布局
styleResponsive() {
return this.$store.state.theme.styleResponsive;
}
},
methods: {
modelOptions() {
pageSyTopicModuleOptions({ moduleId: this.moduleId })
.then((data) => {
this.modelList = data.lists;
})
.catch((e) => {
this.$message.error(e.message);
});
},
/* 保存编辑 */
save() {
this.$refs.form.validate((valid) => {
if (!valid) {
return false;
}
this.loading = true;
const data = {
...this.form,
moduleId: this.moduleId
};
const saveOrUpdate = this.isUpdate
? updateTopicModule
: addTopicModuleOptions;
saveOrUpdate(data)
.then((msg) => {
this.loading = false;
this.$message.success(msg);
this.modelList = [];
// this.selected = 0;
this.modelOptions();
// this.addItem();
// this.updateVisible(false);
// this.$emit('done');
})
.catch((e) => {
this.loading = false;
this.$message.error(e.message);
});
});
},
/* 更新visible */
updateVisible(value) {
this.$emit('update:visible', value);
},
handleClose(item) {
this.$confirm('确定要删除【' + item.title + '】吗?', '提示', {
type: 'warning'
})
.then(() => {
const loading = this.$loading({ lock: true });
removeTopicModuleOption(item.id)
.then((msg) => {
loading.close();
this.$message.success(msg);
this.modelOptions();
})
.catch((e) => {
loading.close();
this.$message.error(e.message);
});
})
.catch(() => {});
},
showOption(item) {
this.selected = item.id;
this.$util.assignObject(this.form, {
...item
});
console.log(this.form);
},
addItem() {
this.selected = 0;
this.$refs.form.clearValidate();
this.form = { ...this.defaultForm };
}
},
watch: {
visible() {
this.editVersion = false;
this.selected = 0;
this.form = { ...this.defaultForm };
this.modelOptions();
}
}
};
</script>
<style scoped></style>
@@ -0,0 +1,142 @@
<!-- 用户编辑弹窗 -->
<template>
<ele-modal
width="700px"
:visible="visible"
:append-to-body="true"
:close-on-click-modal="true"
custom-class="ele-dialog-form"
title="链接"
@update:visible="updateVisible"
>
<table
class="ele-table ele-table-border ele-table-medium"
style="margin-bottom: 20px"
>
<colgroup>
<col />
<col />
</colgroup>
<thead>
<tr>
<th>名称</th>
<th style="text-align: center">链接</th>
</tr>
</thead>
<tbody>
<tr>
<td>活动链接</td>
<td style="text-align: center">
<div
style="display: inline-block; margin-right: 10px"
class="ele-text-secondary"
v-html="form.url"
></div>
<el-button
v-clipboard:copy="form.url"
v-clipboard:success="onCopy"
size="small"
>
复制
</el-button>
</td>
</tr>
<tr>
<td>二维码图片</td>
<td style="text-align: center">
<ele-qr-code
:value="form.url"
:size="160"
:image-settings="image"
/>
<div class="ele-text-secondary">鼠标右建可复制保存</div>
</td>
</tr>
</tbody>
</table>
</ele-modal>
</template>
<script>
import EleQrCode from 'ele-admin/es/ele-qr-code';
import { getTopicDetail } from '@/api/sytopic/sytopic';
export default {
components: { EleQrCode },
props: {
// 弹窗是否打开
visible: Boolean,
topicId: String
},
data() {
const defaultForm = {
url: ''
};
return {
level: 'L',
size: 120,
margin: 0,
image: {
src: '',
width: 28,
height: 28,
x: undefined,
y: undefined,
excavate: false
},
defaultForm,
// 表单数据
form: { ...defaultForm },
// 表单验证规则
// 提交状态
loading: false
};
},
created() {
let hostname = window.location.hostname;
if (hostname == 'bo.liche.cn') {
this.image.src =
'https://qs.haodian.cn/web/images/project/Admin-ShiYu/code-logo.png';
} else if (hostname == 'dongfeng.haodian.cn') {
this.image.src =
'https://qs.haodian.cn/web/images/project/Admin-ShiYu/df-code-logo.png';
} else {
this.image.src =
'https://qs.haodian.cn/web/images/project/Admin-ShiYu/code-logo.png';
}
},
computed: {
// 是否开启响应式布局
styleResponsive() {
return this.$store.state.theme.styleResponsive;
}
},
methods: {
/* 更新visible */
updateVisible(value) {
this.$emit('update:visible', value);
},
onCopy: function () {
this.$message.success('复制成功!');
}
},
watch: {
visible(visible) {
if (visible) {
if (this.topicId) {
getTopicDetail({ id: this.topicId })
.then((result) => {
this.form.url = result.url;
})
.catch((e) => {
this.$message.error(e.message);
});
// this.$util.assignObject(this.form, {
// ...this.data
// });
}
}
}
}
};
</script>
+298
View File
@@ -0,0 +1,298 @@
<template>
<div class="ele-body">
<el-card shadow="never">
<!-- 搜索表单 -->
<el-card shadow="never"> {{ title }}-模块配置 </el-card>
<!-- 数据表格 -->
<ele-pro-table
ref="table"
:columns="columns"
:datasource="datasource"
:selection.sync="selection"
cache-key="systemMembersTable"
>
<!-- 表头工具栏 -->
<template v-slot:toolbar>
<el-button
size="small"
type="primary"
icon="el-icon-plus"
class="ele-btn-icon"
@click="openEdit({})"
>
新建
</el-button>
<el-button
size="small"
type="danger"
icon="el-icon-delete"
class="ele-btn-icon"
@click="removeBatch"
>
删除
</el-button>
<el-button
size="small"
type="success"
icon="el-icon-delete"
class="ele-btn-icon"
@click="showQrCode"
>
活动链接
</el-button>
</template>
<!-- 状态列 -->
<template v-slot:options="{ row }">
{{ row.options }}
</template>
<!-- 操作列 -->
<template v-slot:action="{ row }">
<el-link
type="primary"
:underline="false"
icon="el-icon-edit"
@click="openEditOption(row)"
>
内容配置
</el-link>
<el-link
type="primary"
:underline="false"
icon="el-icon-edit"
@click="openEdit(row)"
>
修改
</el-link>
<el-popconfirm
class="ele-action"
title="确定要删除此模块吗?"
@confirm="remove(row)"
>
<template v-slot:reference>
<el-link type="danger" :underline="false" icon="el-icon-delete">
删除
</el-link>
</template>
</el-popconfirm>
<el-link
type="primary"
:underline="false"
icon="el-icon-edit"
@click="updateStatus(row)"
>
{{ row.status === '1' ? '显示' : '隐藏' }}
</el-link>
</template>
</ele-pro-table>
</el-card>
<!-- 编辑弹窗 -->
<module-edit
:data="current"
:visible.sync="showEdit"
:types="types"
:topic-id="topicId"
@done="reload"
/>
<module-option-edit
:visible.sync="showEditOption"
:module-id="current.id"
:module-type="current.type"
@done="reload"
/>
<!--二维码-->
<qr-code :visible.sync="showQr" :topic-id="topicId" />
</div>
</template>
<script>
import {
pageSyTopicModule,
pageTopicModuleTypes,
removeTopicModule,
updateTopicModuleStatus
} from '@/api/sytopic/module';
import ModuleEdit from './components/module-edit.vue';
import ModuleOptionEdit from './components/module-option-edit.vue';
import QrCode from './components/qr-code.vue';
export default {
name: 'SyModule',
components: { ModuleEdit, ModuleOptionEdit, QrCode },
data() {
return {
where: {},
organizationList: [],
// 表格列配置
columns: [
{
columnKey: 'selection',
type: 'selection',
width: 45,
align: 'center'
},
{
prop: 'id',
label: 'ID',
minWidth: 45,
align: 'center',
showOverflowTooltip: true,
fixed: 'left'
},
{
prop: 'title',
label: '模块名称',
showOverflowTooltip: true,
minWidth: 80
},
{
prop: 'type_cn',
label: '模块类型',
showOverflowTooltip: true,
minWidth: 80
},
{
prop: 'sort',
label: '排序',
sortable: 'custom',
showOverflowTooltip: true,
width: 130
},
{
prop: 'options',
label: '内容数',
align: 'center',
width: 130,
resizable: false,
slot: 'options'
},
{
columnKey: 'action',
label: '操作',
width: 300,
align: 'center',
resizable: false,
slot: 'action',
showOverflowTooltip: true
}
],
// 表格选中数据
selection: [],
// 当前编辑数据
current: {},
// 是否显示编辑弹窗
showEdit: false,
topicId: '0',
title: '',
types: {},
showEditOption: false,
//是否显示二维码
showQr: false
};
},
created() {
this.topicId = this.$route.query.id;
this.title = this.$route.query.title;
this.getTypes();
},
methods: {
getTypes() {
pageTopicModuleTypes({})
.then((res) => {
this.types = res.list;
})
.catch((e) => {
this.$message.error(e.message);
});
},
/* 表格数据源 */
datasource({ page, limit, where, order }) {
return pageSyTopicModule({
...where,
...order,
page,
limit,
topicId: this.topicId
});
},
/* 刷新表格 */
reload() {
this.$refs.table.reload({ page: 1, where: this.where });
},
/* 打开编辑弹窗 */
openEdit(row) {
this.current = row;
this.showEdit = true;
},
openEditOption(row) {
this.current = row;
this.showEditOption = true;
},
/* 删除 */
remove(row) {
const loading = this.$loading({ lock: true });
removeTopicModule(row.id)
.then((msg) => {
loading.close();
this.$message.success(msg);
this.reload();
})
.catch((e) => {
loading.close();
this.$message.error(e.message);
});
},
/* 批量删除 */
removeBatch() {
if (!this.selection.length) {
this.$message.error('请至少选择一条数据');
return;
}
this.$confirm('确定要删除选中的模块吗?', '提示', {
type: 'warning'
})
.then(() => {
const loading = this.$loading({ lock: true });
removeTopicModule(this.selection.map((d) => d.userId))
.then((msg) => {
loading.close();
this.$message.success(msg);
this.reload();
})
.catch((e) => {
loading.close();
this.$message.error(e.message);
});
})
.catch(() => {});
},
showQrCode() {
this.showQr = true;
},
updateStatus(row) {
console.log(row);
let status = 1;
if (row.status === '1') {
status = 0;
}
updateTopicModuleStatus({ id: row.id, status: status })
.then((msg) => {
this.$message.success(msg);
this.reload();
})
.catch((e) => {
this.$message.error(e.message);
});
}
},
watch: {
$route: {
handler: function (route) {
this.topicId = route.query.id;
this.title = route.query.title;
this.reload();
},
deep: true
}
}
};
</script>
@@ -0,0 +1,486 @@
<!-- 用户编辑弹窗 -->
<template>
<ele-modal
width="800px"
:visible="visible"
:append-to-body="true"
:close-on-click-modal="true"
custom-class="ele-dialog-form"
:title="isUpdate ? '修改活动' : '添加活动'"
@update:visible="updateVisible"
>
<el-form ref="form" :model="form" :rules="rules" label-width="82px">
<el-form-item label="活动标题:" prop="title">
<el-input
clearable
:maxlength="60"
v-model="form.title"
placeholder="请输入活动标题"
/>
</el-form-item>
<el-form-item label="所属机构:" prop="organizationId">
<el-select
v-model="form.organizationId"
placeholder="请选择所属机构"
class="ele-fluid"
>
<el-option
v-for="item in organizationList"
:key="item.organizationId"
:label="item.organizationName"
:value="item.organizationId"
/>
</el-select>
</el-form-item>
<el-form-item label="活动时间:" prop="dateRange">
<el-date-picker
v-model="form.dateRange"
type="datetimerange"
unlink-panels
range-separator=""
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd HH:mm:ss"
class="ele-fluid"
/>
</el-form-item>
<el-form-item label="入口图:" prop="banner">
<upload-img v-model="form.banner" :images="form.banner" />
<div class="ele-text-secondary">建议尺寸690*230</div>
</el-form-item>
<el-form-item label="banner:" prop="banner">
<upload-img v-model="form.json.banner" :images="form.json.banner" />
<div class="ele-text-secondary">建议宽度750</div>
</el-form-item>
<el-form-item label="底部图片:">
<upload-img
v-model="form.json.bottom_img"
:images="form.json.bottom_img"
/>
<div class="ele-text-secondary">建议宽度750</div>
</el-form-item>
<el-form-item label="分享图片:" prop="sharePhoto">
<upload-img v-model="form.sharePhoto" :images="form.sharePhoto" />
<div class="ele-text-secondary">建议尺寸200X200</div>
</el-form-item>
<el-form-item label="分享海报:" prop="shareImg">
<upload-img
v-model="form.shareImg"
:images="form.shareImg"
:limit="10"
:multiple="true"
/>
<div class="ele-text-secondary">
尺寸宽度750二维码尺寸160X160二维码位置距离底部80,距离右边40
</div>
</el-form-item>
<el-form-item label="分享文案:" prop="shareTitle">
<div
style="margin: 8px 0"
v-for="(item, index) in form.shareTitle"
:key="index"
>
<el-input
clearable
:maxlength="60"
v-model="form.shareTitle[index]"
placeholder="请输入分享文案"
/>
</div>
<!--
<el-button
type="primary"
plain
size="small"
icon="el-icon-plus"
@click="addShareTitle"
>
新增分享文案
</el-button>
-->
</el-form-item>
<el-form-item label="背景色:">
<el-input
clearable
v-model="form.json.bg_color"
placeholder="请输入背景色"
/>
<div class="ele-text-secondary">例如#fff</div>
</el-form-item>
<el-form-item label="底部报名:">
<el-radio v-model="form.json.button_type" label="">不显示</el-radio>
<el-radio v-model="form.json.button_type" label="1">团员</el-radio>
<el-radio v-model="form.json.button_type" label="2">优惠</el-radio>
</el-form-item>
<el-form-item label="活动简介:">
<tinymce-editor
:init="editoption"
v-model="form.introduction"
placeholder="请输入活动简介"
/>
</el-form-item>
</el-form>
<template v-slot:footer>
<el-button @click="updateVisible(false)">取消</el-button>
<el-button type="primary" :loading="loading" @click="save">
保存
</el-button>
</template>
</ele-modal>
</template>
<script>
import request from '@/utils/request';
import { addTopic, updateTopic } from '@/api/sytopic/sytopic';
import TinymceEditor from '@/components/TinymceEditor/index.vue';
import UploadImg from '@/components/UploadImg/index.vue';
export default {
components: {
TinymceEditor,
UploadImg
},
props: {
// 弹窗是否打开
visible: Boolean,
// 全部机构
organizationList: Array,
// 修改回显的数据
data: Object
},
data() {
const defaultForm = {
id: null,
title: '',
dateRange: '',
shareTitle: [''],
shareImg: [],
introduction: '',
banner: [],
sharePhoto: [],
organizationId: null,
json: {
banner: [],
bg_color: '',
button_type: '',
bottom_img: []
}
};
return {
editVersion: false,
editoption: {
height: 300,
toolbar: [
'code | forecolor backcolor bold italic underline strikethrough link anchor | alignleft aligncenter alignright alignjustify outdent indent | fontsizeselect | bullist numlist | \
table emoticons hr preview | fullscreen | bdmap indent2em lineheight formatpainter axupimgs| image emoticons hr '
]
},
defaultForm,
// 表单数据
form: { ...defaultForm },
// 表单验证规则
rules: {
title: [
{
required: true,
message: '请输入活动标题',
trigger: 'blur'
}
],
organizationId: [
{
required: true,
message: '请选择所属机构',
trigger: 'blur'
}
],
banner: [
{
required: true,
message: '请上传入口图',
trigger: 'blur'
}
],
dateRange: [
{
required: true,
message: '请选择活动时间',
trigger: 'blur'
}
]
},
// 提交状态
loading: false,
// 是否是修改
isUpdate: false
};
},
computed: {
// 是否开启响应式布局
styleResponsive() {
return this.$store.state.theme.styleResponsive;
}
},
methods: {
/* 添加海报描述 */
addShareTitle() {
this.form.shareTitle.push('');
},
/* 保存编辑 */
save() {
this.$refs.form.validate((valid) => {
if (!valid) {
return false;
}
this.form.shareTitle.forEach((item, i) => {
if (item == '') {
this.form.shareTitle.splice(i, 1);
}
});
this.loading = true;
const data = {
...this.form
};
const saveOrUpdate = this.isUpdate ? updateTopic : addTopic;
saveOrUpdate(data)
.then((msg) => {
this.loading = false;
this.$message.success(msg);
this.updateVisible(false);
this.$emit('done');
})
.catch((e) => {
this.loading = false;
this.$message.error(e.message);
});
});
},
/* 更新visible */
updateVisible(value) {
this.$emit('update:visible', value);
},
/* 上传事件 */
bgImgHandler(file) {
const item = {
file,
uid: file.uid,
name: file.name,
progress: 0,
status: null
};
if (!file.type.startsWith('image')) {
this.$message.error('只能选择图片');
return;
}
if (file.size / 1024 / 1024 > 2) {
this.$message.error('大小不能超过 2MB');
return;
}
item.url = window.URL.createObjectURL(file);
// 关键就是这里要自己 push 添加数据而不是靠 v-modal 自动更新
this.form.bgImg.push(item);
this.onUpload(item);
},
payImgHandler(file) {
const item = {
file,
uid: file.uid,
name: file.name,
progress: 0,
status: null
};
if (!file.type.startsWith('image')) {
this.$message.error('只能选择图片');
return;
}
if (file.size / 1024 / 1024 > 2) {
this.$message.error('大小不能超过 2MB');
return;
}
item.url = window.URL.createObjectURL(file);
// 关键就是这里要自己 push 添加数据而不是靠 v-modal 自动更新
this.form.pay.img.push(item);
this.onUpload(item);
},
bannerHandler(file) {
const item = {
file,
uid: file.uid,
name: file.name,
progress: 0,
status: null
};
if (!file.type.startsWith('image')) {
this.$message.error('只能选择图片');
return;
}
if (file.size / 1024 / 1024 > 2) {
this.$message.error('大小不能超过 2MB');
return;
}
item.url = window.URL.createObjectURL(file);
// 关键就是这里要自己 push 添加数据而不是靠 v-modal 自动更新
this.form.banner.push(item);
this.onUpload(item);
},
sharePhotoHandler(file) {
const item = {
file,
uid: file.uid,
name: file.name,
progress: 0,
status: null
};
if (!file.type.startsWith('image')) {
this.$message.error('只能选择图片');
return;
}
if (file.size / 1024 / 1024 > 2) {
this.$message.error('大小不能超过 2MB');
return;
}
item.url = window.URL.createObjectURL(file);
// 关键就是这里要自己 push 添加数据而不是靠 v-modal 自动更新
this.form.sharePhoto.push(item);
this.onUpload(item);
},
shareImgHandler(file) {
const item = {
file,
uid: file.uid,
name: file.name,
progress: 0,
status: null
};
if (!file.type.startsWith('image')) {
this.$message.error('只能选择图片');
return;
}
if (file.size / 1024 / 1024 > 2) {
this.$message.error('大小不能超过 2MB');
return;
}
item.url = window.URL.createObjectURL(file);
// 关键就是这里要自己 push 添加数据而不是靠 v-modal 自动更新
this.form.shareImg.push(item);
this.onUpload(item);
},
/* 添加 */
addBottoms() {
if (this.form.bottoms.length >= 2) {
this.$message.error('最多添加2个活动底部菜单');
return;
}
this.form.bottoms.push({
urlType: 'link',
title: '',
url: '',
miniProgramId: '',
icon: []
});
},
/* 删除 */
removeBottoms(_row, index) {
this.form.bottoms.splice(index, 1);
},
uploadHandler0(file) {
const item = {
file,
uid: file.uid,
name: file.name,
progress: 0,
status: null
};
if (!file.type.startsWith('image')) {
this.$message.error('只能选择图片');
return;
}
if (file.size / 1024 / 1024 > 2) {
this.$message.error('大小不能超过 2MB');
return;
}
item.url = window.URL.createObjectURL(file);
// 关键就是这里要自己 push 添加数据而不是靠 v-modal 自动更新
this.form.bottoms[0]['icon'].push(item);
this.onUpload(item);
},
uploadHandler1(file) {
const item = {
file,
uid: file.uid,
name: file.name,
progress: 0,
status: null
};
if (!file.type.startsWith('image')) {
this.$message.error('只能选择图片');
return;
}
if (file.size / 1024 / 1024 > 2) {
this.$message.error('大小不能超过 2MB');
return;
}
item.url = window.URL.createObjectURL(file);
// 关键就是这里要自己 push 添加数据而不是靠 v-modal 自动更新
this.form.bottoms[1]['icon'].push(item);
this.onUpload(item);
},
/* 上传 item */
onUpload(item) {
item.status = 'uploading';
const formData = new FormData();
formData.append('file', item.file);
request({
url: '/upload',
method: 'post',
data: formData,
onUploadProgress: (e) => {
if (e.lengthComputable) {
item.progress = (e.loaded / e.total) * 100;
}
}
})
.then((res) => {
if (res.data.code === 0) {
item.status = 'done';
item.url = res.data.data.full_url;
item.fileUrl = res.data.data.url;
}
})
.catch(() => {
item.status = 'exception';
});
}
},
watch: {
visible(visible) {
this.editVersion = false;
if (visible) {
this.editVersion = true;
if (this.data) {
this.$util.assignObject(this.form, {
...this.data
});
this.isUpdate = true;
if (this.form.shareTitle.length == 0) {
this.form.shareTitle.push('');
}
} else {
this.form.bottoms = [];
this.form.bgImg = [];
this.form.shareImg = [];
this.isUpdate = false;
}
} else {
this.$refs.form.clearValidate();
this.form = { ...this.defaultForm };
}
}
}
};
</script>
<style>
.ele-image-upload-list .ele-image-upload-item {
margin-top: 2px;
margin-bottom: 2px;
}
</style>
+312
View File
@@ -0,0 +1,312 @@
<template>
<div class="ele-body">
<el-card shadow="never">
<!-- 搜索表单 -->
<el-form label-width="77px" class="ele-form-search">
<el-row :gutter="15">
<el-col :md="6" :sm="12">
<el-form-item label="专题标题:">
<el-input
placeholder="请输入专题标题"
clearable
v-model="where.title"
/>
</el-form-item>
</el-col>
<el-col :md="6" :sm="12">
<div class="ele-form-actions">
<el-button
type="primary"
icon="el-icon-search"
class="ele-btn-icon"
@click="reload"
>
查询
</el-button>
<el-button @click="reset">重置</el-button>
</div>
</el-col>
</el-row>
</el-form>
<!-- 数据表格 -->
<ele-pro-table
ref="table"
:columns="columns"
:datasource="datasource"
:selection.sync="selection"
cache-key="syliveActivityTable"
>
<!-- 表头工具栏 -->
<template v-slot:toolbar>
<el-button
size="small"
type="primary"
icon="el-icon-plus"
class="ele-btn-icon"
@click="dropClick('activity')"
>
新建
</el-button>
<el-button
size="small"
type="danger"
icon="el-icon-delete"
class="ele-btn-icon"
@click="removeBatch"
>
删除
</el-button>
</template>
<!-- 状态列 -->
<template v-slot:status="{ row }">
<el-switch
:active-value="0"
:inactive-value="1"
v-model="row.status"
@change="editStatus(row)"
/>
</template>
<!-- 操作列 -->
<template v-slot:action="{ row }">
<!--
<el-dropdown @command="(command) => dropMore(command, row)">
<el-link type="primary" :underline="false" icon="el-icon-_share">
更多
<i class="el-icon-arrow-down"></i>
</el-link>
<template v-slot:dropdown>
<el-dropdown-menu>
<el-dropdown-item command="enroll">报名列表</el-dropdown-item>
<el-dropdown-item command="code">活动链接</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
-->
<el-dropdown @command="(command) => dropClick(command, row)">
<el-link type="primary" :underline="false" icon="el-icon-edit">
修改
<i class="el-icon-arrow-down"></i>
</el-link>
<template v-slot:dropdown>
<el-dropdown-menu>
<el-dropdown-item command="activity">修改专题</el-dropdown-item>
<el-dropdown-item command="module">模块配置</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
<el-popconfirm
class="ele-action"
title="确定要删除此活动吗?"
@confirm="remove(row)"
>
<template v-slot:reference>
<el-link type="danger" :underline="false" icon="el-icon-delete">
删除
</el-link>
</template>
</el-popconfirm>
</template>
</ele-pro-table>
</el-card>
<!-- 编辑弹窗 -->
<sytopic-edit
:data="current"
:visible.sync="showEdit"
:organization-list="organizationList"
@done="reload"
/>
</div>
</template>
<script>
import {
pageSyTopic,
removeTopic,
updateTopicStatus
} from '@/api/sytopic/sytopic';
import { listOrganizationParent } from '@/api/institution/organization';
import SytopicEdit from './components/sytopic-edit.vue';
export default {
name: 'syTopic',
components: { SytopicEdit },
data() {
return {
where: {
title: ''
},
// 门店数据
organizationList: [],
// 表格列配置
columns: [
{
columnKey: 'selection',
type: 'selection',
width: 45,
align: 'center',
fixed: 'left'
},
{
prop: 'id',
label: 'ID',
minWidth: 40,
align: 'center',
showOverflowTooltip: true,
fixed: 'left'
},
{
prop: 'title',
label: '标题',
showOverflowTooltip: true,
minWidth: 200
},
{
prop: 'createTime',
label: '创建时间',
sortable: 'custom',
showOverflowTooltip: true,
minWidth: 90,
formatter: (_row, _column, cellValue) => {
return this.$util.toDateString(cellValue);
}
},
{
prop: 'status',
label: '状态',
align: 'center',
width: 80,
resizable: false,
slot: 'status',
showOverflowTooltip: true
},
{
columnKey: 'action',
label: '操作',
width: 380,
align: 'center',
resizable: false,
slot: 'action'
}
],
// 表格选中数据
selection: [],
// 当前编辑数据
current: null,
// 是否显示编辑弹窗
showEdit: false,
// 是否显示编辑商品弹窗
showEditItem: false,
// 是否显示编辑券弹窗
showEditCoupon: false,
// 是否显示编辑券弹窗
showEditDraw: false,
showEditVisitTag: false,
// 是否显示二维码弹窗
showCode: false
};
},
created() {
//this.organizationQuery();
},
methods: {
/* 下拉按钮点击 */
dropClick(command, row) {
if (command === 'activity') {
this.current = row;
this.showEdit = true;
} else if (command === 'module') {
this.$router.replace(
'/sytopic/module?id=' + row.id + '&title=' + row.title
);
}
},
/* 打开更多页 */
dropMore(command, row) {
if (command === 'enroll') {
this.$message.info('开发中');
} else if (command === 'code') {
this.$message.info('开发中');
this.current = row;
this.showCode = true;
}
},
/* 查询机构 */
organizationQuery() {
listOrganizationParent({ parentId: 0 })
.then((list) => {
this.organizationList = list;
})
.catch((e) => {
this.$message.error(e.message);
});
},
/* 表格数据源 */
datasource({ page, limit, where, order }) {
if (page == 1) {
this.organizationQuery();
}
return pageSyTopic({ ...where, ...order, page, limit });
},
/* 刷新表格 */
reload() {
this.$refs.table.reload({ page: 1, where: this.where });
},
/* 删除 */
remove(row) {
const loading = this.$loading({ lock: true });
removeTopic(row.id)
.then((msg) => {
loading.close();
this.$message.success(msg);
this.reload();
})
.catch((e) => {
loading.close();
this.$message.error(e.message);
});
},
/* 批量删除 */
removeBatch() {
if (!this.selection.length) {
this.$message.error('请至少选择一条数据');
return;
}
this.$confirm('确定要删除选中的活动吗?', '提示', {
type: 'warning'
})
.then(() => {
const loading = this.$loading({ lock: true });
removeTopic(this.selection.map((d) => d.id))
.then((msg) => {
loading.close();
this.$message.success(msg);
this.reload();
})
.catch((e) => {
loading.close();
this.$message.error(e.message);
});
})
.catch(() => {});
},
/* 更改状态 */
editStatus(row) {
const loading = this.$loading({ lock: true });
updateTopicStatus(row.id, row.status)
.then((msg) => {
loading.close();
this.$message.success(msg);
})
.catch((e) => {
loading.close();
row.status = !row.status ? 1 : 0;
this.$message.error(e.message);
});
},
/* 充值搜索 */
reset() {
this.where = {};
}
}
};
</script>