Skip to content

P
project-road-admin
提交 0f3e8c1c authored 作者: lihuihui's avatar lihuihui
浏览文件
操作

update

上级 67608a78
显示空白字符变更
内嵌 并排
正在显示 包含 933 行增加 和 1536 行删除
src/modules/banner/api.js
浏览文件 @ 0f3e8c1c
......@@ -35,42 +35,16 @@ export function deleteBanner(data) {
return httpRequest.post('/api/road/v1/backend/banner/delete', data)
}
// /**
// * 获取应用列表
// */
// export function getAppList(params) {
// return httpRequest.get('/api/register/v1/activity/index', { params })
// }
// /**
// * 新建报名
// */
// export function createRegister(data) {
// return httpRequest.post('/api/register/v1/activity/create', data)
// }
// /**
// * 报名详情
// */
// export function getRegisterDetail(params) {
// return httpRequest.get('/api/register/v1/activity/view', { params })
// }
// /**
// * 更新报名
// */
// export function updateRegister(data) {
// return httpRequest.post('/api/register/v1/activity/update', data)
// }
/**
* 获取应用列表
*/
export function getEssayList(params) {
return httpRequest.get('/api/road/v1/backend/doc/list', { params })
}
// /**
// * 删除报名
// */
// export function deleteRegister(data) {
// return httpRequest.post('/api/register/v1/activity/delete', data)
// }
// /**
// * 停止活动
// */
// export function stopRegister(data) {
// return httpRequest.post('/api/register/v1/activity/drop', data)
// }
/**
* 获pages列表
*/
export function getPagesList(params) {
return httpRequest.get('/api/road/v1/backend/page/list', { params })
}
src/modules/banner/components/DisplayType.vue deleted 100644 → 0
浏览文件 @ 67608a78
<template>
<div>
<el-form :disabled="!!$route.query.type" ref="form" :rules="rules" :model="data" label-width="100px">
<el-form-item label="按钮文案：" prop="title">
<el-input v-model="data.title"></el-input>
</el-form-item>
<el-form-item label="页面展示：" prop="desc">
<v-editor :disabled="!!$route.query.type" v-model="data.desc"></v-editor>
</el-form-item>
</el-form>
</div>
</template>
<script>
import VEditor from '@/components/tinymce/Index.vue'
export default {
components: { VEditor },
props: {
data: { type: Object, default: () => {} }
},
data() {
return {
form: {
edit: '',
btnText: ''
},
rules: {
title: [{ required: true, message: '请填写按钮文案', trigger: 'change' }],
desc: [{ required: true, message: '请填写页面内容', trigger: 'change' }]
}
}
},
methods: {
submitForm() {
let flag = false
this.$refs.form.validate(valid => {
if (valid) {
flag = true
}
})
return flag
}
},
mounted() {
console.log(this.data, 'display')
}
}
</script>
<style lang="scss">
.tox-notifications-container {
display: none !important;
}
</style>
src/modules/banner/components/FormType.vue deleted 100644 → 0
浏览文件 @ 67608a78
<template>
<div class="form-box">
<el-form ref="form" :disabled="!!$route.query.type" :rules="rules" :model="data" size="mini" label-width="150px">
<div class="form-set-info">
<div class="sub-title">信息设置</div>
<el-checkbox-group v-model="checkList" @change="checkboxChange">
<div class="field-list" v-for="(item, index) in fieldList" :key="index">
<div class="field-list_title">{{ item.title }}</div>
<div class="field-list_content">
<el-checkbox
style="margin: 0 90px 10px 10px"
:disabled="cItem.disabled ? cItem.disabled : false"
:label="cItem.key"
v-for="cItem in item.fields"
:key="cItem.key"
>
<div class="checkbox">
{{ cItem.label }}&nbsp;&nbsp;&nbsp;必填：
<el-radio
@change="checkboxChange"
v-model="cItem.required"
:disabled="cItem.disabled ? cItem.disabled : false"
label="1"
>是</el-radio
>
<el-radio
@change="checkboxChange"
v-model="cItem.required"
:disabled="cItem.disabled ? cItem.disabled : false"
label="2"
>否</el-radio
>
</div>
</el-checkbox>
</div>
</div>
</el-checkbox-group>
</div>
<div class="form-set-pay">
<div class="sub-title">缴费设置</div>
<!--导入功能 新增 -->
<el-form-item label="批量导入功能:">
<el-radio v-model="data.can_import" :label="1">开启</el-radio>
<el-radio v-model="data.can_import" :label="0">关闭</el-radio>
</el-form-item>
<el-form-item label="缴费功能:">
<el-radio v-model="data.can_pay" :label="1">开启</el-radio>
<el-radio v-model="data.can_pay" :label="0">关闭</el-radio>
</el-form-item>
<template v-if="!!data.can_pay">
<el-form-item label="价格：" prop="pay_price">
<el-input style="width: 20%" v-model="data.pay_price"></el-input>
</el-form-item>
<el-form-item label="开票功能:">
<el-radio v-model="data.can_invoice" :label="1">开启</el-radio>
<el-radio v-model="data.can_invoice" :label="0">关闭</el-radio>
</el-form-item>
<!-- 缴费方式 新增-->
<el-form-item label="缴费方式:" prop="pay_type">
<el-select v-model="data.pay_type" multiple>
<el-option v-for="item in payType" :key="item.key" :label="item.value" :value="item.key"></el-option>
</el-select>
</el-form-item>
<el-form-item label="线下支付联系方式：" prop="offline_info" v-if="data.pay_type.includes('3')">
<el-input style="width: 20%" v-model="data.offline_info"></el-input>
</el-form-item>
<el-form-item label="线下支付信息：" prop="offline_more_info" v-if="data.pay_type.includes('3')">
<v-editor style="width: 500px" :maxHeight="200" :disabled="!!$route.query.type" v-model="data.offline_more_info"></v-editor>
</el-form-item>
<el-form-item label="单位优惠:">
<el-radio v-model="data.can_company" :label="1">开启</el-radio>
<el-radio v-model="data.can_company" :label="0">关闭</el-radio>
</el-form-item>
<el-form-item label="单位优惠金额:" prop="company_price" v-if="data.can_company">
<el-input style="width: 20%" v-model="data.company_price"></el-input>
</el-form-item>
<el-form-item label="跳转:">
<el-radio v-model="data.can_jump" :label="1">开启</el-radio>
<el-radio v-model="data.can_jump" :label="0">关闭</el-radio>
</el-form-item>
<template v-if="!!data.can_jump">
<el-form-item label="跳转链接:" prop="jump_url">
<el-input style="width: 20%" v-model="data.jump_url"></el-input>
</el-form-item>
</template>
<el-form-item label="跳过支付:">
<el-radio v-model="data.can_skip_pay" :label="1">开启</el-radio>
<el-radio v-model="data.can_skip_pay" :label="0">关闭</el-radio>
</el-form-item>
<el-form-item label="跳过文案:" prop="skip_pay_title" v-if="!!data.can_skip_pay">
<el-input style="width: 20%" v-model="data.skip_pay_title"></el-input>
</el-form-item>
<el-form-item label="支付平台:" prop="shop_id">
<el-select v-model="data.shop_id" placeholder="请选择">
<el-option v-for="item in shopMap" :key="item.key" :label="item.value" :value="item.key"> </el-option>
</el-select>
</el-form-item>
</template>
</div>
<div class="form-set-page">
<div class="sub-title">页面设置</div>
<el-form-item label="标题:" prop="title">
<el-input style="width: 20%" v-model="data.title"></el-input>
</el-form-item>
<el-form-item label="页面头部:" prop="desc">
<v-editor :disabled="!!$route.query.type" v-model="data.desc"></v-editor>
</el-form-item>
</div>
</el-form>
</div>
</template>
<script>
import VEditor from '@/components/tinymce/Index.vue'
export default {
components: { VEditor },
props: {
data: {
type: Object,
default: () => {}
}
},
data() {
return {
payType: [
{ key: '1', value: '微信' },
{ key: '2', value: '支付宝' },
{ key: '3', value: '线下支付' }
],
rules: {
title: { required: true, message: '请填写标题', trigger: 'blur' },
pay_price: [
{ required: true, message: '请填写支付金额', trigger: 'blur' },
{
trigger: 'blur',
min: 0,
validator(rule, value, callback) {
if (Number(value) > 0) {
callback()
} else {
callback(new Error('支付金额不能小于等于0元'))
}
}
}
],
jump_url: { required: true, message: '请填写跳转链接', trigger: 'blur' },
shop_id: { required: true, message: '请选择支付平台', trigger: 'change' },
skip_pay_title: { required: true, message: '请填写跳过支付文案', trigger: 'blur' },
pay_type: { required: true, message: '请填选择缴费方式', trigger: 'change' },
company_price: [
{ required: true, message: '请填写单位优惠金额', trigger: 'blur' },
{
trigger: 'blur',
min: 0,
validator(rule, value, callback) {
if (Number(value) > 0) {
callback()
} else {
callback(new Error('优惠金额不能小于等于0元'))
}
}
}
]
},
options: [],
checkList: [],
fieldList: [
{
title: '个人信息',
fields: [
{ key: 'name', label: '姓名', required: '1', disabled: true },
{ key: 'mobile', label: '电话', required: '1', disabled: true },
{ key: 'gender', label: '性别', required: '1' },
{ key: 'email', label: '邮箱', required: '1' },
{ key: 'company', label: '公司', required: '1' },
{ key: 'position', label: '职位', required: '1' },
{ key: 'number', label: '编号', required: '1' },
{ key: 'country', label: '国籍', required: '1' },
{ key: 'provinces', label: '省份', required: '1' },
{ key: 'city', label: '城市', required: '1' },
{ key: 'address', label: '地址', required: '1' },
{ key: 'fixed_telephone', label: '固话', required: '1' },
{ key: 'industry', label: '行业', required: '1' },
{ key: 'id_number', label: '身份证号码', required: '1' }
]
},
{
title: '社交信息',
fields: [
{ key: 'wechat', label: '微信', required: '1' },
{ key: 'qq', label: 'QQ', required: '1' },
{ key: 'ding', label: '钉钉', required: '1' },
{ key: 'weibo', label: '微博', required: '1' }
]
},
{
title: '入住信息',
fields: [
{ key: 'check_in_time', label: '入住时间', required: '1' },
{ key: 'check_out_time', label: '离店时间', required: '1' },
{ key: 'room_type', label: '房型', required: '1' },
{ key: 'breakfast', label: '早餐', required: '1' }
]
}
]
}
},
computed: {
shopMap() {
return this.$store.state.commonMap.details_shop_map
},
payTypeMap() {
return this.data.pay_type
}
},
created() {},
mounted() {
this.setInfoFields()
},
methods: {
// 信息设置数据回显
setInfoFields() {
this.fieldList = this.fieldList.reduce((a, b) => {
b.fields.map(item => {
const findData = this.data.user_fields.find(fData => fData.key === item.key)
if (findData) {
this.checkList.push(findData.key)
item.required = findData.required ? '1' : '2'
}
return item
})
a.push(b)
return a
}, [])
},
// 信息设置选择后 吧选择的编程后台需要的数据
checkboxChange() {
this.data.user_fields = this.fieldList.reduce((a, b) => {
b.fields.forEach(item => {
const findData = this.checkList.find(fData => fData === item.key)
if (findData) {
a.push({ key: item.key, required: !!(item.required === '1'), enable_edit: true })
}
})
return a
}, [])
this.data.pay_type = this.data.pay_type.toString()
},
submitForm() {
let flag = false
this.$refs.form.validate(valid => {
if (valid) {
this.checkboxChange()
flag = true
}
})
return flag
}
}
}
</script>
<style lang="scss" scoped>
.sub-title {
line-height: 100%;
font-size: 16px;
font-weight: bold;
color: #333333;
border-left: 3px solid rgba(184, 1, 64, 1);
padding-left: 7px;
margin-bottom: 25px;
}
.form-box {
padding-top: 15px;
}
::v-deep {
.form-set-info {
.el-form-item__content {
display: flex;
align-items: center;
}
.el-icon-remove-outline {
font-size: 22px;
margin-left: 10px;
color: rgba(214, 214, 214, 1);
cursor: pointer;
}
.required {
margin-left: 15px;
}
}
}
.form-set-pay {
border-bottom: 1px solid #d6d6d6;
padding: 25px 0 15px;
}
.form-set-page {
padding: 25px 0 15px;
border-bottom: 1px solid #d6d6d6;
}
.form-set-info {
border-bottom: 1px solid #d6d6d6;
padding-bottom: 30px;
.field-list {
margin-bottom: 30px;
.field-list_title {
font-size: 16px;
font-weight: bold;
line-height: 100%;
color: #333333;
}
.field-list_content {
padding-top: 15px;
.checkbox {
display: flex;
align-items: center;
}
}
}
}
</style>
src/modules/banner/components/SetBasic.vue deleted 100644 → 0
浏览文件 @ 67608a78
<template>
<div>
<el-form ref="form" :disabled="!!$route.query.type" :inline="true" :rules="rules" :model="form">
<el-form-item label="页面标题：" prop="title">
<el-input v-model="form.title"></el-input>
</el-form-item>
<el-form-item label="活动名称：" prop="name">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="人数限制：" prop="max_number">
<el-input v-model="form.max_number"></el-input>
</el-form-item>
<el-form-item label="关联项目：" prop="project_id">
<el-select v-model="form.project_id" placeholder="请选择">
<el-option v-for="item in projectMap" :key="item.key" :label="item.value" :value="item.key"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="活动开始时间：" prop="activity_time">
<el-date-picker
v-model="form.activity_time"
type="datetime"
@change="activityDateChange"
placeholder="选择日期时间"
:picker-options="pickerOptions"
>
</el-date-picker>
</el-form-item>
<el-form-item label="报名时间：" prop="time">
<el-date-picker
@change="dateChange"
v-model="form.time"
type="datetimerange"
range-separator="至"
start-placeholder="报名开始日期"
end-placeholder="报名结束日期"
>
</el-date-picker>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
props: {
form: { type: Object, default: () => {} }
},
data() {
return {
rules: {
title: { required: true, message: '请填写页面标题', trigger: 'blur' },
name: { required: true, message: '请填写活动标题', trigger: 'blur' },
max_number: [
{ required: true, message: '请填写最大参与人数', trigger: 'blur' },
{
trigger: 'blur',
min: 1,
message: '最大人数限制不能小于1人',
validator(rule, value, callback) {
if (parseInt(Number(value)) && Number(value) >= 1) {
callback()
} else {
callback(new Error('最大人数限制不能小于1人'))
}
}
}
],
project_id: { required: true, message: '请关联项目', trigger: 'change' },
time: { required: true, message: '请选择时间', trigger: 'change' },
activity_time: { required: true, message: '请选择时间', trigger: 'change' }
},
pickerOptions: {
disabledDate(v) {
return v.getTime() < new Date().getTime() - 86400000
}
}
}
},
computed: {
projectMap() {
return this.$store.state.commonMap.project_map || {}
}
},
mounted() {
console.log(this.form)
},
methods: {
submitForm() {
let flag = false
this.$refs.form.validate(valid => {
if (valid) {
flag = true
}
})
return flag
},
// 日期改变的时候。吧日期转成后台需要的格式
dateChange(date) {
this.form.start_time = this.setDate(date[0])
this.form.end_time = this.setDate(date[1])
},
setDate(val) {
const d = new Date(val)
const date = `${d.getFullYear()}-${this.toDo(d.getMonth() + 1)}-${this.toDo(d.getDate())} ${this.toDo(
d.getHours()
)}:${this.toDo(d.getMinutes())}:${this.toDo(d.getSeconds())}`
return date
},
toDo(n) {
return n < 10 ? `0${n}` : n
},
activityDateChange() {
this.form.activity_time = this.setDate(this.form.activity_time)
}
}
}
</script>
<style lang="scss" scoped></style>
src/modules/banner/components/essay.vue 0 → 100644
浏览文件 @ 0f3e8c1c
<template>
<app-card class="register-box">
<app-list highlight-current-row @current-change="selectionChange" v-bind="tableOptions" ref="list">
<template v-slot:filter-time>
<el-date-picker
v-model="filterDate"
@change="changeDate"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</template>
<template v-slot:picture="{ row }">
<div :style="`background-image:url(${row.picture});background-size: cover;width:200px;height:100px;`"></div>
</template>
</app-list>
<el-button @click="confirmBanner" type="primary">确认</el-button>
</app-card>
</template>
<script>
// 接口
import { getEssayList } from '../api'
export default {
props: {
selectData: {
type: Array
}
},
data() {
const count = []
for (let i = 0; i < 100; i++) {
count.push({ value: i, options: i })
}
return {
value1: '',
filterDate: '',
options: count,
createdStart: '',
createdEnd: '',
tableCheckboxValue: []
}
},
computed: {
// 列表配置
tableOptions() {
return {
limit: 10,
remote: {
httpRequest: getEssayList,
params: {
title: '',
created_time_start: this.createdStart,
created_time_end: this.createdEnd
},
callback: res => {
// 选中后不在列表展示
const filterData = []
res.forEach(element => {
if (!this.selectData.find(item => item.id === element.id)) {
element.status = !!parseInt(element.status)
filterData.push(element)
}
})
return filterData
}
},
filters: [
{
type: 'input',
prop: 'title',
label: '标题:'
},
{
slots: 'filter-time',
label: '创建时间:'
}
],
columns: [
{ label: 'id', prop: 'id', align: 'center' },
{ label: '封面图', slots: 'picture', align: 'center', width: '170px' },
{ label: '标题', prop: 'title', align: 'center' },
{ label: '摘要', prop: 'remark', align: 'center' },
{ label: '备注', prop: 'comment', align: 'center' },
{ label: '创建时间', prop: 'created_time', align: 'center' }
]
}
}
},
methods: {
selectionChange(selection) {
console.log(111, selection)
this.tableCheckboxValue = selection
},
confirmBanner() {
this.$emit('selectionConfirm', this.tableCheckboxValue)
},
// 时间搜索
changeDate() {
if (this.filterDate) {
this.createdStart = this.filterDate[0]
this.createdEnd = this.filterDate[1]
} else {
this.createdStart = ''
this.createdEnd = ''
}
}
}
}
</script>
<style lang="scss">
.register-box {
.el-form-item {
margin-right: 20px !important;
}
.line {
height: 1px;
background: #d6d6d6;
margin: 8px 0 23px;
box-sizing: border-box;
}
.btn-box {
margin-bottom: 16px;
}
}
</style>
src/modules/banner/components/pages.vue 0 → 100644
浏览文件 @ 0f3e8c1c
<template>
<app-card class="register-box">
<app-list highlight-current-row @current-change="selectionChange" v-bind="tableOptions" ref="list">
<!-- <div class="line"></div> -->
<template v-slot:filter-time>
<el-date-picker
v-model="filterDate"
@change="changeDate"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</template>
</app-list>
<el-button @click="confirmBanner" type="primary">确认</el-button>
</app-card>
</template>
<script>
// 接口
import { getPagesList } from '../api'
export default {
props: {
selectData: {
type: Array
}
},
data() {
const count = []
for (let i = 0; i < 100; i++) {
count.push({ value: i, options: i })
}
return {
value1: '',
filterDate: '',
options: count,
createdStart: '',
createdEnd: '',
tableCheckboxValue: []
}
},
computed: {
// 列表配置
tableOptions() {
return {
limit: 10,
remote: {
httpRequest: getPagesList,
params: {
title: '',
created_time_start: this.createdStart,
created_time_end: this.createdEnd
},
callback: res => {
// 选中后不在列表展示
const filterData = []
res.forEach(element => {
if (!this.selectData.find(item => item.id === element.id)) {
element.status = !!parseInt(element.status)
filterData.push(element)
}
})
return filterData
}
},
filters: [
{
type: 'input',
prop: 'title',
label: '标题:'
},
{
slots: 'filter-time',
label: '创建时间:'
}
],
columns: [
{ label: 'id', prop: 'id', align: 'center' },
{ label: '页面类型', prop: 'type_name', align: 'center' },
{ label: '页面模板', prop: 'layout_name', align: 'center' },
{ label: '标题', prop: 'title', align: 'center' },
{ label: '创建时间', prop: 'created_time', align: 'center' }
]
}
}
},
methods: {
selectionChange(selection) {
this.tableCheckboxValue = selection
},
confirmBanner() {
this.$emit('selectionConfirm', this.tableCheckboxValue)
},
// 时间搜索
changeDate() {
if (this.filterDate) {
this.createdStart = this.filterDate[0]
this.createdEnd = this.filterDate[1]
} else {
this.createdStart = ''
this.createdEnd = ''
}
}
}
}
</script>
<style lang="scss">
.register-box {
.el-form-item {
margin-right: 20px !important;
}
.line {
height: 1px;
background: #d6d6d6;
margin: 8px 0 23px;
box-sizing: border-box;
}
.btn-box {
margin-bottom: 16px;
}
}
</style>
src/modules/banner/views/Update.vue
浏览文件 @ 0f3e8c1c
......@@ -7,7 +7,7 @@
ref="ruleForm"
label-width="100px"
class="demo-ruleForm"
style="width: 40%; margin: 0 auto"
style="width: 80%; margin: 0 auto"
>
<el-form-item label="标题">
<el-input v-model="ruleForm.title"></el-input>
......@@ -20,6 +20,32 @@
</el-form-item>
<el-form-item label="关联选择">
<el-button type="primary" @click="drawer = true">点击选择</el-button>
<el-card class="box-card" style="margin-top: 20px">
<div slot="header" class="clearfix">
<span>{{ ruleForm.type == '1' ? '关联图文' : ruleForm.type == '2' ? '关联页面' : '跳转链接' }}</span>
</div>
<app-list v-if="ruleForm.type == '1'" v-bind="essayTableOptions" ref="list">
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handleEssayDelete(row)">删除</el-button>
</template>
<template v-slot:picture="{ row }">
<div
:style="`background-image:url(${row.picture});background-size: cover;width:200px;height:100px;`"
></div>
</template>
</app-list>
<app-list v-if="ruleForm.type == '2'" v-bind="pagesTableOptions" ref="list">
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handlePagesDelete(row)">删除</el-button>
</template>
<template v-slot:picture="{ row }">
<div
:style="`background-image:url(${row.picture});background-size: cover;width:200px;height:100px;`"
></div>
</template>
</app-list>
<div v-if="ruleForm.type == '3'">{{ ruleForm.url }}</div>
</el-card>
</el-form-item>
<el-form-item>
<div style="padding-top: 20px">
......@@ -29,28 +55,38 @@
</el-form-item>
</el-form>
</app-card>
<el-drawer size="40%" :visible.sync="drawer" :direction="direction">
<el-drawer :destroy-on-close="true" size="60%" :visible.sync="drawer" :direction="direction">
<div style="padding: 0 20px">
<el-tabs v-model="activeName">
<el-tabs v-model="ruleForm.type">
<el-tab-pane label="关联图文" name="1"></el-tab-pane>
<el-tab-pane label="关联页面" name="2"></el-tab-pane>
<el-tab-pane label="跳转链接" name="3"></el-tab-pane>
</el-tabs>
</div>
<essay v-if="ruleForm.type == '1'" @selectionConfirm="essaySelectionConfirm" :selectData="essayList"></essay>
<pages v-if="ruleForm.type == '2'" @selectionConfirm="pagesSelectionConfirm" :selectData="pagesList"></pages>
<div style="padding: 0 20px">
<el-input v-if="ruleForm.type == '3'" v-model="ruleForm.url" placeholder="请输入链接"></el-input>
</div>
</el-drawer>
</div>
</template>
<script>
import essay from '../components/essay.vue'
import pages from '../components/pages.vue'
import UploadImage from '@/components/upload/UploadImage.vue'
import { createBanner, getDetails, updateBanner } from '../api'
export default {
components: {
UploadImage
UploadImage,
essay,
pages
},
data() {
return {
activeName: '1',
essayList: [],
pagesList: [],
status: true,
drawer: false,
direction: 'rtl',
......@@ -58,7 +94,7 @@ export default {
title: '',
url: '',
picture: '',
type: '',
type: '1',
status: true,
relations_id: ''
},
......@@ -71,12 +107,70 @@ export default {
computed: {
id() {
return this.$route.query.id
},
essayTableOptions() {
return {
hasPagination: false,
columns: [
{ label: 'id', prop: 'id', align: 'center' },
{ label: '封面图', slots: 'picture', align: 'center', width: '170px' },
{ label: '标题', prop: 'title', align: 'center' },
{ label: '摘要', prop: 'remark', align: 'center' },
{ label: '备注', prop: 'comment', align: 'center' },
{ label: '创建时间', prop: 'created_time', align: 'center' },
{ label: '操作', slots: 'table-x', align: 'center' }
],
data: this.essayList
}
},
pagesTableOptions() {
return {
hasPagination: false,
columns: [
{ label: 'id', prop: 'id', align: 'center' },
{ label: '页面类型', prop: 'type_name', align: 'center' },
{ label: '页面模板', prop: 'layout_name', align: 'center' },
{ label: '标题', prop: 'title', align: 'center' },
{ label: '创建时间', prop: 'created_time', align: 'center' },
{ label: '操作', slots: 'table-x', align: 'center' }
],
data: this.pagesList
}
}
},
methods: {
// 删除essay关联
handleEssayDelete(row) {
const findIndex = this.essayList.findIndex(item => row.id === item.id)
if (findIndex !== -1) {
this.essayList.splice(findIndex, 1)
}
},
// 删除pages关联
handlePagesDelete(row) {
const findIndex = this.pagesList.findIndex(item => row.id === item.id)
if (findIndex !== -1) {
this.pagesList.splice(findIndex, 1)
}
},
// 图文选择
essaySelectionConfirm(value) {
this.drawer = false
this.essayList = [value]
},
// 页面关联
pagesSelectionConfirm(value) {
this.drawer = false
this.pagesList = [value]
},
// 提交
submitForm() {
this.ruleForm.type = this.activeName
if (this.ruleForm.type === '1') {
this.ruleForm.relations_id = this.essayList.length ? this.essayList[0].id : ''
}
if (this.ruleForm.type === '2') {
this.ruleForm.relations_id = this.pagesList.length ? this.pagesList[0].id : ''
}
this.ruleForm.status = this.status ? 1 : 0
if (this.id) {
updateBanner(this.ruleForm).then(res => {
......
src/modules/essay/api.js
浏览文件 @ 0f3e8c1c
......@@ -35,6 +35,27 @@ export function deleteEssay(data) {
return httpRequest.post('/api/road/v1/backend/doc/delete', data)
}
/**
* 获banner列表
*/
export function getBannerList(params) {
return httpRequest.get('/api/road/v1/backend/banner/list', { params })
}
/**
* 获menu列表
*/
export function getMenuList(params) {
return httpRequest.get('/api/road/v1/backend/menu/list', { params })
}
/**
* 获pages列表
*/
export function getPagesList(params) {
return httpRequest.get('/api/road/v1/backend/page/list', { params })
}
// /**
// * 获取应用列表
// */
......
src/modules/essay/components/DisplayType.vue deleted 100644 → 0
浏览文件 @ 67608a78
<template>
<div>
<el-form :disabled="!!$route.query.type" ref="form" :rules="rules" :model="data" label-width="100px">
<el-form-item label="按钮文案：" prop="title">
<el-input v-model="data.title"></el-input>
</el-form-item>
<el-form-item label="页面展示：" prop="desc">
<v-editor :disabled="!!$route.query.type" v-model="data.desc"></v-editor>
</el-form-item>
</el-form>
</div>
</template>
<script>
import VEditor from '@/components/tinymce/Index.vue'
export default {
components: { VEditor },
props: {
data: { type: Object, default: () => {} }
},
data() {
return {
form: {
edit: '',
btnText: ''
},
rules: {
title: [{ required: true, message: '请填写按钮文案', trigger: 'change' }],
desc: [{ required: true, message: '请填写页面内容', trigger: 'change' }]
}
}
},
methods: {
submitForm() {
let flag = false
this.$refs.form.validate(valid => {
if (valid) {
flag = true
}
})
return flag
}
},
mounted() {
console.log(this.data, 'display')
}
}
</script>
<style lang="scss">
.tox-notifications-container {
display: none !important;
}
</style>
src/modules/essay/components/FormType.vue deleted 100644 → 0
浏览文件 @ 67608a78
<template>
<div class="form-box">
<el-form ref="form" :disabled="!!$route.query.type" :rules="rules" :model="data" size="mini" label-width="150px">
<div class="form-set-info">
<div class="sub-title">信息设置</div>
<el-checkbox-group v-model="checkList" @change="checkboxChange">
<div class="field-list" v-for="(item, index) in fieldList" :key="index">
<div class="field-list_title">{{ item.title }}</div>
<div class="field-list_content">
<el-checkbox
style="margin: 0 90px 10px 10px"
:disabled="cItem.disabled ? cItem.disabled : false"
:label="cItem.key"
v-for="cItem in item.fields"
:key="cItem.key"
>
<div class="checkbox">
{{ cItem.label }}&nbsp;&nbsp;&nbsp;必填：
<el-radio
@change="checkboxChange"
v-model="cItem.required"
:disabled="cItem.disabled ? cItem.disabled : false"
label="1"
>是</el-radio
>
<el-radio
@change="checkboxChange"
v-model="cItem.required"
:disabled="cItem.disabled ? cItem.disabled : false"
label="2"
>否</el-radio
>
</div>
</el-checkbox>
</div>
</div>
</el-checkbox-group>
</div>
<div class="form-set-pay">
<div class="sub-title">缴费设置</div>
<!--导入功能 新增 -->
<el-form-item label="批量导入功能:">
<el-radio v-model="data.can_import" :label="1">开启</el-radio>
<el-radio v-model="data.can_import" :label="0">关闭</el-radio>
</el-form-item>
<el-form-item label="缴费功能:">
<el-radio v-model="data.can_pay" :label="1">开启</el-radio>
<el-radio v-model="data.can_pay" :label="0">关闭</el-radio>
</el-form-item>
<template v-if="!!data.can_pay">
<el-form-item label="价格：" prop="pay_price">
<el-input style="width: 20%" v-model="data.pay_price"></el-input>
</el-form-item>
<el-form-item label="开票功能:">
<el-radio v-model="data.can_invoice" :label="1">开启</el-radio>
<el-radio v-model="data.can_invoice" :label="0">关闭</el-radio>
</el-form-item>
<!-- 缴费方式 新增-->
<el-form-item label="缴费方式:" prop="pay_type">
<el-select v-model="data.pay_type" multiple>
<el-option v-for="item in payType" :key="item.key" :label="item.value" :value="item.key"></el-option>
</el-select>
</el-form-item>
<el-form-item label="线下支付联系方式：" prop="offline_info" v-if="data.pay_type.includes('3')">
<el-input style="width: 20%" v-model="data.offline_info"></el-input>
</el-form-item>
<el-form-item label="线下支付信息：" prop="offline_more_info" v-if="data.pay_type.includes('3')">
<v-editor style="width: 500px" :maxHeight="200" :disabled="!!$route.query.type" v-model="data.offline_more_info"></v-editor>
</el-form-item>
<el-form-item label="单位优惠:">
<el-radio v-model="data.can_company" :label="1">开启</el-radio>
<el-radio v-model="data.can_company" :label="0">关闭</el-radio>
</el-form-item>
<el-form-item label="单位优惠金额:" prop="company_price" v-if="data.can_company">
<el-input style="width: 20%" v-model="data.company_price"></el-input>
</el-form-item>
<el-form-item label="跳转:">
<el-radio v-model="data.can_jump" :label="1">开启</el-radio>
<el-radio v-model="data.can_jump" :label="0">关闭</el-radio>
</el-form-item>
<template v-if="!!data.can_jump">
<el-form-item label="跳转链接:" prop="jump_url">
<el-input style="width: 20%" v-model="data.jump_url"></el-input>
</el-form-item>
</template>
<el-form-item label="跳过支付:">
<el-radio v-model="data.can_skip_pay" :label="1">开启</el-radio>
<el-radio v-model="data.can_skip_pay" :label="0">关闭</el-radio>
</el-form-item>
<el-form-item label="跳过文案:" prop="skip_pay_title" v-if="!!data.can_skip_pay">
<el-input style="width: 20%" v-model="data.skip_pay_title"></el-input>
</el-form-item>
<el-form-item label="支付平台:" prop="shop_id">
<el-select v-model="data.shop_id" placeholder="请选择">
<el-option v-for="item in shopMap" :key="item.key" :label="item.value" :value="item.key"> </el-option>
</el-select>
</el-form-item>
</template>
</div>
<div class="form-set-page">
<div class="sub-title">页面设置</div>
<el-form-item label="标题:" prop="title">
<el-input style="width: 20%" v-model="data.title"></el-input>
</el-form-item>
<el-form-item label="页面头部:" prop="desc">
<v-editor :disabled="!!$route.query.type" v-model="data.desc"></v-editor>
</el-form-item>
</div>
</el-form>
</div>
</template>
<script>
import VEditor from '@/components/tinymce/Index.vue'
export default {
components: { VEditor },
props: {
data: {
type: Object,
default: () => {}
}
},
data() {
return {
payType: [
{ key: '1', value: '微信' },
{ key: '2', value: '支付宝' },
{ key: '3', value: '线下支付' }
],
rules: {
title: { required: true, message: '请填写标题', trigger: 'blur' },
pay_price: [
{ required: true, message: '请填写支付金额', trigger: 'blur' },
{
trigger: 'blur',
min: 0,
validator(rule, value, callback) {
if (Number(value) > 0) {
callback()
} else {
callback(new Error('支付金额不能小于等于0元'))
}
}
}
],
jump_url: { required: true, message: '请填写跳转链接', trigger: 'blur' },
shop_id: { required: true, message: '请选择支付平台', trigger: 'change' },
skip_pay_title: { required: true, message: '请填写跳过支付文案', trigger: 'blur' },
pay_type: { required: true, message: '请填选择缴费方式', trigger: 'change' },
company_price: [
{ required: true, message: '请填写单位优惠金额', trigger: 'blur' },
{
trigger: 'blur',
min: 0,
validator(rule, value, callback) {
if (Number(value) > 0) {
callback()
} else {
callback(new Error('优惠金额不能小于等于0元'))
}
}
}
]
},
options: [],
checkList: [],
fieldList: [
{
title: '个人信息',
fields: [
{ key: 'name', label: '姓名', required: '1', disabled: true },
{ key: 'mobile', label: '电话', required: '1', disabled: true },
{ key: 'gender', label: '性别', required: '1' },
{ key: 'email', label: '邮箱', required: '1' },
{ key: 'company', label: '公司', required: '1' },
{ key: 'position', label: '职位', required: '1' },
{ key: 'number', label: '编号', required: '1' },
{ key: 'country', label: '国籍', required: '1' },
{ key: 'provinces', label: '省份', required: '1' },
{ key: 'city', label: '城市', required: '1' },
{ key: 'address', label: '地址', required: '1' },
{ key: 'fixed_telephone', label: '固话', required: '1' },
{ key: 'industry', label: '行业', required: '1' },
{ key: 'id_number', label: '身份证号码', required: '1' }
]
},
{
title: '社交信息',
fields: [
{ key: 'wechat', label: '微信', required: '1' },
{ key: 'qq', label: 'QQ', required: '1' },
{ key: 'ding', label: '钉钉', required: '1' },
{ key: 'weibo', label: '微博', required: '1' }
]
},
{
title: '入住信息',
fields: [
{ key: 'check_in_time', label: '入住时间', required: '1' },
{ key: 'check_out_time', label: '离店时间', required: '1' },
{ key: 'room_type', label: '房型', required: '1' },
{ key: 'breakfast', label: '早餐', required: '1' }
]
}
]
}
},
computed: {
shopMap() {
return this.$store.state.commonMap.details_shop_map
},
payTypeMap() {
return this.data.pay_type
}
},
created() {},
mounted() {
this.setInfoFields()
},
methods: {
// 信息设置数据回显
setInfoFields() {
this.fieldList = this.fieldList.reduce((a, b) => {
b.fields.map(item => {
const findData = this.data.user_fields.find(fData => fData.key === item.key)
if (findData) {
this.checkList.push(findData.key)
item.required = findData.required ? '1' : '2'
}
return item
})
a.push(b)
return a
}, [])
},
// 信息设置选择后 吧选择的编程后台需要的数据
checkboxChange() {
this.data.user_fields = this.fieldList.reduce((a, b) => {
b.fields.forEach(item => {
const findData = this.checkList.find(fData => fData === item.key)
if (findData) {
a.push({ key: item.key, required: !!(item.required === '1'), enable_edit: true })
}
})
return a
}, [])
this.data.pay_type = this.data.pay_type.toString()
},
submitForm() {
let flag = false
this.$refs.form.validate(valid => {
if (valid) {
this.checkboxChange()
flag = true
}
})
return flag
}
}
}
</script>
<style lang="scss" scoped>
.sub-title {
line-height: 100%;
font-size: 16px;
font-weight: bold;
color: #333333;
border-left: 3px solid rgba(184, 1, 64, 1);
padding-left: 7px;
margin-bottom: 25px;
}
.form-box {
padding-top: 15px;
}
::v-deep {
.form-set-info {
.el-form-item__content {
display: flex;
align-items: center;
}
.el-icon-remove-outline {
font-size: 22px;
margin-left: 10px;
color: rgba(214, 214, 214, 1);
cursor: pointer;
}
.required {
margin-left: 15px;
}
}
}
.form-set-pay {
border-bottom: 1px solid #d6d6d6;
padding: 25px 0 15px;
}
.form-set-page {
padding: 25px 0 15px;
border-bottom: 1px solid #d6d6d6;
}
.form-set-info {
border-bottom: 1px solid #d6d6d6;
padding-bottom: 30px;
.field-list {
margin-bottom: 30px;
.field-list_title {
font-size: 16px;
font-weight: bold;
line-height: 100%;
color: #333333;
}
.field-list_content {
padding-top: 15px;
.checkbox {
display: flex;
align-items: center;
}
}
}
}
</style>
src/modules/essay/components/SetBasic.vue deleted 100644 → 0
浏览文件 @ 67608a78
<template>
<div>
<el-form ref="form" :disabled="!!$route.query.type" :inline="true" :rules="rules" :model="form">
<el-form-item label="页面标题：" prop="title">
<el-input v-model="form.title"></el-input>
</el-form-item>
<el-form-item label="活动名称：" prop="name">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="人数限制：" prop="max_number">
<el-input v-model="form.max_number"></el-input>
</el-form-item>
<el-form-item label="关联项目：" prop="project_id">
<el-select v-model="form.project_id" placeholder="请选择">
<el-option v-for="item in projectMap" :key="item.key" :label="item.value" :value="item.key"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="活动开始时间：" prop="activity_time">
<el-date-picker
v-model="form.activity_time"
type="datetime"
@change="activityDateChange"
placeholder="选择日期时间"
:picker-options="pickerOptions"
>
</el-date-picker>
</el-form-item>
<el-form-item label="报名时间：" prop="time">
<el-date-picker
@change="dateChange"
v-model="form.time"
type="datetimerange"
range-separator="至"
start-placeholder="报名开始日期"
end-placeholder="报名结束日期"
>
</el-date-picker>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
props: {
form: { type: Object, default: () => {} }
},
data() {
return {
rules: {
title: { required: true, message: '请填写页面标题', trigger: 'blur' },
name: { required: true, message: '请填写活动标题', trigger: 'blur' },
max_number: [
{ required: true, message: '请填写最大参与人数', trigger: 'blur' },
{
trigger: 'blur',
min: 1,
message: '最大人数限制不能小于1人',
validator(rule, value, callback) {
if (parseInt(Number(value)) && Number(value) >= 1) {
callback()
} else {
callback(new Error('最大人数限制不能小于1人'))
}
}
}
],
project_id: { required: true, message: '请关联项目', trigger: 'change' },
time: { required: true, message: '请选择时间', trigger: 'change' },
activity_time: { required: true, message: '请选择时间', trigger: 'change' }
},
pickerOptions: {
disabledDate(v) {
return v.getTime() < new Date().getTime() - 86400000
}
}
}
},
computed: {
projectMap() {
return this.$store.state.commonMap.project_map || {}
}
},
mounted() {
console.log(this.form)
},
methods: {
submitForm() {
let flag = false
this.$refs.form.validate(valid => {
if (valid) {
flag = true
}
})
return flag
},
// 日期改变的时候。吧日期转成后台需要的格式
dateChange(date) {
this.form.start_time = this.setDate(date[0])
this.form.end_time = this.setDate(date[1])
},
setDate(val) {
const d = new Date(val)
const date = `${d.getFullYear()}-${this.toDo(d.getMonth() + 1)}-${this.toDo(d.getDate())} ${this.toDo(
d.getHours()
)}:${this.toDo(d.getMinutes())}:${this.toDo(d.getSeconds())}`
return date
},
toDo(n) {
return n < 10 ? `0${n}` : n
},
activityDateChange() {
this.form.activity_time = this.setDate(this.form.activity_time)
}
}
}
</script>
<style lang="scss" scoped></style>
src/modules/essay/components/banner.vue 0 → 100644
浏览文件 @ 0f3e8c1c
<template>
<app-card class="register-box">
<app-list @selection-change="selectionChange" v-bind="tableOptions" ref="list">
<!-- <div class="line"></div> -->
<template v-slot:filter-time>
<el-date-picker
v-model="filterDate"
@change="changeDate"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</template>
<template v-slot:picture="{ row }">
<div :style="`background-image:url(${row.picture});background-size: cover;width:200px;height:100px;`"></div>
</template>
</app-list>
<el-button @click="confirmBanner" type="primary">确认</el-button>
</app-card>
</template>
<script>
// 接口
import { getBannerList } from '../api'
export default {
props: {
selectData: {
type: Array
}
},
data() {
const count = []
for (let i = 0; i < 100; i++) {
count.push({ value: i, options: i })
}
return {
value1: '',
filterDate: '',
options: count,
createdStart: '',
createdEnd: '',
tableCheckboxValue: []
}
},
computed: {
// 列表配置
tableOptions() {
return {
limit: 10,
remote: {
httpRequest: getBannerList,
params: {
title: '',
created_time_start: this.createdStart,
created_time_end: this.createdEnd
},
callback: res => {
// 选中后不在列表展示
const filterData = []
res.forEach(element => {
if (!this.selectData.find(item => item.id === element.id)) {
element.status = !!parseInt(element.status)
filterData.push(element)
}
})
return filterData
}
},
filters: [
{
type: 'input',
prop: 'title',
label: '标题:'
},
{
slots: 'filter-time',
label: '创建时间:'
}
],
columns: [
{ type: 'selection', prop: 'selection', align: 'center' },
{ label: 'id', prop: 'id', align: 'center' },
{ label: '标题', prop: 'title', align: 'center' },
{ label: '图片', slots: 'picture', align: 'center', width: '200px' },
{ label: '创建时间', prop: 'created_time', align: 'center' }
]
}
}
},
methods: {
selectionChange(selection) {
this.tableCheckboxValue = selection
},
confirmBanner() {
this.$emit('selectionConfirm', this.tableCheckboxValue)
},
// 时间搜索
changeDate() {
if (this.filterDate) {
this.createdStart = this.filterDate[0]
this.createdEnd = this.filterDate[1]
} else {
this.createdStart = ''
this.createdEnd = ''
}
}
}
}
</script>
<style lang="scss">
.register-box {
.el-form-item {
margin-right: 20px !important;
}
.line {
height: 1px;
background: #d6d6d6;
margin: 8px 0 23px;
box-sizing: border-box;
}
.btn-box {
margin-bottom: 16px;
}
}
</style>
src/modules/essay/components/menu.vue 0 → 100644
浏览文件 @ 0f3e8c1c
<template>
<app-card class="register-box">
<app-list @selection-change="selectionChange" v-bind="tableOptions" ref="list">
<!-- <div class="line"></div> -->
<template v-slot:filter-time>
<el-date-picker
v-model="filterDate"
@change="changeDate"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</template>
<template v-slot:picture="{ row }">
<div :style="`background-image:url(${row.picture});background-size: cover;width:50px;height:40px;`"></div>
</template>
</app-list>
<el-button @click="confirmBanner" type="primary">确认</el-button>
</app-card>
</template>
<script>
// 接口
import { getMenuList } from '../api'
export default {
props: {
selectData: {
type: Array
}
},
data() {
const count = []
for (let i = 0; i < 100; i++) {
count.push({ value: i, options: i })
}
return {
value1: '',
filterDate: '',
options: count,
createdStart: '',
createdEnd: '',
tableCheckboxValue: []
}
},
computed: {
// 列表配置
tableOptions() {
return {
limit: 10,
remote: {
httpRequest: getMenuList,
params: {
title: '',
created_time_start: this.createdStart,
created_time_end: this.createdEnd
},
callback: res => {
// 选中后不在列表展示
const filterData = []
res.forEach(element => {
if (!this.selectData.find(item => item.id === element.id)) {
element.status = !!parseInt(element.status)
filterData.push(element)
}
})
return filterData
}
},
filters: [
{
type: 'input',
prop: 'title',
label: '菜单名称:'
},
{
slots: 'filter-time',
label: '创建时间:'
}
],
columns: [
{ type: 'selection', prop: 'selection', align: 'center' },
{ label: 'id', prop: 'id', align: 'center' },
{ label: '菜单名称', prop: 'title', align: 'center' },
{ label: '菜单图标', slots: 'picture', align: 'center', width: '50px' },
{ label: '创建时间', prop: 'created_time', align: 'center' }
]
}
}
},
methods: {
selectionChange(selection) {
this.tableCheckboxValue = selection
},
confirmBanner() {
this.$emit('selectionConfirm', this.tableCheckboxValue)
},
// 时间搜索
changeDate() {
if (this.filterDate) {
this.createdStart = this.filterDate[0]
this.createdEnd = this.filterDate[1]
} else {
this.createdStart = ''
this.createdEnd = ''
}
}
}
}
</script>
<style lang="scss">
.register-box {
.el-form-item {
margin-right: 20px !important;
}
.line {
height: 1px;
background: #d6d6d6;
margin: 8px 0 23px;
box-sizing: border-box;
}
.btn-box {
margin-bottom: 16px;
}
}
</style>
src/modules/essay/components/pages.vue 0 → 100644
浏览文件 @ 0f3e8c1c
<template>
<app-card class="register-box">
<app-list @selection-change="selectionChange" v-bind="tableOptions" ref="list">
<!-- <div class="line"></div> -->
<template v-slot:filter-time>
<el-date-picker
v-model="filterDate"
@change="changeDate"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</template>
</app-list>
<el-button @click="confirmBanner" type="primary">确认</el-button>
</app-card>
</template>
<script>
// 接口
import { getPagesList } from '../api'
export default {
props: {
selectData: {
type: Array
}
},
data() {
const count = []
for (let i = 0; i < 100; i++) {
count.push({ value: i, options: i })
}
return {
value1: '',
filterDate: '',
options: count,
createdStart: '',
createdEnd: '',
tableCheckboxValue: []
}
},
computed: {
// 列表配置
tableOptions() {
return {
limit: 10,
remote: {
httpRequest: getPagesList,
params: {
title: '',
created_time_start: this.createdStart,
created_time_end: this.createdEnd
},
callback: res => {
// 选中后不在列表展示
const filterData = []
res.forEach(element => {
if (!this.selectData.find(item => item.id === element.id)) {
element.status = !!parseInt(element.status)
filterData.push(element)
}
})
return filterData
}
},
filters: [
{
type: 'input',
prop: 'title',
label: '标题:'
},
{
slots: 'filter-time',
label: '创建时间:'
}
],
columns: [
{ type: 'selection', prop: 'selection', align: 'center' },
{ label: 'id', prop: 'id', align: 'center' },
{ label: '页面类型', prop: 'type_name', align: 'center' },
{ label: '页面模板', prop: 'layout_name', align: 'center' },
{ label: '标题', prop: 'title', align: 'center' },
{ label: '创建时间', prop: 'created_time', align: 'center' }
]
}
}
},
methods: {
selectionChange(selection) {
this.tableCheckboxValue = selection
},
confirmBanner() {
this.$emit('selectionConfirm', this.tableCheckboxValue)
},
// 时间搜索
changeDate() {
if (this.filterDate) {
this.createdStart = this.filterDate[0]
this.createdEnd = this.filterDate[1]
} else {
this.createdStart = ''
this.createdEnd = ''
}
}
}
}
</script>
<style lang="scss">
.register-box {
.el-form-item {
margin-right: 20px !important;
}
.line {
height: 1px;
background: #d6d6d6;
margin: 8px 0 23px;
box-sizing: border-box;
}
.btn-box {
margin-bottom: 16px;
}
}
</style>
src/modules/essay/views/Update.vue
浏览文件 @ 0f3e8c1c
......@@ -32,6 +32,51 @@
</el-form-item>
<el-form-item label="关联选择">
<el-button type="primary" @click="drawer = true">点击选择</el-button>
<el-card class="box-card" style="margin-top: 20px">
<div slot="header" class="clearfix">
<span>Banner列表</span>
</div>
<app-list style="margin-top: 20px" v-bind="bannerTableOptions" ref="list">
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handleBannerDelete(row)">删除</el-button>
</template>
<template v-slot:picture="{ row }">
<div
:style="`background-image:url(${row.picture});background-size: cover;width:200px;height:100px;`"
></div>
</template>
</app-list>
</el-card>
<el-card class="box-card" style="margin-top: 20px">
<div slot="header" class="clearfix">
<span>功能区列表</span>
</div>
<app-list style="margin-top: 20px" v-bind="menuTableOptions" ref="list">
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handleMenuDelete(row)">删除</el-button>
</template>
<template v-slot:picture="{ row }">
<div
:style="`background-image:url(${row.picture});background-size: cover;width:50px;height:40px;`"
></div>
</template>
</app-list>
</el-card>
<el-card class="box-card" style="margin-top: 20px">
<div slot="header" class="clearfix">
<span>页面列表</span>
</div>
<app-list style="margin-top: 20px" v-bind="pagesTableOptions" ref="list">
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handlePagesDelete(row)">删除</el-button>
</template>
<template v-slot:picture="{ row }">
<div
:style="`background-image:url(${row.picture});background-size: cover;width:200px;height:100px;`"
></div>
</template>
</app-list>
</el-card>
</el-form-item>
<el-form-item>
<div style="padding-top: 20px; width: 200px; margin: 0 auto">
......@@ -41,26 +86,35 @@
</el-form-item>
</el-form>
</app-card>
<el-drawer size="40%" :visible.sync="drawer" :direction="direction">
<el-drawer :destroy-on-close="true" size="60%" :visible.sync="drawer" :direction="direction">
<div style="padding: 0 20px">
<el-tabs v-model="activeName">
<el-tab-pane label="关联图文" name="1"></el-tab-pane>
<el-tab-pane label="关联页面" name="2"></el-tab-pane>
<el-tab-pane label="跳转链接" name="3"></el-tab-pane>
<el-tab-pane label="关联Banner" name="1"></el-tab-pane>
<el-tab-pane label="关联功能区" name="2"></el-tab-pane>
<el-tab-pane label="关联页面" name="3"></el-tab-pane>
</el-tabs>
</div>
<Banner v-if="activeName == '1'" @selectionConfirm="bannerSelectionConfirm" :selectData="bannerList"></Banner>
<Menu v-if="activeName == '2'" @selectionConfirm="menuSelectionConfirm" :selectData="menuList"></Menu>
<Pages v-if="activeName == '3'" @selectionConfirm="pagesSelectionConfirm" :selectData="pagesList"></Pages>
</el-drawer>
</div>
</template>
<script>
import Banner from '../components/banner.vue'
import Menu from '../components/menu.vue'
import Pages from '../components/pages.vue'
import VEditor from '@/components/tinymce/Index.vue'
import UploadImage from '@/components/upload/UploadImage.vue'
import { createEssay, getDetails, updateEssay } from '../api'
export default {
components: {
UploadImage,
VEditor
VEditor,
Banner,
Menu,
Pages
},
data() {
return {
......@@ -85,17 +139,115 @@ export default {
picture: [{ required: true, message: '请上传banner', trigger: 'blur' }],
status: [{ required: true, message: '', trigger: 'blur' }],
content: [{ required: true, message: '请输入正文', trigger: 'blur' }]
}
},
bannerList: [],
menuList: [],
pagesList: []
}
},
computed: {
id() {
return this.$route.query.id
},
bannerTableOptions() {
return {
hasPagination: false,
columns: [
{ label: 'id', prop: 'id', align: 'center' },
{ label: '标题', prop: 'title', align: 'center' },
{ label: '图片', slots: 'picture', align: 'center', width: '200px' },
{ label: '创建时间', prop: 'created_time', align: 'center' },
{ label: '操作', slots: 'table-x', align: 'center' }
],
data: this.bannerList
}
},
menuTableOptions() {
return {
hasPagination: false,
columns: [
{ label: 'id', prop: 'id', align: 'center' },
{ label: '菜单图标', slots: 'picture', align: 'center', width: '50px' },
{ label: '菜单名称', prop: 'title', align: 'center' },
{ label: '备注', prop: 'comment', align: 'center' },
{ label: '创建时间', prop: 'created_time', align: 'center' },
{ label: '操作', slots: 'table-x', align: 'center' }
],
data: this.menuList
}
},
pagesTableOptions() {
return {
hasPagination: false,
columns: [
{ label: 'id', prop: 'id', align: 'center' },
{ label: '页面类型', prop: 'type_name', align: 'center' },
{ label: '页面模板', prop: 'layout_name', align: 'center' },
{ label: '标题', prop: 'title', align: 'center' },
{ label: '创建时间', prop: 'created_time', align: 'center' },
{ label: '操作', slots: 'table-x', align: 'center' }
],
data: this.pagesList
}
}
},
methods: {
// 删除banner关联
handleBannerDelete(row) {
const findIndex = this.bannerList.findIndex(item => row.id === item.id)
if (findIndex !== -1) {
this.bannerList.splice(findIndex, 1)
}
},
// 删除Menu关联
handleMenuDelete(row) {
const findIndex = this.menuList.findIndex(item => row.id === item.id)
if (findIndex !== -1) {
this.menuList.splice(findIndex, 1)
}
},
// 删除pages关联
handlePagesDelete(row) {
const findIndex = this.pagesList.findIndex(item => row.id === item.id)
if (findIndex !== -1) {
this.pagesList.splice(findIndex, 1)
}
},
// banner关联
bannerSelectionConfirm(value) {
this.drawer = false
this.bannerList = value
},
// 关联菜单
menuSelectionConfirm(value) {
this.drawer = false
this.menuList = value
},
// 关联页面
pagesSelectionConfirm(value) {
this.drawer = false
this.pagesList = value
},
// 提交
submitForm() {
this.ruleForm.relations_id_banner = this.bannerList
.reduce((a, b) => {
a.push(b.id)
return a
}, [])
.toString(',')
this.ruleForm.relations_id_menu = this.menuList
.reduce((a, b) => {
a.push(b.id)
return a
}, [])
.toString(',')
this.ruleForm.relations_id_page = this.pagesList
.reduce((a, b) => {
a.push(b.id)
return a
}, [])
.toString(',')
this.ruleForm.type = this.activeName
this.ruleForm.status = this.status ? 1 : 0
if (this.id) {
......
src/modules/menu/components/DisplayType.vue deleted 100644 → 0
浏览文件 @ 67608a78
<template>
<div>
<el-form :disabled="!!$route.query.type" ref="form" :rules="rules" :model="data" label-width="100px">
<el-form-item label="按钮文案：" prop="title">
<el-input v-model="data.title"></el-input>
</el-form-item>
<el-form-item label="页面展示：" prop="desc">
<v-editor :disabled="!!$route.query.type" v-model="data.desc"></v-editor>
</el-form-item>
</el-form>
</div>
</template>
<script>
import VEditor from '@/components/tinymce/Index.vue'
export default {
components: { VEditor },
props: {
data: { type: Object, default: () => {} }
},
data() {
return {
form: {
edit: '',
btnText: ''
},
rules: {
title: [{ required: true, message: '请填写按钮文案', trigger: 'change' }],
desc: [{ required: true, message: '请填写页面内容', trigger: 'change' }]
}
}
},
methods: {
submitForm() {
let flag = false
this.$refs.form.validate(valid => {
if (valid) {
flag = true
}
})
return flag
}
},
mounted() {
console.log(this.data, 'display')
}
}
</script>
<style lang="scss">
.tox-notifications-container {
display: none !important;
}
</style>
src/modules/menu/components/FormType.vue deleted 100644 → 0
浏览文件 @ 67608a78
<template>
<div class="form-box">
<el-form ref="form" :disabled="!!$route.query.type" :rules="rules" :model="data" size="mini" label-width="150px">
<div class="form-set-info">
<div class="sub-title">信息设置</div>
<el-checkbox-group v-model="checkList" @change="checkboxChange">
<div class="field-list" v-for="(item, index) in fieldList" :key="index">
<div class="field-list_title">{{ item.title }}</div>
<div class="field-list_content">
<el-checkbox
style="margin: 0 90px 10px 10px"
:disabled="cItem.disabled ? cItem.disabled : false"
:label="cItem.key"
v-for="cItem in item.fields"
:key="cItem.key"
>
<div class="checkbox">
{{ cItem.label }}&nbsp;&nbsp;&nbsp;必填：
<el-radio
@change="checkboxChange"
v-model="cItem.required"
:disabled="cItem.disabled ? cItem.disabled : false"
label="1"
>是</el-radio
>
<el-radio
@change="checkboxChange"
v-model="cItem.required"
:disabled="cItem.disabled ? cItem.disabled : false"
label="2"
>否</el-radio
>
</div>
</el-checkbox>
</div>
</div>
</el-checkbox-group>
</div>
<div class="form-set-pay">
<div class="sub-title">缴费设置</div>
<!--导入功能 新增 -->
<el-form-item label="批量导入功能:">
<el-radio v-model="data.can_import" :label="1">开启</el-radio>
<el-radio v-model="data.can_import" :label="0">关闭</el-radio>
</el-form-item>
<el-form-item label="缴费功能:">
<el-radio v-model="data.can_pay" :label="1">开启</el-radio>
<el-radio v-model="data.can_pay" :label="0">关闭</el-radio>
</el-form-item>
<template v-if="!!data.can_pay">
<el-form-item label="价格：" prop="pay_price">
<el-input style="width: 20%" v-model="data.pay_price"></el-input>
</el-form-item>
<el-form-item label="开票功能:">
<el-radio v-model="data.can_invoice" :label="1">开启</el-radio>
<el-radio v-model="data.can_invoice" :label="0">关闭</el-radio>
</el-form-item>
<!-- 缴费方式 新增-->
<el-form-item label="缴费方式:" prop="pay_type">
<el-select v-model="data.pay_type" multiple>
<el-option v-for="item in payType" :key="item.key" :label="item.value" :value="item.key"></el-option>
</el-select>
</el-form-item>
<el-form-item label="线下支付联系方式：" prop="offline_info" v-if="data.pay_type.includes('3')">
<el-input style="width: 20%" v-model="data.offline_info"></el-input>
</el-form-item>
<el-form-item label="线下支付信息：" prop="offline_more_info" v-if="data.pay_type.includes('3')">
<v-editor style="width: 500px" :maxHeight="200" :disabled="!!$route.query.type" v-model="data.offline_more_info"></v-editor>
</el-form-item>
<el-form-item label="单位优惠:">
<el-radio v-model="data.can_company" :label="1">开启</el-radio>
<el-radio v-model="data.can_company" :label="0">关闭</el-radio>
</el-form-item>
<el-form-item label="单位优惠金额:" prop="company_price" v-if="data.can_company">
<el-input style="width: 20%" v-model="data.company_price"></el-input>
</el-form-item>
<el-form-item label="跳转:">
<el-radio v-model="data.can_jump" :label="1">开启</el-radio>
<el-radio v-model="data.can_jump" :label="0">关闭</el-radio>
</el-form-item>
<template v-if="!!data.can_jump">
<el-form-item label="跳转链接:" prop="jump_url">
<el-input style="width: 20%" v-model="data.jump_url"></el-input>
</el-form-item>
</template>
<el-form-item label="跳过支付:">
<el-radio v-model="data.can_skip_pay" :label="1">开启</el-radio>
<el-radio v-model="data.can_skip_pay" :label="0">关闭</el-radio>
</el-form-item>
<el-form-item label="跳过文案:" prop="skip_pay_title" v-if="!!data.can_skip_pay">
<el-input style="width: 20%" v-model="data.skip_pay_title"></el-input>
</el-form-item>
<el-form-item label="支付平台:" prop="shop_id">
<el-select v-model="data.shop_id" placeholder="请选择">
<el-option v-for="item in shopMap" :key="item.key" :label="item.value" :value="item.key"> </el-option>
</el-select>
</el-form-item>
</template>
</div>
<div class="form-set-page">
<div class="sub-title">页面设置</div>
<el-form-item label="标题:" prop="title">
<el-input style="width: 20%" v-model="data.title"></el-input>
</el-form-item>
<el-form-item label="页面头部:" prop="desc">
<v-editor :disabled="!!$route.query.type" v-model="data.desc"></v-editor>
</el-form-item>
</div>
</el-form>
</div>
</template>
<script>
import VEditor from '@/components/tinymce/Index.vue'
export default {
components: { VEditor },
props: {
data: {
type: Object,
default: () => {}
}
},
data() {
return {
payType: [
{ key: '1', value: '微信' },
{ key: '2', value: '支付宝' },
{ key: '3', value: '线下支付' }
],
rules: {
title: { required: true, message: '请填写标题', trigger: 'blur' },
pay_price: [
{ required: true, message: '请填写支付金额', trigger: 'blur' },
{
trigger: 'blur',
min: 0,
validator(rule, value, callback) {
if (Number(value) > 0) {
callback()
} else {
callback(new Error('支付金额不能小于等于0元'))
}
}
}
],
jump_url: { required: true, message: '请填写跳转链接', trigger: 'blur' },
shop_id: { required: true, message: '请选择支付平台', trigger: 'change' },
skip_pay_title: { required: true, message: '请填写跳过支付文案', trigger: 'blur' },
pay_type: { required: true, message: '请填选择缴费方式', trigger: 'change' },
company_price: [
{ required: true, message: '请填写单位优惠金额', trigger: 'blur' },
{
trigger: 'blur',
min: 0,
validator(rule, value, callback) {
if (Number(value) > 0) {
callback()
} else {
callback(new Error('优惠金额不能小于等于0元'))
}
}
}
]
},
options: [],
checkList: [],
fieldList: [
{
title: '个人信息',
fields: [
{ key: 'name', label: '姓名', required: '1', disabled: true },
{ key: 'mobile', label: '电话', required: '1', disabled: true },
{ key: 'gender', label: '性别', required: '1' },
{ key: 'email', label: '邮箱', required: '1' },
{ key: 'company', label: '公司', required: '1' },
{ key: 'position', label: '职位', required: '1' },
{ key: 'number', label: '编号', required: '1' },
{ key: 'country', label: '国籍', required: '1' },
{ key: 'provinces', label: '省份', required: '1' },
{ key: 'city', label: '城市', required: '1' },
{ key: 'address', label: '地址', required: '1' },
{ key: 'fixed_telephone', label: '固话', required: '1' },
{ key: 'industry', label: '行业', required: '1' },
{ key: 'id_number', label: '身份证号码', required: '1' }
]
},
{
title: '社交信息',
fields: [
{ key: 'wechat', label: '微信', required: '1' },
{ key: 'qq', label: 'QQ', required: '1' },
{ key: 'ding', label: '钉钉', required: '1' },
{ key: 'weibo', label: '微博', required: '1' }
]
},
{
title: '入住信息',
fields: [
{ key: 'check_in_time', label: '入住时间', required: '1' },
{ key: 'check_out_time', label: '离店时间', required: '1' },
{ key: 'room_type', label: '房型', required: '1' },
{ key: 'breakfast', label: '早餐', required: '1' }
]
}
]
}
},
computed: {
shopMap() {
return this.$store.state.commonMap.details_shop_map
},
payTypeMap() {
return this.data.pay_type
}
},
created() {},
mounted() {
this.setInfoFields()
},
methods: {
// 信息设置数据回显
setInfoFields() {
this.fieldList = this.fieldList.reduce((a, b) => {
b.fields.map(item => {
const findData = this.data.user_fields.find(fData => fData.key === item.key)
if (findData) {
this.checkList.push(findData.key)
item.required = findData.required ? '1' : '2'
}
return item
})
a.push(b)
return a
}, [])
},
// 信息设置选择后 吧选择的编程后台需要的数据
checkboxChange() {
this.data.user_fields = this.fieldList.reduce((a, b) => {
b.fields.forEach(item => {
const findData = this.checkList.find(fData => fData === item.key)
if (findData) {
a.push({ key: item.key, required: !!(item.required === '1'), enable_edit: true })
}
})
return a
}, [])
this.data.pay_type = this.data.pay_type.toString()
},
submitForm() {
let flag = false
this.$refs.form.validate(valid => {
if (valid) {
this.checkboxChange()
flag = true
}
})
return flag
}
}
}
</script>
<style lang="scss" scoped>
.sub-title {
line-height: 100%;
font-size: 16px;
font-weight: bold;
color: #333333;
border-left: 3px solid rgba(184, 1, 64, 1);
padding-left: 7px;
margin-bottom: 25px;
}
.form-box {
padding-top: 15px;
}
::v-deep {
.form-set-info {
.el-form-item__content {
display: flex;
align-items: center;
}
.el-icon-remove-outline {
font-size: 22px;
margin-left: 10px;
color: rgba(214, 214, 214, 1);
cursor: pointer;
}
.required {
margin-left: 15px;
}
}
}
.form-set-pay {
border-bottom: 1px solid #d6d6d6;
padding: 25px 0 15px;
}
.form-set-page {
padding: 25px 0 15px;
border-bottom: 1px solid #d6d6d6;
}
.form-set-info {
border-bottom: 1px solid #d6d6d6;
padding-bottom: 30px;
.field-list {
margin-bottom: 30px;
.field-list_title {
font-size: 16px;
font-weight: bold;
line-height: 100%;
color: #333333;
}
.field-list_content {
padding-top: 15px;
.checkbox {
display: flex;
align-items: center;
}
}
}
}
</style>
src/modules/menu/components/SetBasic.vue deleted 100644 → 0
浏览文件 @ 67608a78
<template>
<div>
<el-form ref="form" :disabled="!!$route.query.type" :inline="true" :rules="rules" :model="form">
<el-form-item label="页面标题：" prop="title">
<el-input v-model="form.title"></el-input>
</el-form-item>
<el-form-item label="活动名称：" prop="name">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="人数限制：" prop="max_number">
<el-input v-model="form.max_number"></el-input>
</el-form-item>
<el-form-item label="关联项目：" prop="project_id">
<el-select v-model="form.project_id" placeholder="请选择">
<el-option v-for="item in projectMap" :key="item.key" :label="item.value" :value="item.key"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="活动开始时间：" prop="activity_time">
<el-date-picker
v-model="form.activity_time"
type="datetime"
@change="activityDateChange"
placeholder="选择日期时间"
:picker-options="pickerOptions"
>
</el-date-picker>
</el-form-item>
<el-form-item label="报名时间：" prop="time">
<el-date-picker
@change="dateChange"
v-model="form.time"
type="datetimerange"
range-separator="至"
start-placeholder="报名开始日期"
end-placeholder="报名结束日期"
>
</el-date-picker>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
props: {
form: { type: Object, default: () => {} }
},
data() {
return {
rules: {
title: { required: true, message: '请填写页面标题', trigger: 'blur' },
name: { required: true, message: '请填写活动标题', trigger: 'blur' },
max_number: [
{ required: true, message: '请填写最大参与人数', trigger: 'blur' },
{
trigger: 'blur',
min: 1,
message: '最大人数限制不能小于1人',
validator(rule, value, callback) {
if (parseInt(Number(value)) && Number(value) >= 1) {
callback()
} else {
callback(new Error('最大人数限制不能小于1人'))
}
}
}
],
project_id: { required: true, message: '请关联项目', trigger: 'change' },
time: { required: true, message: '请选择时间', trigger: 'change' },
activity_time: { required: true, message: '请选择时间', trigger: 'change' }
},
pickerOptions: {
disabledDate(v) {
return v.getTime() < new Date().getTime() - 86400000
}
}
}
},
computed: {
projectMap() {
return this.$store.state.commonMap.project_map || {}
}
},
mounted() {
console.log(this.form)
},
methods: {
submitForm() {
let flag = false
this.$refs.form.validate(valid => {
if (valid) {
flag = true
}
})
return flag
},
// 日期改变的时候。吧日期转成后台需要的格式
dateChange(date) {
this.form.start_time = this.setDate(date[0])
this.form.end_time = this.setDate(date[1])
},
setDate(val) {
const d = new Date(val)
const date = `${d.getFullYear()}-${this.toDo(d.getMonth() + 1)}-${this.toDo(d.getDate())} ${this.toDo(
d.getHours()
)}:${this.toDo(d.getMinutes())}:${this.toDo(d.getSeconds())}`
return date
},
toDo(n) {
return n < 10 ? `0${n}` : n
},
activityDateChange() {
this.form.activity_time = this.setDate(this.form.activity_time)
}
}
}
</script>
<style lang="scss" scoped></style>
src/modules/pages/views/List.vue
浏览文件 @ 0f3e8c1c
......@@ -16,9 +16,6 @@
>
</el-date-picker>
</template>
<template v-slot:picture="{ row }">
<div :style="`background-image:url(${row.picture});background-size: cover;width:50px;height:40px;`"></div>
</template>
<template v-slot:release-status="{ row }">
<el-switch v-model="row.status" @change="updateStatus(row)"> </el-switch>
</template>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论