10 changed files with 785 additions and 3 deletions
@ -0,0 +1,27 @@ |
|||||||
|
import request from '@/utils/request' |
||||||
|
|
||||||
|
export function add(data) { |
||||||
|
return request({ |
||||||
|
url: 'api/cyCourse', |
||||||
|
method: 'post', |
||||||
|
data |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export function del(ids) { |
||||||
|
return request({ |
||||||
|
url: 'api/cyCourse/', |
||||||
|
method: 'delete', |
||||||
|
data: ids |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export function edit(data) { |
||||||
|
return request({ |
||||||
|
url: 'api/cyCourse', |
||||||
|
method: 'put', |
||||||
|
data |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export default { add, edit, del } |
||||||
@ -0,0 +1,205 @@ |
|||||||
|
<template> |
||||||
|
<div class="app-container"> |
||||||
|
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px"> |
||||||
|
<el-form-item label="标题"> |
||||||
|
<el-input v-model="form.title" style="width: 370px;" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="作者"> |
||||||
|
<el-input v-model="form.author" style="width: 370px;" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="封面"> |
||||||
|
<MaterialList v-model="form.imageArr" style="width: 370px" type="image" :num="1" :width="150" :height="150" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="简介"> |
||||||
|
<el-input v-model="form.synopsis" style="width: 370px;" rows="5" type="textarea" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="正文"> |
||||||
|
<!--<editor v-model="form.content" />--> |
||||||
|
<ueditor-wrap v-model="form.content" :config="myConfig" @beforeInit="addCustomDialog" style="width: 90%;"></ueditor-wrap> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<!--<el-button type="text" @click="cancel">取消</el-button>--> |
||||||
|
<el-button :loading="loading" type="primary" @click="doSubmit">保存</el-button> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<!--<div slot="footer" class="dialog-footer">--> |
||||||
|
<!--<el-button type="text" @click="cancel">取消</el-button>--> |
||||||
|
<!--<el-button :loading="loading" type="primary" @click="doSubmit">确认</el-button>--> |
||||||
|
<!--</div>--> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { add, edit, get } from '@/api/yxArticle' |
||||||
|
import picUpload from '@/components/pic-upload' |
||||||
|
// import editor from '../../components/Editor' |
||||||
|
import yamedit from '@/components/YamlEdit' |
||||||
|
import MaterialList from '@/components/material' |
||||||
|
import UeditorWrap from 'vue-ueditor-wrap'; |
||||||
|
export default { |
||||||
|
components: { picUpload, yamedit, MaterialList, UeditorWrap }, |
||||||
|
// props: { |
||||||
|
// isAdd: { |
||||||
|
// type: Boolean, |
||||||
|
// required: true |
||||||
|
// } |
||||||
|
// }, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
loading: false, dialog: false, |
||||||
|
form: { |
||||||
|
id: '', |
||||||
|
cid: '', |
||||||
|
title: '', |
||||||
|
author: '', |
||||||
|
imageInput: '', |
||||||
|
imageArr: [], |
||||||
|
synopsis: '', |
||||||
|
content: '', |
||||||
|
shareTitle: '', |
||||||
|
shareSynopsis: '', |
||||||
|
visit: '', |
||||||
|
sort: '', |
||||||
|
url: '', |
||||||
|
status: '', |
||||||
|
addTime: '', |
||||||
|
hide: '', |
||||||
|
merId: '', |
||||||
|
productId: '', |
||||||
|
isHot: '', |
||||||
|
isBanner: '' |
||||||
|
}, |
||||||
|
rules: { |
||||||
|
}, |
||||||
|
myConfig: { |
||||||
|
autoHeightEnabled: false, // 编辑器不自动被内容撑高 |
||||||
|
initialFrameHeight: 500, // 初始容器高度 |
||||||
|
initialFrameWidth: '100%', // 初始容器宽度 |
||||||
|
UEDITOR_HOME_URL: '/UEditor/', |
||||||
|
serverUrl: '' |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
}, |
||||||
|
created() { |
||||||
|
this.form.id = this.$route.params.id |
||||||
|
this.$nextTick(() => { |
||||||
|
//this.init() |
||||||
|
if(this.form.id){ |
||||||
|
get(this.form.id).then(data => { |
||||||
|
this.form = data |
||||||
|
this.form.imageArr = [data.imageInput] |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
}) |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
addCustomDialog () { |
||||||
|
window.UE.registerUI('yshop', function (editor, uiName) { |
||||||
|
let dialog = new window.UE.ui.Dialog({ |
||||||
|
iframeUrl: '/yshop/materia/index', |
||||||
|
editor: editor, |
||||||
|
name: uiName, |
||||||
|
title: '上传图片', |
||||||
|
cssRules: 'width:1200px;height:500px;padding:20px;' |
||||||
|
}); |
||||||
|
this.dialog = dialog; |
||||||
|
|
||||||
|
var btn = new window.UE.ui.Button({ |
||||||
|
name: 'dialog-button', |
||||||
|
title: '上传图片', |
||||||
|
cssRules: `background-image: url(../../../assets/images/icons.png);background-position: -726px -77px;`, |
||||||
|
onclick: function () { |
||||||
|
dialog.render(); |
||||||
|
dialog.open(); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
return btn; |
||||||
|
}, 37); |
||||||
|
}, |
||||||
|
cancel() { |
||||||
|
this.resetForm() |
||||||
|
}, |
||||||
|
doSubmit() { |
||||||
|
this.loading = true |
||||||
|
if(this.form.imageArr.length > 0){ |
||||||
|
this.form.imageInput = this.form.imageArr.join(',') |
||||||
|
}else{ |
||||||
|
this.form.imageInput = '' |
||||||
|
} |
||||||
|
|
||||||
|
if (!this.form.id) { |
||||||
|
this.doAdd() |
||||||
|
} else this.doEdit() |
||||||
|
}, |
||||||
|
doAdd() { |
||||||
|
add(this.form).then(res => { |
||||||
|
this.resetForm() |
||||||
|
this.$notify({ |
||||||
|
title: '添加成功', |
||||||
|
type: 'success', |
||||||
|
duration: 2500 |
||||||
|
}) |
||||||
|
this.loading = false |
||||||
|
// this.$parent.init() |
||||||
|
setTimeout(() => { |
||||||
|
this.$router.push({ path: '/wechat/wearticle' }); |
||||||
|
}, 500); |
||||||
|
}).catch(err => { |
||||||
|
this.loading = false |
||||||
|
console.log(err.response.data.message) |
||||||
|
}) |
||||||
|
}, |
||||||
|
doEdit() { |
||||||
|
edit(this.form).then(res => { |
||||||
|
this.resetForm() |
||||||
|
this.$notify({ |
||||||
|
title: '修改成功', |
||||||
|
type: 'success', |
||||||
|
duration: 2500 |
||||||
|
}) |
||||||
|
this.loading = false |
||||||
|
// this.$parent.init() |
||||||
|
setTimeout(() => { |
||||||
|
this.$router.push({ path: '/wechat/wearticle' }); |
||||||
|
}, 500); |
||||||
|
}).catch(err => { |
||||||
|
this.loading = false |
||||||
|
console.log(err.response.data.message) |
||||||
|
}) |
||||||
|
}, |
||||||
|
resetForm() { |
||||||
|
this.dialog = false |
||||||
|
this.$refs['form'].resetFields() |
||||||
|
this.form = { |
||||||
|
id: '', |
||||||
|
cid: '', |
||||||
|
title: '', |
||||||
|
author: '', |
||||||
|
imageInput: '', |
||||||
|
synopsis: '', |
||||||
|
shareTitle: '', |
||||||
|
shareSynopsis: '', |
||||||
|
visit: '', |
||||||
|
sort: '', |
||||||
|
url: '', |
||||||
|
status: '', |
||||||
|
addTime: '', |
||||||
|
hide: '', |
||||||
|
adminId: '', |
||||||
|
merId: '', |
||||||
|
productId: '', |
||||||
|
isHot: '', |
||||||
|
isBanner: '' |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
||||||
@ -0,0 +1,189 @@ |
|||||||
|
<template> |
||||||
|
<div class="app-container"> |
||||||
|
<!--工具栏--> |
||||||
|
<div class="head-container"> |
||||||
|
<!-- 新增 --> |
||||||
|
<div style="display: inline-block;margin: 0px 2px;"> |
||||||
|
<el-button |
||||||
|
v-permission="['admin','YXARTICLE_ALL','YXARTICLE_CREATE']" |
||||||
|
class="filter-item" |
||||||
|
size="mini" |
||||||
|
type="primary" |
||||||
|
icon="el-icon-plus" |
||||||
|
> |
||||||
|
<router-link :to="'/wechat/artadd'"> |
||||||
|
新增 |
||||||
|
</router-link> |
||||||
|
</el-button> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<!--表单组件--> |
||||||
|
<!--<eForm ref="form" :is-add="isAdd" />--> |
||||||
|
<!--表格渲染--> |
||||||
|
<el-table v-loading="loading" :data="data" size="small" style="width: 100%;"> |
||||||
|
<el-table-column prop="id" label="ID" /> |
||||||
|
<el-table-column prop="title" label="标题" /> |
||||||
|
<el-table-column prop="author" label="作者" /> |
||||||
|
<el-table-column ref="table" prop="imageInput" label="封面"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<a :href="scope.row.imageInput" style="color: #42b983" target="_blank"><img :src="scope.row.imageInput" alt="点击打开" class="el-avatar"></a> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column :show-overflow-tooltip="true" prop="createTime" label="创建日期"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<span>{{ scope.row.createTime }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column v-if="checkPermission(['admin','YXARTICLE_ALL','YXARTICLE_EDIT','YXARTICLE_DELETE'])" label="操作" width="220px" align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<el-button v-permission="['admin','YXARTICLE_ALL','YXARTICLE_EDIT']" size="mini" |
||||||
|
type="primary" icon="el-icon-edit" |
||||||
|
> |
||||||
|
<router-link :to="'/wechat/artadd/'+scope.row.id"> |
||||||
|
编辑 |
||||||
|
</router-link> |
||||||
|
</el-button> |
||||||
|
<el-popover |
||||||
|
:ref="scope.row.id" |
||||||
|
v-permission="['admin','YXARTICLE_ALL','YXARTICLE_DELETE']" |
||||||
|
placement="top" |
||||||
|
width="180" |
||||||
|
> |
||||||
|
<p>确定删除本条数据吗？</p> |
||||||
|
<div style="text-align: right; margin: 0"> |
||||||
|
<el-button size="mini" type="text" @click="$refs[scope.row.id].doClose()">取消</el-button> |
||||||
|
<el-button :loading="delLoading" type="primary" size="mini" @click="subDelete(scope.row.id)">确定</el-button> |
||||||
|
</div> |
||||||
|
<el-button slot="reference" type="danger" icon="el-icon-delete" size="mini" /> |
||||||
|
</el-popover> |
||||||
|
<el-popover |
||||||
|
:ref="'item'+scope.row.id" |
||||||
|
v-permission="['admin','YXARTICLE_ALL','YXARTICLE_DELETE']" |
||||||
|
placement="top" |
||||||
|
width="180" |
||||||
|
> |
||||||
|
<p>确定发布本条数据吗？</p> |
||||||
|
<div style="text-align: right; margin: 0"> |
||||||
|
<el-button size="mini" type="text" @click="$refs['item'+scope.row.id].doClose()">取消</el-button> |
||||||
|
<el-button :loading="delLoading" type="primary" size="mini" @click="subPublish(scope.row.id)">确定</el-button> |
||||||
|
</div> |
||||||
|
<el-button slot="reference" type="primary" size="mini">发布</el-button> |
||||||
|
</el-popover> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
<!--分页组件--> |
||||||
|
<el-pagination |
||||||
|
:total="total" |
||||||
|
:current-page="page + 1" |
||||||
|
style="margin-top: 8px;" |
||||||
|
layout="total, prev, pager, next, sizes" |
||||||
|
@size-change="sizeChange" |
||||||
|
@current-change="pageChange" |
||||||
|
/> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import checkPermission from '@/utils/permission' |
||||||
|
import initData from '@/mixins/crud' |
||||||
|
import { del, publish } from '@/api/yxArticle' |
||||||
|
import eForm from './addArt' |
||||||
|
import { formatTime } from '@/utils/index' |
||||||
|
export default { |
||||||
|
components: { eForm }, |
||||||
|
mixins: [initData], |
||||||
|
data() { |
||||||
|
return { |
||||||
|
delLoading: false |
||||||
|
} |
||||||
|
}, |
||||||
|
created() { |
||||||
|
this.$nextTick(() => { |
||||||
|
this.init() |
||||||
|
}) |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
formatTime, |
||||||
|
checkPermission, |
||||||
|
beforeInit() { |
||||||
|
this.url = 'api/yxArticle' |
||||||
|
const sort = 'id,desc' |
||||||
|
this.params = { page: this.page, size: this.size, sort: sort } |
||||||
|
return true |
||||||
|
}, |
||||||
|
subDelete(id) { |
||||||
|
this.delLoading = true |
||||||
|
del(id).then(res => { |
||||||
|
this.delLoading = false |
||||||
|
this.$refs[id].doClose() |
||||||
|
this.dleChangePage() |
||||||
|
this.init() |
||||||
|
this.$notify({ |
||||||
|
title: '删除成功', |
||||||
|
type: 'success', |
||||||
|
duration: 2500 |
||||||
|
}) |
||||||
|
}).catch(err => { |
||||||
|
this.delLoading = false |
||||||
|
this.$refs[id].doClose() |
||||||
|
console.log(err.response.data.message) |
||||||
|
}) |
||||||
|
}, |
||||||
|
subPublish(id) { |
||||||
|
this.delLoading = true |
||||||
|
publish(id).then(res => { |
||||||
|
this.delLoading = false |
||||||
|
this.$refs[id].doClose() |
||||||
|
this.dleChangePage() |
||||||
|
this.init() |
||||||
|
this.$notify({ |
||||||
|
title: '发布成功', |
||||||
|
type: 'success', |
||||||
|
duration: 2500 |
||||||
|
}) |
||||||
|
}).catch(err => { |
||||||
|
this.delLoading = false |
||||||
|
this.$refs[id].doClose() |
||||||
|
console.log(err.response.data.message) |
||||||
|
}) |
||||||
|
}, |
||||||
|
add() { |
||||||
|
this.isAdd = true |
||||||
|
this.$refs.form.dialog = true |
||||||
|
}, |
||||||
|
edit(data) { |
||||||
|
this.isAdd = false |
||||||
|
const _this = this.$refs.form |
||||||
|
_this.form = { |
||||||
|
id: data.id, |
||||||
|
cid: data.cid, |
||||||
|
title: data.title, |
||||||
|
author: data.author, |
||||||
|
imageInput: data.imageInput, |
||||||
|
imageArr: data.imageInput.split(','), |
||||||
|
synopsis: data.synopsis, |
||||||
|
content: data.content, |
||||||
|
shareTitle: data.shareTitle, |
||||||
|
shareSynopsis: data.shareSynopsis, |
||||||
|
visit: data.visit, |
||||||
|
sort: data.sort, |
||||||
|
url: data.url, |
||||||
|
status: data.status, |
||||||
|
addTime: data.addTime, |
||||||
|
hide: data.hide, |
||||||
|
adminId: data.adminId, |
||||||
|
merId: data.merId, |
||||||
|
productId: data.productId, |
||||||
|
isHot: data.isHot, |
||||||
|
isBanner: data.isBanner |
||||||
|
} |
||||||
|
_this.dialog = true |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
||||||
@ -0,0 +1,353 @@ |
|||||||
|
<template> |
||||||
|
<div class="app-container"> |
||||||
|
<!--工具栏--> |
||||||
|
<div class="head-container"> |
||||||
|
<!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'--> |
||||||
|
<crudOperation :permission="permission" /> |
||||||
|
<!--表单组件--> |
||||||
|
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title"> |
||||||
|
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="120px"> |
||||||
|
<el-form-item label="课程分类"> |
||||||
|
<el-select v-model.number="form.categoryId"> |
||||||
|
<el-option v-for="item in categoryList" |
||||||
|
:key="item.id" |
||||||
|
:label="item.categoryName" |
||||||
|
:value="item.id"> |
||||||
|
</el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="课程图片"> |
||||||
|
<picUpload v-model="form.imageInput"></picUpload> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="课程名称"> |
||||||
|
<el-input v-model="form.courseName" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="课程简介"> |
||||||
|
<el-input v-model="form.courseIntroduce" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="课程时间" prop="courseEndTime"> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.courseStartTime" |
||||||
|
type="datetime" |
||||||
|
value-format="yyyy-MM-dd HH:mm:ss" |
||||||
|
placeholder="请选择课程开始时间" |
||||||
|
:picker-options="courseStart" |
||||||
|
@change="courseTimeChange"> |
||||||
|
</el-date-picker> |
||||||
|
<span>~</span> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.courseEndTime" |
||||||
|
type="datetime" |
||||||
|
value-format="yyyy-MM-dd HH:mm:ss" |
||||||
|
placeholder="请选择课程结束时间" |
||||||
|
:picker-options="courseEnd" |
||||||
|
@change="courseTimeChange"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="课程表" v-if="form.courseList.length>0"> |
||||||
|
<el-input |
||||||
|
type="textarea" |
||||||
|
style="margin-bottom:10px;" |
||||||
|
v-for="(item,index) in form.courseList" |
||||||
|
:key="index" |
||||||
|
:placeholder="'请输入第'+ item.id + '天的课程内容'" |
||||||
|
v-model="item.desc"></el-input> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="签到时间" prop="signEndTime"> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.signStartTime" |
||||||
|
type="datetime" |
||||||
|
value-format="yyyy-MM-dd HH:mm:ss" |
||||||
|
placeholder="请选择报名开始时间" |
||||||
|
:picker-options="signStart"> |
||||||
|
</el-date-picker> |
||||||
|
<span>~</span> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.signEndTime" |
||||||
|
type="datetime" |
||||||
|
value-format="yyyy-MM-dd HH:mm:ss" |
||||||
|
placeholder="请选择报名结束时间" |
||||||
|
:picker-options="signEnd"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="报名时间" prop="enterEndTime"> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.enterStartTime" |
||||||
|
type="datetime" |
||||||
|
value-format="yyyy-MM-dd HH:mm:ss" |
||||||
|
placeholder="请选择报名开始时间" |
||||||
|
:picker-options="enterStart"> |
||||||
|
</el-date-picker> |
||||||
|
<span>~</span> |
||||||
|
<el-date-picker |
||||||
|
v-model="form.enterEndTime" |
||||||
|
type="datetime" |
||||||
|
value-format="yyyy-MM-dd HH:mm:ss" |
||||||
|
placeholder="请选择报名结束时间" |
||||||
|
:picker-options="enterEnd"> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="开课地点"> |
||||||
|
<el-input v-model="form.coursePlace" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="报名人数" prop="courseEnterPerson"> |
||||||
|
<el-input v-model="form.courseEnterPerson" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="收费类型" prop="chargeType"> |
||||||
|
<el-radio-group v-model="form.chargeType"> |
||||||
|
<el-radio :label="0">免费</el-radio> |
||||||
|
<el-radio :label="1">收费</el-radio> |
||||||
|
</el-radio-group> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item label="课程费用" prop="courseCharge"> |
||||||
|
<el-input v-model="form.courseCharge" /> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<div slot="footer" class="dialog-footer"> |
||||||
|
<el-button type="text" @click="crud.cancelCU">取消</el-button> |
||||||
|
<el-button :loading="crud.cu === 2" type="primary" @click="submit">确认</el-button> |
||||||
|
</div> |
||||||
|
</el-dialog> |
||||||
|
<!--表格渲染--> |
||||||
|
<el-table ref="table" v-loading="crud.loading" :data="crud.data" size="small" style="width: 100%;" @selection-change="crud.selectionChangeHandler"> |
||||||
|
<el-table-column type="selection" width="55" /> |
||||||
|
<el-table-column v-if="columns.visible('id')" prop="id" label="id" width="75"/> |
||||||
|
<el-table-column v-if="columns.visible('courseName')" prop="courseName" label="课程名称"/> |
||||||
|
<el-table-column v-if="columns.visible('categoryName')" prop="categoryName" label="分类名称" /> |
||||||
|
<el-table-column v-if="columns.visible('courseIntroduce')" prop="courseIntroduce" label="课程简介" width="160"/> |
||||||
|
<el-table-column v-if="columns.visible('courseStartTime')" prop="courseStartTime" label="课程时间" width="280px"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<span>{{ parseTime(scope.row.courseStartTime)}} ~ {{parseTime(scope.row.courseEndTime)}}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column v-if="columns.visible('signStartTime')" label="签到时间" width="280px"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<span>{{ parseTime(scope.row.signStartTime) }} ~ {{ parseTime(scope.row.signEndTime) }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column v-if="columns.visible('enterStartTime')" label="报名开始时间" width="280px"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<span>{{ parseTime(scope.row.enterStartTime) }} ~ {{ parseTime(scope.row.enterEndTime) }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column v-if="columns.visible('coursePlace')" prop="coursePlace" label="开课地点" width="200px" /> |
||||||
|
<el-table-column v-if="columns.visible('courseEnterPerson')" prop="courseEnterPerson" label="报名人数" /> |
||||||
|
<el-table-column v-if="columns.visible('courseCharge')" prop="courseCharge" label="费用" /> |
||||||
|
<el-table-column v-permission="['admin','cyCourse:del']" label="操作" width="150px" align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<udOperation |
||||||
|
:data="scope.row" |
||||||
|
:permission="permission" |
||||||
|
/> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
<!--分页组件--> |
||||||
|
<pagination /> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import crudCyCourse from '@/api/cyCourse' |
||||||
|
import CRUD, { presenter, header, form, crud } from '@crud/crud' |
||||||
|
import rrOperation from '@crud/RR.operation' |
||||||
|
import crudOperation from '@crud/CRUD.operation' |
||||||
|
import udOperation from '@crud/UD.operation' |
||||||
|
import pagination from '@crud/Pagination' |
||||||
|
import picUpload from '@/components/pic-upload' |
||||||
|
import MaterialList from "@/components/material" |
||||||
|
import { initData } from '@/api/data' |
||||||
|
|
||||||
|
// crud交由presenter持有 |
||||||
|
const defaultCrud = CRUD({ |
||||||
|
title: '课程模块', |
||||||
|
url: 'api/cyCourse', |
||||||
|
sort: 'id,desc', |
||||||
|
crudMethod: { ...crudCyCourse } |
||||||
|
}) |
||||||
|
const defaultForm = { |
||||||
|
id: null, |
||||||
|
categoryId: null, |
||||||
|
courseName: null, |
||||||
|
categoryName: null, |
||||||
|
courseIntroduce: null, |
||||||
|
courseStartTime: null, |
||||||
|
courseEndTime: null, |
||||||
|
signStartTime: null, |
||||||
|
signEndTime: null, |
||||||
|
enterStartTime: null, |
||||||
|
enterEndTime: null, |
||||||
|
coursePlace: null, |
||||||
|
courseEnterPerson: null, |
||||||
|
chargeType: 0, |
||||||
|
courseCharge: null, |
||||||
|
createTime: null, |
||||||
|
updateTime: null, |
||||||
|
deleted: null, |
||||||
|
createUser: null, |
||||||
|
updateUser: null, |
||||||
|
imageInput: '', |
||||||
|
imageArr: [], |
||||||
|
courseList:[], |
||||||
|
} |
||||||
|
export default { |
||||||
|
name: 'CyCourse', |
||||||
|
components: {picUpload, pagination, crudOperation, rrOperation, udOperation ,MaterialList}, |
||||||
|
mixins: [presenter(defaultCrud), header(), form(defaultForm), crud()], |
||||||
|
data() { |
||||||
|
return { |
||||||
|
courseTime:null, |
||||||
|
signTime:null, |
||||||
|
permission: { |
||||||
|
add: ['admin', 'cyCourse:add'], |
||||||
|
edit: ['admin', 'cyCourse:edit'], |
||||||
|
del: ['admin', 'cyCourse:del'] |
||||||
|
}, |
||||||
|
categoryList: [], |
||||||
|
rules: { |
||||||
|
id: [ |
||||||
|
{ required: true, message: '不能为空', trigger: 'blur' } |
||||||
|
], |
||||||
|
categoryId: [ |
||||||
|
{ required: true, message: '分类id不能为空', trigger: 'blur' } |
||||||
|
], |
||||||
|
courseEndTime: [ |
||||||
|
{ required: true, message: '课程时间不能为空', trigger: 'blur' } |
||||||
|
], |
||||||
|
signStartTime: [ |
||||||
|
{ required: true, message: '签到开始时间不能为空', trigger: 'blur' } |
||||||
|
], |
||||||
|
signEndTime: [ |
||||||
|
{ required: true, message: '签到结束时间不能为空', trigger: 'blur' } |
||||||
|
], |
||||||
|
enterEndTime: [ |
||||||
|
{ required: true, message: '报名结束时间不能为空', trigger: 'blur' } |
||||||
|
], |
||||||
|
courseEnterPerson: [ |
||||||
|
{ required: true, message: '课程报名人数不能为空', trigger: 'blur' } |
||||||
|
], |
||||||
|
chargeType: [ |
||||||
|
{ required: true, message: '收费类型（0：免费；1：收费）不能为空', trigger: 'blur' } |
||||||
|
], |
||||||
|
courseCharge: [ |
||||||
|
{ required: true, message: '课程费用不能为空', trigger: 'blur' } |
||||||
|
] |
||||||
|
}, |
||||||
|
courseStart: { |
||||||
|
disabledDate: time => { |
||||||
|
const endDateVal = new Date(this.form.courseEndTime).getTime() |
||||||
|
if (endDateVal) { |
||||||
|
return time.getTime() > endDateVal - 0 |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
courseEnd: { |
||||||
|
disabledDate: time => { |
||||||
|
const beginDateVal = new Date(this.form.courseStartTime).getTime() |
||||||
|
if (beginDateVal) { |
||||||
|
return time.getTime() < beginDateVal - 0 |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
signStart: { |
||||||
|
disabledDate: time => { |
||||||
|
const endDateVal = new Date(this.form.signEndTime).getTime() |
||||||
|
if (endDateVal) { |
||||||
|
return time.getTime() > endDateVal - 0 |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
signEnd: { |
||||||
|
disabledDate: time => { |
||||||
|
const beginDateVal = new Date(this.form.signStartTime).getTime() |
||||||
|
if (beginDateVal) { |
||||||
|
return time.getTime() < beginDateVal - 0 |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
enterStart: { |
||||||
|
disabledDate: time => { |
||||||
|
const endDateVal = new Date(this.form.enterEndTime).getTime() |
||||||
|
if (endDateVal) { |
||||||
|
return time.getTime() > endDateVal - 0 |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
enterEnd: { |
||||||
|
disabledDate: time => { |
||||||
|
const beginDateVal = new Date(this.form.enterStartTime).getTime() |
||||||
|
if (beginDateVal) { |
||||||
|
return time.getTime() < beginDateVal - 0 |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
watch: { |
||||||
|
}, |
||||||
|
created(){ |
||||||
|
this.getCategory() |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
// 获取数据前设置好接口地址 |
||||||
|
[CRUD.HOOK.beforeRefresh]() { |
||||||
|
return true |
||||||
|
}, // 新增与编辑前做的操作 |
||||||
|
[CRUD.HOOK.afterToCU](crud, form) { |
||||||
|
}, |
||||||
|
getCategory(){ |
||||||
|
initData('/api/cyCourseCategory',this.getQueryParams()).then((res)=>{ |
||||||
|
console.log(res) |
||||||
|
this.categoryList = res.content |
||||||
|
}) |
||||||
|
}, |
||||||
|
getQueryParams: function() { |
||||||
|
return { |
||||||
|
page: 1, |
||||||
|
size: 10, |
||||||
|
sort: ['id,desc'], |
||||||
|
} |
||||||
|
}, |
||||||
|
courseTimeChange(){ |
||||||
|
console.log(this.form.courseStartTime) |
||||||
|
console.log(this.form.courseEndTime) |
||||||
|
this.form.courseList = []; |
||||||
|
if(this.form.courseStartTime && this.form.courseEndTime){ |
||||||
|
var day1 = new Date(this.form.courseStartTime) |
||||||
|
var day2 = new Date(this.form.courseEndTime) |
||||||
|
var num = (day2 - day1) / (1000 * 60 * 60 * 24) |
||||||
|
for(var i = 0; i < num; i++){ |
||||||
|
this.form.courseList.push({id:i+1,desc:''}) |
||||||
|
} |
||||||
|
} |
||||||
|
console.log(this.form.courseList) |
||||||
|
}, |
||||||
|
submit(){ |
||||||
|
this.form.imageArr = [this.form.imageInput] |
||||||
|
this.crud.submitCU() |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
.table-img { |
||||||
|
display: inline-block; |
||||||
|
text-align: center; |
||||||
|
background: #ccc; |
||||||
|
color: #fff; |
||||||
|
white-space: nowrap; |
||||||
|
position: relative; |
||||||
|
overflow: hidden; |
||||||
|
vertical-align: middle; |
||||||
|
width: 32px; |
||||||
|
height: 32px; |
||||||
|
line-height: 32px; |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue