Browse Source

上传代码

master
杨豪 4 years ago
parent
commit
414c90c139
  1. 2
      .env.development
  2. 27
      src/api/cyCourse.js
  3. 3
      src/components/Crud/crud.js
  4. 1
      src/components/material/index.vue
  5. 1
      src/mixins/crud.js
  6. 205
      src/views/article/addArt.vue
  7. 189
      src/views/article/index.vue
  8. 3
      src/views/course/add.vue
  9. 353
      src/views/course/index.vue
  10. 4
      src/views/login.vue

2
.env.development

@ -1,7 +1,7 @@
ENV = 'development'
# 接口地址
VUE_APP_BASE_API = 'http://localhost:8088'
VUE_APP_BASE_API = 'http://192.168.0.109:8091'
VUE_APP_WS_API = 'ws://localhost:8088'

27
src/api/cyCourse.js

@ -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 }

3
src/components/Crud/crud.js

@ -158,6 +158,8 @@ function CRUD(options) {
* @param {*} data 数据项
*/
toEdit(data) {
console.log('data', data)
console.log('data', JSON.parse(JSON.stringify(data)))
crud.resetForm(JSON.parse(JSON.stringify(data)))
if (!(callVmHook(crud, CRUD.HOOK.beforeToEdit, crud.form) && callVmHook(crud, CRUD.HOOK.beforeToCU, crud.form))) {
return
@ -373,6 +375,7 @@ function CRUD(options) {
* @param {Array} data 数据
*/
resetForm(data) {
console.log(data)
const form = data || (typeof crud.defaultForm === 'object' ? JSON.parse(JSON.stringify(crud.defaultForm)) : crud.defaultForm())
const crudFrom = crud.form
for (const key in form) {

1
src/components/material/index.vue

@ -458,6 +458,7 @@ export default {
return isPic && isLt2M
},
sureUrls() {
console.log(this.urls)
this.urls.forEach(item => {
this.$set(this.value, this.value.length, item)
})

1
src/mixins/crud.js

@ -292,6 +292,7 @@ export default {
* 提交
*/
submitMethod() {
console.log('submit')
if (!this.beforeSubmitMethod()) {
return
}

205
src/views/article/addArt.vue

@ -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>

189
src/views/article/index.vue

@ -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>

3
src/views/course/add.vue

@ -0,0 +1,3 @@
<template>
<div>add</div>
</template>

353
src/views/course/index.vue

@ -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'
// crudpresenter
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>

4
src/views/login.vue

@ -1,7 +1,7 @@
<template>
<div class="login">
<div style="display:flex;justify-content:space-between;align-items: center;">
<div style="padding: 0 60px 0 0">
<!-- <div style="padding: 0 60px 0 0">
<h3 style="color: #ffffff;font-size: 24px;padding: 0;margin-bottom: 10px">
单商户B2C电商系统
</h3>
@ -16,7 +16,7 @@
<h3 style="color: #ffffff;">
官网:https://www.yixiang.co
</h3>
</div>
</div> -->
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" label-position="left" label-width="0px" class="login-form">
<h3 class="title">
后台管理系统-3.1

Loading…
Cancel
Save