ZhangBin
/
datang-admin
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

添加轮播图

master
song 3 years ago
parent
b2a04a496a
commit
95ea2a5eec
11 changed files with 552 additions and 1209 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 152
      src/api/carousel.js
  2. 204
      src/components/Banner/detailsOfDistribution.vue
  3. 190
      src/components/Banner/index.vue
  4. 584
      src/filters/code.js
  5. 4
      src/styles/index.scss
  6. 118
      src/views/index/detailsOfDistribution.vue
  7. 60
      src/views/index/form.vue
  8. 4
      src/views/index/index.vue
  9. 118
      src/views/richText/detailsOfDistribution.vue
  10. 60
      src/views/richText/form.vue
  11. 267
      src/views/richText/index.vue

152
src/api/carousel.js
View File

@ -12,7 +12,9 @@ export function POST_QUERY_CAROUSEL(params) {
url: `${carousel}/queryCarousel`, url: `${carousel}/queryCarousel`,
method: 'post', method: 'post',
data:params data:params
}).then(res => res.data.data) }).then(res => {
return res.data
})
} }
/** /**
@ -26,153 +28,23 @@ export function POST_DELETE_CAROUSEL(params) {
url: `${carousel}/deleteCarousel`, url: `${carousel}/deleteCarousel`,
method: 'post', method: 'post',
data:params data:params
}).then(res => res.data.data) }).then(res => {
return res.data
})
} }
/** /**
* 设备分润 -- 分润详情 * 修改轮播图
* @param params * @param params
* @returns {Promise<T | never>} * @returns {Promise<T | never>}
* @constructor * @constructor
*/ */
export function DETAIL_EQUIPMENT_LIST(params) { export function UPDATE_CAROUSEL(params) {
return request({ return request({
url: "/api/admin/deviceRoyalties/detail", url: `${carousel}/updateCarousel`,
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 设备分润 -- 分润总数
* @param params
* @returns {Promise<T | never>}
* @constructor
*/
export function COUNT_EQUIPMENT_LIST(params) {
return request({
url: "/api/admin/deviceRoyalties/count",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 设备分润 -- 生效
* @param params
* @returns {Promise<T | never>}
* @constructor
*/
export function ENABLE_EQUIPMENT_LIST(params) {
return request({
url: "/api/admin/deviceRoyalties/enable",
method: 'post',
params
}).then(res => res.data.data)
}
/**
* 设备分润 -- 失效
* @param params
* @returns {Promise<T | never>}
* @constructor
*/
export function DISABLE_EQUIPMENT_LIST(params) {
return request({
url: "/api/admin/deviceRoyalties/disable",
method: 'post',
params
}).then(res => res.data.data)
}
/**
* 场地分润 -- 列表
* @param params
* @returns {Promise<T | never>}
* @constructor
*/
export function GET_FIELD_LIST(params) {
return request({
url: "/api/admin/locationRoyalties",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 场地分润 -- 保存分润
* @param params
* @returns {Promise<T | never>}
* @constructor
*/
export function POST_FIELD_LIST(params) {
return request({
url: "/api/admin/locationRoyalties",
method: 'post', method: 'post',
data:params data:params
}).then(res => res.data.data) }).then(res => {
} return res.data
})
/**
* 场地分润 -- 分润总数
* @param params
* @returns {Promise<T | never>}
* @constructor
*/
export function COUNT_FIELD_LIST(params) {
return request({
url: "/api/admin/locationRoyalties/count",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 场地分润 -- 分润详情
* @param params
* @returns {Promise<T | never>}
* @constructor
*/
export function DETAIL_FIELD_LIST(params) {
return request({
url: "/api/admin/locationRoyalties/detail",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 场地分润 -- 生效
* @param params
* @returns {Promise<T | never>}
* @constructor
*/
export function ENABLE_FIELD_LIST(params) {
return request({
url: "/api/admin/locationRoyalties/enable",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 场地分润 -- 失效
* @param params
* @returns {Promise<T | never>}
* @constructor
*/
export function DISABLE_FIELD_LIST(params) {
return request({
url: "/api/admin/locationRoyalties/disable",
method: 'get',
params
}).then(res => res.data.data)
} }

204
src/components/Banner/detailsOfDistribution.vue
View File

@ -1,118 +1,146 @@
<template> <template>
<el-row> <div class="container">
<el-col :span="24" style="margin-bottom: 10px;"> <div class="title">修改轮播图</div>
<div class="grid-content bg-purple-dark"> <el-form :model="formLabelAlign" ref="formLabelAlign" label-width="100px" class="demo-ruleForm">
<el-col :span="12"> <el-form-item label="图片：">
<div class="grid-content bg-purple">分润对象:</div> <el-upload
</el-col> class="avatar-uploader"
<el-col :span="12"> :action="`${BASE_API}/file/upload`"
<div class="grid-content bg-purple-light">分润比例:</div> :show-file-list="false"
</el-col> :on-success="handleAvatarSuccess"
</div> :before-upload="beforeAvatarUpload"
</el-col> >
<el-col :span="24" v-for="(item,index) in lists" style="margin-bottom: 10px;"> <img v-if="formLabelAlign.url" :src="formLabelAlign.url" class="avatar w-full">
<el-form :inline="true" class="demo-form-inline"> <i v-else class="el-icon-plus avatar-uploader-icon"></i>
<div class="grid-content bg-purple-dark"> </el-upload>
<el-row :gutter="15"> </el-form-item>
<el-col :span="10"> <el-form-item label="位置：">
<div class="grid-content bg-purple"> <el-cascader
<el-select v-model="item.userId" :value="item.userId" placeholder="选择分润对象"> v-model="formLabelAlign.showPage"
<el-option v-for="opi in accounts" :label="opi.name" :value="opi.id"></el-option> :props="props"
</el-select> :options="tabList"
</div> @change="handleChange">
</el-col> </el-cascader>
<el-col :span="10"> </el-form-item>
<div class="grid-content bg-purple-light"> <el-form-item label="状态：">
<el-input placeholder="" @input="limitMax(item.rate,index)" v-model="item.rate" max="100" min="1"></el-input> <el-radio-group v-model="formLabelAlign.recStatus" @change="changeStatus">
</div> <el-radio :label="0">正常</el-radio>
</el-col> <el-radio :label="1">禁用</el-radio>
<el-col :span="4"> </el-radio-group>
<div class="grid-content bg-purple-light"> </el-form-item>
<el-button type="danger" @click="deleteObj(index)" icon="el-icon-delete"></el-button> <el-form-item>
</div> <el-button type="primary" @click="updateCarousel(formLabelAlign)">确定</el-button>
</el-col> <el-button @click="$emit('close')">取消</el-button>
</el-form-item>
</el-row> </el-form>
</div> </div>
</el-form>
</el-col>
<el-button @click="addObj">添加分润对象</el-button>
</el-row>
</template> </template>
<script> <script>
import {GET_ACCOUNT_LIST} from '@/api/privilegeManagement' import {BASE_API} from '../../config';
import {DETAIL_FIELD_LIST} from '@/api/distribution' import {tabList} from '../../filters/code';
import {
UPDATE_CAROUSEL,
} from '@/api/carousel';
import Alert from "@/utils/alert"; import Alert from "@/utils/alert";
export default { export default {
name: "detailsOfDistribution", name: "detailsOfDistribution",
props: ['currId'], props: ['currList'],
data() { data() {
return { return {
lists: [], labelPosition: 'right',
accounts: [] formLabelAlign: {
url: '',
showPage: ['00', '0000'],
recStatus: ''
},
BASE_API,
tabList,
props: {
value: 'code',
label: 'title',
children: 'children'
},
} }
}, },
watch: {
currId() {
}
},
mounted() { mounted() {
this.getAccounts(); if(!this.currList) return
this.getDetail(); const { url, showPage, recStatus } = this.currList
this.formLabelAlign.url = url;
this.formLabelAlign.showPage[0] = showPage.slice(0, 2);
this.formLabelAlign.showPage[1] = showPage;
this.formLabelAlign.recStatus = recStatus;
}, },
methods: { methods: {
getDetail() {
let params = {
id: this.currId
};
DETAIL_FIELD_LIST(params).then(res => {
this.lists = res
})
},
/** /**
* 添加分润对象 * 上传预览图
* @param {*} res
* @param {*} file
*/ */
addObj() { handleAvatarSuccess(res) {
let obj = { if (res.data && res.data.path) {
userId: '', this.formLabelAlign.url = res.data.path;
rate: '' }
}; },
this.lists.push(obj) beforeAvatarUpload(file) {
// const isJPG = file.type === 'image/jpeg';
// if (!isJPG) {
// ElMessage.error('上传头像图片只能是 JPG 格式!');
// }
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isLt2M) {
ElMessage.error('上传头像图片大小不能超过 2MB!');
}
return isLt2M;
},
// 位置选择
handleChange(value) {
console.log(value);
this.formLabelAlign.showPage = value
},
// 修改状态
changeStatus(value){
console.log('value: ', value);
this.formLabelAlign.recStatus = value;
}, },
/** /**
* 删除分润对象 * 修改轮播图
*/ */
deleteObj(idx) { async updateCarousel(formName){
let lists = []; console.log('formName: ', formName);
this.lists.map((item, index) => { const { url, showPage, recStatus } = formName;
if (idx != index) { const { id } = this.currList;
lists.push(item) const params = {
id,
url,
showPage: showPage[1],
recStatus
};
await UPDATE_CAROUSEL(params).then((res) => {
if(res.code === 200){
Alert.success('修改成功');
this.$emit('close', true)
}else{
Alert.fail(res.msg || '修改失败');
} }
return item;
});
this.lists = lists
},
getAccounts() {
GET_ACCOUNT_LIST().then(res => {
this.accounts = res;
}) })
},
limitMax(val, idx) {
if (val >= 100 || val <= 0) {
Alert.fail('值不能大于100,小于0');
val = ''
}
this.lists[idx].rate = val;
} }
} }
} }
</script> </script>
<style rel="stylesheet/scss" lang="scss" scoped> <style lang="scss" scoped>
.title{
width: 100%;
margin-bottom: 30px;
font-size: 20px;
font-weight: bold;
text-align: center;
}
</style> </style>

190
src/components/Banner/index.vue
View File

@ -1,53 +1,59 @@
<template> <template>
<div> <div>
<el-button
type="primary"
icon="el-icon-plus"
style="margin-bottom: 15px;">
添加
</el-button>
<div class="table"> <div class="table">
<el-table <el-table
:data="lists" :data="lists"
style="width: 100%"> style="width: 100%">
<el-table-column <el-table-column
prop="id" prop="id"
label="序号" label="序号"
type="index" type="index"
align="center"> align="center">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="name" prop="name"
label="图片" label="图片"
align="center"> align="center">
<template slot-scope="lists"> <template slot-scope="lists">
<img :src="lists.row.url" width="100%" alt="" @click="openPic(lists.row.url)"> <img :src="lists.row.url" width="100%" alt="" @click="openPic(lists.row.url)">
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="name" prop="name"
label="位置" label="位置"
align="center"> align="center"
width="250">
<template slot-scope="lists"> <template slot-scope="lists">
{{ setCode(lists.row.showPage) }} {{ setCode(lists.row.showPage) }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="name" prop="name"
label="状态" label="状态"
align="center"> align="center"
width="250">
<template slot-scope="lists"> <template slot-scope="lists">
<el-tag v-if="lists.row.recStatus === 0">正常</el-tag> <el-tag v-if="lists.row.recStatus === 0">正常</el-tag>
<el-tag v-if="lists.row.recStatus === 1" type="info">禁用</el-tag> <el-tag v-if="lists.row.recStatus === 1" type="info">禁用</el-tag>
<el-tag v-if="lists.row.recStatus === 2" type="danger">删除</el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
fixed="right" fixed="right"
label="操作" label="操作"
align="center" align="center"
> width="250">
<template slot-scope="lists"> <template slot-scope="lists">
<el-button <el-button
type="primary" type="primary"
icon="el-icon-edit" icon="el-icon-edit"
style="margin-right: 15px;" style="margin-right: 15px;"
@click="editModal(lists.row.id)" @click="editModal(lists.row)"
size="mini"> size="mini">
编辑 编辑
</el-button> </el-button>
@ -69,25 +75,22 @@
</el-table> </el-table>
<div class="pagination"> <div class="pagination">
<el-pagination <el-pagination
background background
:page-size="pageSize" :page-size="pageSize"
layout="prev, pager, next" layout="prev, pager, next"
:total="count" :total="count"
@current-change="currentChange" @current-change="currentChange"
> >
</el-pagination> </el-pagination>
</div> </div>
</div> </div>
<!-- 编辑弹框 -->
<el-dialog <el-dialog
width="400px" width="600px"
:show-close="false" :show-close="false"
:visible.sync="isEdit"> :visible.sync="isEdit">
<details-of-distribution ref="distribution" :currId="id" v-if="isEdit"></details-of-distribution> <details-of-distribution ref="distribution" :currList="currList" v-if="isEdit" @close="close"></details-of-distribution>
<div slot="footer" class="dialog-footer">
<el-button @click="isEdit = false">取消</el-button>
<el-button type="primary" @click="determine('ruleForm')">确定</el-button>
</div>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
@ -119,6 +122,7 @@
isEdit: false, isEdit: false,
tabList, tabList,
lists: [], lists: [],
currList: null,
pageSize: 10, pageSize: 10,
pageNum: 1, pageNum: 1,
visible: false, visible: false,
@ -148,10 +152,14 @@
showPage showPage
}; };
POST_QUERY_CAROUSEL(params).then(res => { POST_QUERY_CAROUSEL(params).then(res => {
this.lists = res.list if(res.code === 200){
this.pageNum = res.pageNum this.lists = res.data.list
this.pageSize = res.pageSize this.pageNum = res.data.pageNum
this.count = res.size this.pageSize = res.data.pageSize
this.count = res.data.size
}else{
Alert.fail(res.msg || '获取失败');
}
}); });
}, },
@ -170,13 +178,24 @@
// 设置显示位置 // 设置显示位置
setCode(showPage){ setCode(showPage){
const item = this.tabList.find((item) => item.code == showPage) let item = null
for (let i = 0; i < this.tabList.length; i++) {
const list = this.tabList[i];
for (let j = 0; j < list.children.length; j++) {
const curItem = list.children[j];
if(curItem.code == showPage){
item = curItem
break;
}
}
}
return item.title return item.title
}, },
editModal(id) { editModal(currList) {
this.isEdit = true; this.isEdit = true;
this.id = id; // this.id = id;
this.currList = currList
}, },
/** /**
@ -186,84 +205,23 @@
const params = { const params = {
id id
}; };
// POST_DELETE_CAROUSEL(params).then(() => { POST_DELETE_CAROUSEL(params).then((res) => {
// this.getList() if(res.code === 200){
// }); Alert.success('删除成功');
this.getList()
}else{
Alert.fail(res.msg || '删除失败');
}
});
this.visible = false this.visible = false
}, },
/**
* 已发布
* @constructor
*/
PUBLISHED(id) {
let params = {
id
};
// DISABLE_FIELD_LIST(params).then((res) => {
// let lists = [];
// this.lists.map((item) => {
// if (item.id == id) {
// item.stateText = '失效中';
// item.enabled = false;
// }
// lists.push(item);
// return item;
// });
// this.lists = lists;
// Alert.success("已失效");
// });
},
/**
* 已暂停或者待发布
* @constructor
*/
PAUSEDANDPENDING(id) {
let params = {
id
};
// ENABLE_FIELD_LIST(params).then((res) => {
// let lists = [];
// this.lists.map((item) => {
// if (item.id == id) {
// item.stateText = '生效中';
// item.enabled = true;
// }
// lists.push(item);
// return item;
// });
// this.lists = lists;
// Alert.success("已生效");
// });
},
determine() {
let that = this;
let child = this.$refs.distribution.lists;
let params = {
id: this.id,
items: child
};
for (let index in child) { // 关闭弹窗
if (!child[index].rate || !child[index].userId) { close(type){
Alert.fail("值不能为空"); this.isEdit = false
return false; if(type){
} this.getList()
}
for (let i = 0; i < child.length; i++) {
for (let j = i + 1; j < child.length; j++) {
if (child[i].userId == child[j].userId) {
Alert.fail("分润对象不能一样");
return false;
}
}
} }
// POST_FIELD_LIST(params).then(res => {
// Alert.success("添加成功");
// that.isEdit = false;
// that.getList();
// });
} }
} }
} }

584
src/filters/code.js
View File

@ -1,292 +1,358 @@
export const tabList = [ export const tabList = [
{ {
title: '首页', title: '首页',
code: '0000', code: '00',
children: [
{
title: '首页',
code: '0000',
}
]
}, },
// 公司概况 // 公司概况
{ {
title: '公司简介', title: '公司概况',
code: '0101', code: '01',
}, children: [
{ {
title: '公司领导', title: '公司简介',
code: '0102', code: '0101',
}, },
{ {
title: '组织架构', title: '公司领导',
code: '0103', code: '0102',
}, },
{ {
title: '企业VI', title: '组织架构',
code: '0104', code: '0103',
}, },
{ {
title: '联系方式', title: '企业VI',
code: '0105', code: '0104',
},
{
title: '联系方式',
code: '0105',
},
]
}, },
// 新闻中心 // 新闻中心
{ {
title: '集团新闻', title: '新闻中心',
code: '0201', code: '02',
}, children: [
{ {
title: '省公司新闻', title: '集团新闻',
code: '0202', code: '0201',
}, },
{ {
title: '公司新闻', title: '省公司新闻',
code: '0203', code: '0202',
}, },
{ {
title: '图片新闻', title: '公司新闻',
code: '0204', code: '0203',
}, },
{ {
title: '热点专题', title: '图片新闻',
code: '0205', code: '0204',
}, },
{ {
title: '媒体关注', title: '热点专题',
code: '0206', code: '0205',
}, },
{ {
title: '视频新闻', title: '媒体关注',
code: '0207', code: '0206',
}, },
{ {
title: '专题片', title: '视频新闻',
code: '0208', code: '0207',
}, },
{ {
title: '企业画册', title: '专题片',
code: '0209', code: '0208',
}, },
{ {
title: '现场风采', title: '企业画册',
code: '0210', code: '0209',
},
{
title: '现场风采',
code: '0210',
},
]
}, },
// 党的建设 // 党的建设
{ {
title: '中心组学习', title: '党的建设',
code: '0301', code: '03',
}, children: [
{ {
title: '示范党委', title: '中心组学习',
code: '0302', code: '0301',
}, },
{ {
title: '党支部达标', title: '示范党委',
code: '0303', code: '0302',
}, },
{ {
title: '群团工作', title: '党支部达标',
code: '0304', code: '0303',
}, },
{ {
title: '党建动态', title: '群团工作',
code: '0305', code: '0304',
}, },
{ {
title: '党风廉政', title: '党建动态',
code: '0306', code: '0305',
},
{
title: '党风廉政',
code: '0306',
},
]
}, },
// 安全生产 // 安全生产
{ {
title: '安全会议', title: '安全生产',
code: '0401', code: '04',
}, children: [
{ {
title: '安全生产记录', title: '安全会议',
code: '0402', code: '0401',
}, },
{ {
title: '应急管理', title: '安全生产记录',
code: '0403', code: '0402',
}, },
{ {
title: '三讲一落实', title: '应急管理',
code: '0404', code: '0403',
}, },
{ {
title: '曝光台', title: '三讲一落实',
code: '0405', code: '0404',
},
{
title: '曝光台',
code: '0405',
},
],
}, },
// 通知公告 // 通知公告
{ {
title: '通知', title: '通知公告',
code: '0501', code: '05',
}, children: [
{ {
title: '通报', title: '通知',
code: '0502', code: '0501',
}, },
{ {
title: '公告', title: '通报',
code: '0503', code: '0502',
}, },
{ {
title: '值班安排', title: '公告',
code: '0504', code: '0503',
}, },
{ {
title: '浮窗', title: '值班安排',
code: '0505', code: '0504',
},
{
title: '浮窗',
code: '0505',
},
],
}, },
// 信息公开 // 信息公开
{ {
title: '基本信息', title: '信息公开',
code: '0601', code: '06',
}, children: [
{ {
title: '经营管理', title: '基本信息',
code: '0602', code: '0601',
}, },
{ {
title: '公司公告', title: '经营管理',
code: '0603', code: '0602',
}, },
{ {
title: '社会责任', title: '公司公告',
code: '0604', code: '0603',
}, },
{ {
title: '关于信息公开', title: '社会责任',
code: '0605', code: '0604',
},
{
title: '关于信息公开',
code: '0605',
},
],
}, },
// 审批事项 // 审批事项
{ // {
title: '公务用车', // title: '审批事项',
code: '', // code: '07',
}, // children: [
{ // {
title: '领导干部外出报备', // title: '公务用车',
code: '', // code: '',
}, // },
{ // {
title: '疫情防控', // title: '领导干部外出报备',
code: '', // code: '',
}, // },
{ // {
title: '用印申请', // title: '疫情防控',
code: '', // code: '',
}, // },
{ // {
title: '业务招待事项', // title: '用印申请',
code: '', // code: '',
}, // },
{ // {
title: '会议室使用', // title: '业务招待事项',
code: '', // code: '',
}, // },
{ // {
title: '办公用品领用', // title: '会议室使用',
code: '', // code: '',
}, // },
// {
// title: '办公用品领用',
// code: '',
// },
// ],
// },
// 制度资料 // 制度资料
{ {
title: '集团公司制度', title: '制度资料',
code: '0801', code: '08',
}, children: [
{ {
title: '山西公司制度', title: '集团公司制度',
code: '0802', code: '0801',
}, },
{ {
title: '行业标准与制度', title: '山西公司制度',
code: '0803', code: '0802',
}, },
{ {
title: '公司制度', title: '行业标准与制度',
code: '0804', code: '0803',
}, },
{ {
title: '地方规章', title: '公司制度',
code: '0805', code: '0804',
}, },
{ {
title: '培训课件', title: '地方规章',
code: '0806', code: '0805',
}, },
{ {
title: '培训影像', title: '培训课件',
code: '0807', code: '0806',
}, },
{ {
title: '科技创新', title: '培训影像',
code: '0808', code: '0807',
},
{
title: '科技创新',
code: '0808',
},
],
}, },
// 部门首页 // 部门首页
{ {
title: '总经理工作部', title: '部门首页',
code: '0901', code: '09',
}, children: [
{ {
title: '计划营销部', title: '总经理工作部',
code: '0902', code: '0901',
}, },
{ {
title: '财务管理部', title: '计划营销部',
code: '0903', code: '0902',
}, },
{ {
title: '人力资源部', title: '财务管理部',
code: '0904', code: '0903',
}, },
{ {
title: '党群工作部', title: '人力资源部',
code: '0905', code: '0904',
}, },
{ {
title: '纪委办公室（审计部）', title: '党群工作部',
code: '0906', code: '0905',
}, },
{ {
title: '燃料采购部', title: '纪委办公室（审计部）',
code: '0907', code: '0906',
}, },
{ {
title: '物资管理部', title: '燃料采购部',
code: '0908', code: '0907',
}, },
{ {
title: '项目开发部', title: '物资管理部',
code: '0909', code: '0908',
}, },
{ {
title: '燃料质量验收部', title: '项目开发部',
code: '0910', code: '0909',
}, },
{ {
title: '安全监督部', title: '燃料质量验收部',
code: '0911', code: '0910',
}, },
{ {
title: '设备部', title: '安全监督部',
code: '0912', code: '0911',
}, },
{ {
title: '发电部', title: '设备部',
code: '0913', code: '0912',
}, },
{ {
title: '维护部', title: '发电部',
code: '0914', code: '0913',
}, },
{ {
title: '热工专业', title: '维护部',
code: '0915', code: '0914',
}, },
{ {
title: '电气专业', title: '热工专业',
code: '0916', code: '0915',
},
{
title: '电气专业',
code: '0916',
},
],
}, },
// 其他 // 其他
{ {
title: '光荣榜', title: '其他',
code: '9902', code: '99',
}, children: [
{ {
title: '今天我出境', title: '光荣榜',
code: '9903', code: '9902',
},
{
title: '今天我出境',
code: '9903',
},
],
}, },
] ]

4
src/styles/index.scss
View File

@ -259,3 +259,7 @@ h1, h2, h3 {
.el-date-editor .el-range-separator { .el-date-editor .el-range-separator {
width: 7%; width: 7%;
} }
.w-full{
width: 100%;
}

118
src/views/index/detailsOfDistribution.vue
View File

@ -1,118 +0,0 @@
<template>
<el-row>
<el-col :span="24" style="margin-bottom: 10px;">
<div class="grid-content bg-purple-dark">
<el-col :span="12">
<div class="grid-content bg-purple">分润对象:</div>
</el-col>
<el-col :span="12">
<div class="grid-content bg-purple-light">分润比例:</div>
</el-col>
</div>
</el-col>
<el-col :span="24" v-for="(item,index) in lists" style="margin-bottom: 10px;">
<el-form :inline="true" class="demo-form-inline">
<div class="grid-content bg-purple-dark">
<el-row :gutter="15">
<el-col :span="10">
<div class="grid-content bg-purple">
<el-select v-model="item.userId" :value="item.userId" placeholder="选择分润对象">
<el-option v-for="opi in accounts" :label="opi.name" :value="opi.id"></el-option>
</el-select>
</div>
</el-col>
<el-col :span="10">
<div class="grid-content bg-purple-light">
<el-input placeholder="" @input="limitMax(item.rate,index)" v-model="item.rate" max="100" min="1"></el-input>
</div>
</el-col>
<el-col :span="4">
<div class="grid-content bg-purple-light">
<el-button type="danger" @click="deleteObj(index)" icon="el-icon-delete"></el-button>
</div>
</el-col>
</el-row>
</div>
</el-form>
</el-col>
<el-button @click="addObj">添加分润对象</el-button>
</el-row>
</template>
<script>
import {GET_ACCOUNT_LIST} from '@/api/privilegeManagement'
import {DETAIL_FIELD_LIST} from '@/api/distribution'
import Alert from "@/utils/alert";
export default {
name: "detailsOfDistribution",
props: ['currId'],
data() {
return {
lists: [],
accounts: []
}
},
watch: {
currId() {
}
},
mounted() {
this.getAccounts();
this.getDetail();
},
methods: {
getDetail() {
let params = {
id: this.currId
};
DETAIL_FIELD_LIST(params).then(res => {
this.lists = res
})
},
/**
* 添加分润对象
*/
addObj() {
let obj = {
userId: '',
rate: ''
};
this.lists.push(obj)
},
/**
* 删除分润对象
*/
deleteObj(idx) {
let lists = [];
this.lists.map((item, index) => {
if (idx != index) {
lists.push(item)
}
return item;
});
this.lists = lists
},
getAccounts() {
GET_ACCOUNT_LIST().then(res => {
this.accounts = res;
})
},
limitMax(val, idx) {
if (val >= 100 || val <= 0) {
Alert.fail('值不能大于100,小于0');
val = ''
}
this.lists[idx].rate = val;
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
</style>

60
src/views/index/form.vue
View File

@ -1,60 +0,0 @@
<template>
<div class="form-container">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="场地">
<el-select v-model="formInline.locationId" value="" placeholder="场地">
<el-option label="全部" value=""></el-option>
<el-option v-for="item in locationId" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item style="padding-left:30px">
<el-button type="default" @click="resetForm1('formInline')">重置</el-button>
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import {GET_LOCATIONS} from '@/api/common'
export default {
name: 'form-container',
props: ['label'],
data() {
return {
formInline: {
locationId: ''
},
locationId: ''
}
},
mounted() {
this.getLocationId();
},
methods: {
getLocationId() {
GET_LOCATIONS().then(res => {
this.locationId = res
})
},
onSubmit() {
this.$emit('submit', this.formInline)
},
resetForm1() {
this.formInline = {
name: ''
};
this.$emit('resetForm');
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.form-container {
padding: 20px;
background: #fff;
}
</style>

4
src/views/index/index.vue
View File

@ -4,9 +4,9 @@
<el-tab-pane label="轮播图管理" name="IMAGE"> <el-tab-pane label="轮播图管理" name="IMAGE">
<banner :showPage="showPage" /> <banner :showPage="showPage" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="详情页管理" name="DETAIL"> <!-- <el-tab-pane label="详情页管理" name="DETAIL">
<detail /> <detail />
</el-tab-pane> </el-tab-pane> -->
</el-tabs> </el-tabs>
</div> </div>
</template> </template>

118
src/views/richText/detailsOfDistribution.vue
View File

@ -1,118 +0,0 @@
<template>
<el-row>
<el-col :span="24" style="margin-bottom: 10px;">
<div class="grid-content bg-purple-dark">
<el-col :span="12">
<div class="grid-content bg-purple">分润对象:</div>
</el-col>
<el-col :span="12">
<div class="grid-content bg-purple-light">分润比例:</div>
</el-col>
</div>
</el-col>
<el-col :span="24" v-for="(item,index) in lists" style="margin-bottom: 10px;">
<el-form :inline="true" class="demo-form-inline">
<div class="grid-content bg-purple-dark">
<el-row :gutter="15">
<el-col :span="10">
<div class="grid-content bg-purple">
<el-select v-model="item.userId" :value="item.userId" placeholder="选择分润对象">
<el-option v-for="opi in accounts" :label="opi.name" :value="opi.id"></el-option>
</el-select>
</div>
</el-col>
<el-col :span="10">
<div class="grid-content bg-purple-light">
<el-input placeholder="" @input="limitMax(item.rate,index)" v-model="item.rate" max="100" min="1"></el-input>
</div>
</el-col>
<el-col :span="4">
<div class="grid-content bg-purple-light">
<el-button type="danger" @click="deleteObj(index)" icon="el-icon-delete"></el-button>
</div>
</el-col>
</el-row>
</div>
</el-form>
</el-col>
<el-button @click="addObj">添加分润对象</el-button>
</el-row>
</template>
<script>
import {GET_ACCOUNT_LIST} from '@/api/privilegeManagement'
import {DETAIL_FIELD_LIST} from '@/api/distribution'
import Alert from "@/utils/alert";
export default {
name: "detailsOfDistribution",
props: ['currId'],
data() {
return {
lists: [],
accounts: []
}
},
watch: {
currId() {
}
},
mounted() {
this.getAccounts();
this.getDetail();
},
methods: {
getDetail() {
let params = {
id: this.currId
};
DETAIL_FIELD_LIST(params).then(res => {
this.lists = res
})
},
/**
* 添加分润对象
*/
addObj() {
let obj = {
userId: '',
rate: ''
};
this.lists.push(obj)
},
/**
* 删除分润对象
*/
deleteObj(idx) {
let lists = [];
this.lists.map((item, index) => {
if (idx != index) {
lists.push(item)
}
return item;
});
this.lists = lists
},
getAccounts() {
GET_ACCOUNT_LIST().then(res => {
this.accounts = res;
})
},
limitMax(val, idx) {
if (val >= 100 || val <= 0) {
Alert.fail('值不能大于100,小于0');
val = ''
}
this.lists[idx].rate = val;
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
</style>

60
src/views/richText/form.vue
View File

@ -1,60 +0,0 @@
<template>
<div class="form-container">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="场地">
<el-select v-model="formInline.locationId" value="" placeholder="场地">
<el-option label="全部" value=""></el-option>
<el-option v-for="item in locationId" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item style="padding-left:30px">
<el-button type="default" @click="resetForm1('formInline')">重置</el-button>
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import {GET_LOCATIONS} from '@/api/common'
export default {
name: 'form-container',
props: ['label'],
data() {
return {
formInline: {
locationId: ''
},
locationId: ''
}
},
mounted() {
this.getLocationId();
},
methods: {
getLocationId() {
GET_LOCATIONS().then(res => {
this.locationId = res
})
},
onSubmit() {
this.$emit('submit', this.formInline)
},
resetForm1() {
this.formInline = {
name: ''
};
this.$emit('resetForm');
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.form-container {
padding: 20px;
background: #fff;
}
</style>

267
src/views/richText/index.vue
View File

@ -1,269 +1,40 @@
<template> <template>
<div> <div class="pa-4 white">
<form-container @submit="submitForm" @resetForm="resetForm"></form-container> <el-tabs type="border-card" v-model="activeName" @tab-click="handleClick(activeName)">
<div class="table"> <el-tab-pane label="轮播图管理" name="IMAGE">
<el-table <banner :showPage="showPage" />
:data="lists" </el-tab-pane>
style="width: 100%"> <el-tab-pane label="详情页管理" name="DETAIL">
<el-table-column <detail />
prop="name" </el-tab-pane>
label="场地图片"> </el-tabs>
<template slot-scope="lists">
<img :src="lists.row.image" width="70" height="70" alt="">
</template>
</el-table-column>
<el-table-column
prop="name"
label="名称">
</el-table-column>
<el-table-column
prop="locationName"
label="场地地址">
</el-table-column>
<el-table-column
prop="users"
label="分润人数">
</el-table-column>
<el-table-column
prop="stateText"
label="状态">
</el-table-column>
<el-table-column
fixed="right"
label="操作"
>
<template slot-scope="lists">
<span
type="text"
size="small"
class="option-span"
@click="suspensionOfRelease(lists.row.id,lists.row.enabled)"
>
<span>{{lists.row.enabled==true?"暂停":"发布"}}</span>
</span>
<span
type="text"
size="small"
style="margin: 0 5px;"
class="option-span"
@click="editModal(lists.row.id)"
>
<span>编辑</span>
</span>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
:page-size="params.size"
layout="prev, pager, next"
:total="count"
@current-change="currentChange"
>
</el-pagination>
</div>
</div>
<el-dialog
width="400px"
:show-close="false"
:visible.sync="isEdit">
<details-of-distribution ref="distribution" :currId="id" v-if="isEdit"></details-of-distribution>
<div slot="footer" class="dialog-footer">
<el-button @click="isEdit = false">取消</el-button>
<el-button type="primary" @click="determine('ruleForm')">确定</el-button>
</div>
</el-dialog>
</div> </div>
</template> </template>
<script> <script>
const FormContainer = () => import('./form.vue'); import Banner from '@/components/Banner';
const DetailsOfDistribution = () => import('./detailsOfDistribution.vue'); import Detail from '@/components/Detail';
import {
GET_FIELD_LIST,
POST_FIELD_LIST,
ENABLE_FIELD_LIST,
DISABLE_FIELD_LIST,
COUNT_FIELD_LIST
} from '@/api/distribution'
import Alert from "@/utils/alert";
import {pageSize} from '../../config';
export default { export default {
name: "index", name: "index",
components: {
Banner,
Detail
},
data() { data() {
return { return {
count: 0, activeName: 'IMAGE',
id: '', showPage: '0000'
isEdit: false,
lists: [],
params: {
from: 0,
size: pageSize,
locationId: ''
}
} }
}, },
mounted() {
this.getList()
},
components: {
FormContainer,
DetailsOfDistribution
},
methods: { methods: {
submitForm(res) { handleClick() {
this.params = { console.log('切换tab');
...this.params,
locationId: res.locationId,
};
this.getList()
},
resetForm() {
this.params = {
from: 0,
size: pageSize,
locationId: ''
};
this.getList()
},
getList() {
GET_FIELD_LIST(this.params).then(res => {
res.map((item) => {
item.stateText = item.enabled ? '生效中' : '失效中';
item.locationName = item.province + item.city + item.district + item.name;
return item
});
this.lists = res
});
COUNT_FIELD_LIST(this.params).then(res => {
this.count = res
})
}, },
/**
* 分页
*/
currentChange(res) {
this.params = {
...this.params,
from: parseInt(res - 1) * this.params.size,
size: pageSize,
};
this.getList()
},
editModal(id) {
this.isEdit = true;
this.id = id;
},
/**
* 状态操作
*/
suspensionOfRelease(id, enabled) {
if (enabled) {
this.PUBLISHED(id)
} else {
this.PAUSEDANDPENDING(id)
}
},
/**
* 已发布
* @constructor
*/
PUBLISHED(id) {
let params = {
id
};
DISABLE_FIELD_LIST(params).then((res) => {
let lists = [];
this.lists.map((item) => {
if (item.id == id) {
item.stateText = '失效中';
item.enabled = false;
}
lists.push(item);
return item;
});
this.lists = lists;
Alert.success("已失效");
});
},
/**
* 已暂停或者待发布
* @constructor
*/
PAUSEDANDPENDING(id) {
let params = {
id
};
ENABLE_FIELD_LIST(params).then((res) => {
let lists = [];
this.lists.map((item) => {
if (item.id == id) {
item.stateText = '生效中';
item.enabled = true;
}
lists.push(item);
return item;
});
this.lists = lists;
Alert.success("已生效");
});
},
determine() {
let that = this;
let child = this.$refs.distribution.lists;
let params = {
id: this.id,
items: child
};
for (let index in child) {
if (!child[index].rate || !child[index].userId) {
Alert.fail("值不能为空");
return false;
}
}
for (let i = 0; i < child.length; i++) {
for (let j = i + 1; j < child.length; j++) {
if (child[i].userId == child[j].userId) {
Alert.fail("分润对象不能一样");
return false;
}
}
}
POST_FIELD_LIST(params).then(res => {
Alert.success("添加成功");
that.isEdit = false;
that.getList();
});
}
} }
} }
</script> </script>
<style rel="stylesheet/scss" lang="scss" scoped> <style rel="stylesheet/scss" lang="scss" scoped>
.table {
margin-top: 20px;
padding: 30px;
background: #fff;
.option-span {
color: #a90500;
cursor: pointer;
}
}
.pagination {
margin-top: 20px;
}
</style> </style>

Write Preview
Loading…
Cancel
Save