Commit c7ba5bb7 by 肖翔宇

11.20

parent ca748800
...@@ -5,7 +5,7 @@ import 'nprogress/nprogress.css'// Progress 进度条样式 ...@@ -5,7 +5,7 @@ import 'nprogress/nprogress.css'// Progress 进度条样式
import { Message } from 'element-ui' import { Message } from 'element-ui'
import { getToken } from '@/utils/auth' // 验权 import { getToken } from '@/utils/auth' // 验权
const whiteList = ['/userList','/courseList','/pianoList','/courseEdit','/bannerList','/bannerEdit'] // 不重定向白名单 const whiteList = ['/userList','/courseList','/pianoList','/courseEdit','/bannerList','/bannerEdit','/bargainList','/bargainEdit'] // 不重定向白名单
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
NProgress.start() NProgress.start()
if (getToken()) { if (getToken()) {
......
...@@ -110,6 +110,25 @@ export const constantRouterMap = [ ...@@ -110,6 +110,25 @@ export const constantRouterMap = [
} }
] ]
}, },
{
path: '',
component: Layout,
children: [
{
path: '/bargainList',
component: () => import('@/views/bargain/index'),
name: 'bargainList',
meta: { title: '砍价活动管理', noCache: false }
},
{
path: '/bargainEdit',
component: () => import('@/views/bargain/bargainEdit'),
name: 'bargainEdit',
meta: { title: '砍价活动编辑', noCache: false },
hidden: true
}
]
},
{ path: '*', redirect: '/404', hidden: true } { path: '*', redirect: '/404', hidden: true }
] ]
......
<template>
<div class="app-container">
<sticky className="sub-navbar">
<div style="text-align: right;margin-bottom: 20px">
<el-button type="primary" @click="saveData">保存</el-button>
<el-button type="danger" @click="backList">取消</el-button>
</div>
</sticky>
<el-form :rules="rules" ref="dataForm" :model="temp" label-position="left" label-width="100px"
style='width: 650px; margin-left:50px;'>
<el-form-item label="活动名称" prop="activityName">
<el-input type="text" placeholder="请输入活动名称"
v-model.trim="temp.activityName">
</el-input>
</el-form-item>
<el-form-item label="活动天数" prop="activityDay">
<el-input type="text" placeholder="请输入活动天数"
v-model.trim="temp.activityDay">
</el-input>
</el-form-item>
<el-form-item label="参与人数" prop="numberOfParticipants">
<el-input type="text" placeholder="请输入参与人数"
v-model.trim="temp.numberOfParticipants">
</el-input>
</el-form-item>
<el-form-item label="原价" prop="originalPrice">
<el-input type="text" placeholder="请输入原价"
v-model.trim="temp.originalPrice">
</el-input>
</el-form-item>
<el-form-item label="活动价格" prop="activityPrice">
<el-input type="text" placeholder="请输入活动价格"
v-model.trim="temp.activityPrice">
</el-input>
</el-form-item>
<el-form-item label="实际可砍价金额" prop="ActualAmountAvailable">
<el-input type="text" placeholder="请输入实际可砍价金额"
v-model.trim="temp.ActualAmountAvailable">
</el-input>
</el-form-item>
</el-form>
<div class="editor-container">
<Tinymce :height="500" ref="editor" v-model="temp.commodity_introduction"/>
</div>
</div>
</template>
<script>
import Tinymce from '@/components/Tinymce'
import Sticky from '@/components/Sticky' // 粘性header组件
import { upload_url } from '@/common/config'
export default {
name: 'courseEdit',
components: { Tinymce, Sticky},
props: ['currentId'],
data() {
return {
bannerTypes: [],
// 临时的表单值
temp: {
id: undefined,
activityName:undefined,
activityDay: undefined,
numberOfParticipants: undefined,
originalPrice:undefined,
activityPrice: undefined,
ActualAmountAvailable: undefined,
createDate: undefined,
creteUser: undefined,
commodity_introduction: undefined
},
uploadUrl: upload_url,
// 表单验证的规则
rules: {
activityName: [
{ required: true, message: '活动名称不能为空', trigger: 'blur'},
{ type: 'string', max: 25, message: '活动名称不允许大于25位数', trigger: 'blur' },
],
activityDay: [
{ required: true, message: '活动天数不能为空', trigger: 'blur' },
{ type: 'number', message: '只允许输入数字', trigger: 'blur' }
],
numberOfParticipants: [
{ required: true, message: '参与人数不能为空', trigger: 'blur' },
{ type: 'number', message: '只允许输入数字', trigger: 'blur' }
],
originalPrice: [
{ required: true, message: '原价不能为空', trigger: 'blur' },
{ type: 'number', message: '只允许输入数字', trigger: 'blur' }
],
activityPrice: [
{ required: true, message: '活动价格不能为空', trigger: 'blur' },
{ type: 'number', message: '只允许输入数字', trigger: 'blur' }
],
ActualAmountAvailable: [
{ required: true, message: '实际可砍价金额不能为空', trigger: 'blur' },
{ type: 'number', message: '只允许输入数字', trigger: 'blur' }
],
},
videoFlag: false,
videoUploadPercent: 0,
pickerOptions1: {
// 大于当前时间
disabledDate: (time) => {
return time.getTime() < Date.now()
}
}
}
},
filters: {},
created() {
const params = this.$route.params
if (params && params.id) {
this.$fetch.sysCourse.query({ id: params.id }).then(({ data }) => {
this.temp = data;
})
}
},
computed: {
// 加载显示的文字
displays() {
return this.$store.getters.displays
}
},
mounted() {
this.createTime();
this.$fetch.sysCourseType.findAll().then(({ data }) => {
console.log(data);
this.bannerTypes = data
const params = this.$route.params
if (!params || !params.id) {
this.temp.type = data[0].value
}
})
},
methods: {
// 返回
backList() {
this.$confirm('是否放弃当前编辑信息?', '提示', {
confirmButtonText: '继续编辑',
cancelButtonText: '放弃',
type: 'warning'
}).then(() => {
}).catch(() => {
this.$message({
type: 'warning',
message: '已取消编辑'
})
this.back()
})
},
createTime(){
var date=new Date();
var year = date.getFullYear(); //年
var month = date.getMonth() + 1; //月
var day = date.getDate();
this.temp.createDate=year+'-'+month+'-'+day;
},
// 返回
back() {
this.$router.push({ name: 'courseList' })
},
saveData() {
if (this.videoFlag) {
this.$message.warning('请等待视频上传成功')
return
}
console.log(this.$refs['dataForm'])
this.$refs['dataForm'].validate(valid => {
if (valid) {
const tempData = Object.assign({}, this.temp)
if (!tempData.id) {
this.createTime();
this.$fetch.sysCourse.insert(tempData).then(() => {
this.$message({
message: '创建成功',
type: 'success'
})
this.back()
})
} else {
this.$fetch.sysCourse.update(tempData).then(() => {
this.$message({
message: '更新成功',
type: 'success'
})
this.back()
})
}
} else {
console.log('valid error')
}
})
}
}
}
</script>
<style scoped>
.el-rate {
}
.editor-container {
min-height: 500px;
margin: 0 0 30px;
}
.editor-upload-btn-container {
text-align: right;
margin-right: 10px;
}
.editor-upload-btn {
display: inline-block;
}
.avatar {
width: 500px;
height: 300px;
display: block;
}
.avatar-img {
width: 150px;
height: 150px;
display: block;
}
</style>
<template>
<div class="app-container">
<div class="filter-container">
<router-link :to="{name:'bargainEdit'}">
<el-button class="filter-item" style="margin-left: 10px;" v-waves type="primary" icon="el-icon-plus">添加
</el-button>
</router-link>
<el-button @click.native.prevent="openShowLog()" class="filter-item" style="margin-left: 10px;" v-waves type="primary" icon="el-icon-plus">添加类型
</el-button>
<modal @on-close="closeThis()":is-show='isShowLog'>
<el-form :rules="rules" ref="dataForm" :model="types" label-position="left" label-width="100px"
style='width: 350px; margin-left:50px;'>
<el-form-item label="阶段人数" prop="courseName">
<el-input type="text" placeholder="请输入阶段人数"
v-model.trim="types.courseName">
</el-input>
</el-form-item>
<el-form-item label="金额范围" prop="courseName">
<el-input type="text" placeholder="请输入金额范围"
v-model.trim="types.courseName">
</el-input>
</el-form-item>
</el-form>
<el-button type="primary" @click="saveData">保存</el-button>
</modal>
<el-tooltip class="item" effect="dark" content="刷新" placement="top-start" :hide-after="toolTipTime">
<el-button class="filter-item" style="margin-left: 10px;" v-waves @click="refresh" type="success"
icon="el-icon-refresh" size="medium" circle></el-button>
</el-tooltip>
</div>
<el-table :key='tableKey' :data="list" v-loading="listLoading" :element-loading-text="elementLoadingText" border fit
highlight-current-row style="width: 100%">
<el-table-column align="center" :label="table.activityName">
<template slot-scope="scope">
<span v-for="item in bannerTypes" :key="item.key">
{{scope.row.activityName}}
</span>
</template>
</el-table-column>
<el-table-column align="center" :label="table.activityDay">
<template slot-scope="scope">
<span v-for="item in bannerTypes" :key="item.key">
{{scope.row.activityDay}}
</span>
</template>
</el-table-column>
<el-table-column align="center" :label="table.numberOfParticipants">
<template slot-scope="scope">
<span>{{scope.row.numberOfParticipants}}</span>
</template>
</el-table-column>
<el-table-column align="center" :label="table.originalPrice">
<template slot-scope="scope">
<span>{{scope.row.originalPrice}}</span>
</template>
</el-table-column>
<el-table-column align="center" :label="table.activityDay">
<template slot-scope="scope">
<span>{{scope.row.activityDay}}</span>
</template>
</el-table-column>
<el-table-column align="center" :label="table.ActualAmountAvailable">
<template slot-scope="scope">
<span>{{scope.row.ActualAmountAvailable}}</span>
</template>
</el-table-column>
<el-table-column align="center" :label="table.createDate">
<template slot-scope="scope">
<span>{{scope.row.createDate}}</span>
</template>
</el-table-column>
<el-table-column align="center" :label="table.createUser">
<template slot-scope="scope">
<span>{{scope.row.createUser}}</span>
</template>
</el-table-column>
<el-table-column align="center" label="操作" width="200">
<template slot-scope="scope">
<router-link :to="{name:'bargainEdit',params:{id:scope.row.id}}">
<el-button type="primary" icon="el-icon-edit" size="mini"
round></el-button>
</router-link>
<el-button type="danger" icon="el-icon-delete"
@click.native.prevent="handleDelete(scope.row)" size="mini" round></el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<div class="pagination-container">
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="listQuery.currentPage" :page-sizes="[10, 20, 30, 40,50,100]"
:page-size="listQuery.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total">
</el-pagination>
</div>
</div>
</template>
<script>
import { parseTime } from '@/utils'
import Modal from '@/components/Modal'
export default {
name: 'banner',
components: { Modal},
data() {
return {
isShowLog: false,
tableKey: 0,
// 是否加载
listLoading: true,
// 查询参数
listQuery: {
currentPage: 1,
pageSize: 10,
name: undefined,
code: undefined
},
// 表格的数据
list: null,
// 总数量
total: null,
// 表单显示的名称
table: {
activityName:'活动名称',
activityDay: '活动天数',
numberOfParticipants: '参与人数',
originalPrice:'原价',
activityPrice: '活动价格',
ActualAmountAvailable: '实际可砍价金额',
createDate: '创建时间',
createUser: '创建人',
},
types: {
id: undefined,
courseName: undefined,
},
// 临时的表单值
temp: {
id: undefined,
activityName:undefined,
activityDay: undefined,
numberOfParticipants: undefined,
originalPrice:undefined,
activityPrice: undefined,
ActualAmountAvailable: undefined,
createDate: undefined,
creteUser: undefined,
commodity_introduction: undefined
},
// 表单验证的规则
rules: {
courseName: [
{ required: true, message: '课程名称不能为空', trigger: 'blur' },
{ type: 'string', max: 20, message: '课程名称不允许大于20位数', trigger: 'blur' }
]
},
bannerTypes: []
}
},
created() {
// 初始化数据
this.getList()
},
mounted() {
this.$fetch.sysDict.optionsChildren('BANNER_TYPE').then(({ data }) => {
this.bannerTypes = data
})
},
computed: {
// 提示--显示的时间
toolTipTime() {
return this.$store.getters.toolTipTime
},
// 加载显示的文字
elementLoadingText() {
return this.$store.getters.elementLoadingText
},
// 加载显示的文字
displays() {
return this.$store.getters.displays
}
},
methods: {
closeThis(){
this.isShowLog=false;
},
openShowLog(){
this.isShowLog=true;
},
getList() {
// 初始化数据 开始加载数据
this.listLoading = true
this.$fetch.sysCourse
.pageList(this.listQuery)
.then(({ data, total }) => {
// 赋值数据
this.list = data;
// 数据加载完成
this.listLoading = false
})
},
// 处理搜索
handleFilter() {
this.listQuery.currentPage = 1
this.getList()
},
// 处理每页条数
handleSizeChange(val) {
this.listQuery.pageSize = val
this.getList()
},
// 处理当前页面
handleCurrentChange(val) {
this.listQuery.currentPage = val
this.getList()
},
handleSuccess(response, file) {
this.temp.url = response.data
},
handleRemove(file) {
this.temp.url = undefined
},
beforeUpload(file) {
const _URL = window.URL || window.webkitURL
return new Promise((resolve, reject) => {
const img = new Image()
img.src = _URL.createObjectURL(file)
img.onload = function() {
}
resolve(true)
})
},
// 初始化temp值
resetTemp() {
this.temp = {
id: undefined,
title: undefined,
curriculumType: undefined,
pictureAddress: undefined,
videoAddress: undefined,
createDate: undefined,
cretePerson: undefined,
numberOrder: undefined
}
},
// 删除
handleDelete(row) {
if (!row.id) {
this.$message('请刷新后再试')
return
}
this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
this.$fetch.sysCourse.deletes(row.id).then(() => {
this.$message({
message: '删除成功',
type: 'success'
})
const index = this.list.indexOf(row)
this.list.splice(index, 1)
}).catch(function(reason) {
console.log( reason);
});
})
.catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
refresh() {
// 初始化查询参数
this.listQuery = {
currentPage: 1,
pageSize: 10
}
this.tableKey = this.tableKey + 1
this.getList()
},
getShowType(row, dispaly = 1) {
if (row.display === dispaly) {
return {
type: 'info',
label: '隐藏'
}
}
return {
type: 'success',
label: '显示'
}
},
saveData() {
if (this.videoFlag) {
this.$message.warning('请等待视频上传成功')
return
}
this.$refs['dataForm'].validate(valid => {
if (valid) {
const tempData = Object.assign({}, this.types)
if (!tempData.id) {
this.$fetch.sysCourseType.insert(tempData).then(() => {
this.$message({
message: '创建成功',
type: 'success'
})
this.isShowLog=false;
this.back()
})
} else {
this.$fetch.sysCourseType.update(tempData).then(() => {
this.$message({
message: '更新成功',
type: 'success'
})
this.isShowLog=false;
this.back()
})
}
} else {
console.log('valid error')
}
})
}
}
}
</script>
<style scoped>
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment