提交 8fcc6cba authored 作者: lihuihui's avatar lihuihui

update

上级 bcf4bd14
......@@ -28,7 +28,8 @@ export default {
{ name: '功能区管理', path: '/menu/list', icon: 'el-icon-menu' },
{ name: '图文管理', path: '/essay/list', icon: 'el-icon-connection' },
{ name: '页面管理', path: '/pages/list', icon: 'el-icon-postcard' },
{ name: '通知管理', path: '/notice/list', icon: 'el-icon-chat-line-square' }
{ name: '通知管理', path: '/notice/list', icon: 'el-icon-chat-line-square' },
{ name: '首页管理', path: '/home', icon: 'el-icon-s-home' }
]
}
},
......
......@@ -25,7 +25,7 @@
<el-switch v-model="row.status" @change="updateStatus(row)"> </el-switch>
</template>
<template v-slot:sort-select="{ row }">
<el-select style="width: px;" v-model="row.sort" placeholder="请选择" @change="updateStatus(row)">
<el-select style="width: px" v-model="row.sort" placeholder="请选择" @change="updateStatus(row)">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</template>
......
import httpRequest from '@/utils/axios'
/**
* 新建页面
*/
export function updateInfo(data) {
return httpRequest.post('/api/road/v1/backend/area/update', data)
}
/**
* 获取应用列表
*/
export function getAppList(params) {
return httpRequest.get('/api/road/v1/backend/area/list', { params })
}
<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>
<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 #1655b2;
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>
<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>
import AppLayout from '@/components/layout/Index.vue'
const routes = [
{
path: '/home',
component: AppLayout,
children: [
{ path: '/', component: () => import('./views/Index.vue') }
]
}
]
export { routes }
<template>
<div>
<div class="breadcrumb">首页管理</div>
<app-card class="register-box">
<el-tabs v-model="activeName">
<el-tab-pane label="培训动态" name="1">
<el-form :model="form1" label-width="100px" style="width: 400px">
<el-form-item label="标题">
<el-input v-model="form1.title"></el-input>
</el-form-item>
<el-form-item label="跳转链接">
<el-input v-model="form1.url"></el-input>
</el-form-item>
<el-form-item label="更多跳转链接">
<el-input v-model="form1.desc"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="updateInfo(form1)">保存</el-button>
</el-form-item>
</el-form>
</el-tab-pane>
<el-tab-pane label="左侧卡片" name="2">
<el-form :model="form2" label-width="100px" style="width: 400px">
<el-form-item label="标题">
<el-input v-model="form2.title"></el-input>
</el-form-item>
<el-form-item label="副标题">
<el-input v-model="form2.desc"></el-input>
</el-form-item>
<el-form-item label="跳转链接">
<el-input v-model="form2.url"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="updateInfo(form2)">保存</el-button>
</el-form-item>
</el-form>
</el-tab-pane>
<el-tab-pane label="右上卡片" name="3">
<el-form :model="form3" label-width="100px" style="width: 400px">
<el-form-item label="标题">
<el-input v-model="form3.title"></el-input>
</el-form-item>
<el-form-item label="副标题">
<el-input v-model="form3.desc"></el-input>
</el-form-item>
<el-form-item label="跳转链接">
<el-input v-model="form3.url"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="updateInfo(form3)">保存</el-button>
</el-form-item>
</el-form>
</el-tab-pane>
<el-tab-pane label="右下卡片" name="4">
<el-form :model="form4" label-width="100px" style="width: 400px">
<el-form-item label="标题">
<el-input v-model="form4.title"></el-input>
</el-form-item>
<el-form-item label="副标题">
<el-input v-model="form4.desc"></el-input>
</el-form-item>
<el-form-item label="跳转链接">
<el-input v-model="form4.url"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="updateInfo(form4)">保存</el-button>
</el-form-item>
</el-form>
</el-tab-pane>
</el-tabs>
</app-card>
</div>
</template>
<script>
import { getAppList, updateInfo } from '../api.js'
export default {
data() {
return {
form1: {
title: '',
url: '',
desc: ''
},
form2: {
title: '',
title2: '',
url: ''
},
form3: {
title: '',
title2: '',
url: ''
},
form4: {
title: '',
title2: '',
url: ''
},
activeName: '1'
}
},
mounted() {
getAppList().then(res => {
const data = res.data.list
this.form1 = data.find(i => i.type === '4')
this.form2 = data.find(i => i.type === '1')
this.form3 = data.find(i => i.type === '2')
this.form4 = data.find(i => i.type === '3')
})
},
methods: {
updateInfo(item) {
updateInfo(item).then(res => {
this.$message({
message: '保存成功',
type: 'success'
})
})
}
}
}
</script>
<style lang="scss"></style>
......@@ -14,6 +14,9 @@
<el-radio label="2">二级列表页</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="展示条数" v-if="ruleForm.type == '1'">
<el-input type="number" v-model="ruleForm.size" placeholder="请填写展示的条数"></el-input>
</el-form-item>
<el-form-item label="页面模板">
<el-radio-group v-model="ruleForm.layout">
<div style="margin-top: 10px; padding-bottom: 10px">
......@@ -53,7 +56,8 @@ export default {
ruleForm: {
type: '1',
layout: '1',
title: ''
title: '',
size: 3
}
}
},
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论