Skip to content

A
admin-base
Commit 7c9f9441 authored by wangwei's avatar wangwei
Browse files
Options

页面编写

parent 4f71768e
Hide whitespace changes
Inline Side-by-side
Showing with 379 additions and 116 deletions
config/dev.env.js
View file @ 7c9f9441
...@@ -5,5 +5,6 @@ const prodEnv = require('./prod.env'); ...@@ -5,5 +5,6 @@ const prodEnv = require('./prod.env');
module.exports = merge(prodEnv, { module.exports = merge(prodEnv, {
NODE_ENV: '"development"', NODE_ENV: '"development"',
API_URL: '"/"', API_URL: '"/"',
IMAGE_URL_HEAD:'"http://cdn.singsingenglish.com/"',
INVITE_URL:'"http://wechat.test.singsingenglish.com"', INVITE_URL:'"http://wechat.test.singsingenglish.com"',
}); });
config/index.js
View file @ 7c9f9441
...@@ -14,6 +14,7 @@ module.exports = { ...@@ -14,6 +14,7 @@ module.exports = {
proxyTable: { proxyTable: {
'/api': { '/api': {
target: 'http://local.base-api.sing.com', // 接口的域名 target: 'http://local.base-api.sing.com', // 接口的域名
// target: 'wechat.test.singsingenglish.com',
changeOrigin: true, // 如果接口跨域，需要进行这个参数配置 changeOrigin: true, // 如果接口跨域，需要进行这个参数配置
} }
}, },
......
src/components/box/boxDialog.vue 0 → 100644
View file @ 7c9f9441
<template>
</template>
<script>
export default {
name: "boxDialog"
}
</script>
<style scoped>
</style>
src/components/box/boxTypeList.vue 0 → 100644
View file @ 7c9f9441
<template>
<div :class="{'box-type-list':true,'closed':close}">
<div class="close-btn" @click="close = !close">
<i class="el-icon-arrow-right" v-if="!close"></i>
<i class="el-icon-arrow-left" v-if="close"></i>
</div>
<el-card class="box-card">
<div slot="header">
<span>盒子类型</span>
<el-button style="float: right; padding: 3px 0;" type="text">新增类型</el-button>
</div>
<el-card v-for="o in list" shadow="hover" :key="o.id" :class="{text:true,'now-card':o.id === nowId}">
<div class="name" @click="changeCateGory(o.id)">
{{o.name}}
</div>
<div class="btn-block">
<el-button type="primary" icon="el-icon-search" circle plain size="mini"></el-button>
<el-button type="warning" icon="el-icon-edit" circle plain size="mini"></el-button>
<el-button type="danger" icon="el-icon-delete" circle plain size="mini"></el-button>
</div>
</el-card>
</el-card>
</div>
</template>
<script>
import {getBoxTypeListApi} from "../../service/api";
export default {
name: "boxTypeList",
data () {
return {
list:[],
nowId:'',
close:false
}
},
mounted(){
this.getBoxTypeList()
},
methods: {
getBoxTypeList(){
getBoxTypeListApi().then(res=>{
this.list = res
})
},
changeCateGory(id){
this.nowId = id
this.$emit('changeCategoryId',id)
}
}
}
</script>
<style scoped lang="less">
.box-type-list{
position: absolute;
top: 0;
right: -270px;
bottom: 0;
width: 280px;
border-left: 1px solid #aae0ff;
padding: 0;
margin: 0;
transition: all .3s;
&:hover{
right: 0;
}
.close-btn{
height: 80px;
line-height: 80px;
width: 20px;
background: #aae0ff;
color: white;
position: absolute;
top: 50%;
cursor: pointer;
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
margin-top: -40px;
text-align: center;
left: -20px;
}
.box-card{
height: 100%;
margin: 0;
border: none;
box-shadow: none;
padding: 0;
display: block;
overflow: auto;
.text{
margin: 5px 0;
position: relative;
height: 65px;
cursor: pointer;
&.now-card{
background: #409EFF;
color: white;
}
.name{
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 100px;
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
padding: 20px;
}
.btn-block{
position: absolute;
top: 0;
bottom: 0;
right: 0;
padding: 20px;
z-index: 2;
.el-button{
margin: 0;
}
}
}
}
}
</style>
src/components/box/index.vue
View file @ 7c9f9441
<template> <template>
<div> <div class="box-index">
盒子列表 <box-type-list @changeCategoryId="changeCategoryId"/>
<div class="add-block">
<el-button class="add-btn" type="success">+新增盒子</el-button>
</div> </div>
<el-row>
<el-col :span="4" v-for="(data, index) in list" :key="o">
<el-card :body-style="{ padding: '0px' }" shadow="hover">
<img v-if="data.cover !== ''" :src="defaultImgPath + data.cover" class="image">
<div style="padding: 14px;">
<span>
{{data.title}}
</span>
<div class="bottom clearfix">
<el-tag size="mini">level{{data.min_level}}-level{{data.max_level}}</el-tag>
<el-tag type="success" size="mini">{{data.min_age}}-{{data.max_age}}岁</el-tag>
<div class="btn-block">
<el-button type="primary" icon="el-icon-search" circle plain size="mini"></el-button>
<el-button type="warning" icon="el-icon-edit" circle plain size="mini"></el-button>
<el-button type="danger" icon="el-icon-delete" circle plain size="mini"></el-button>
</div>
</div>
</div>
</el-card>
</el-col>
</el-row>
</div>
</template> </template>
<script> <script>
export default { import { getBoxListApi } from "../../service/api";
name: "index" import BoxTypeList from './boxTypeList'
export default {
name: "index",
components:{
BoxTypeList
},
data(){
return {
category_id:'',
defaultImgPath:process.env.IMAGE_URL_HEAD ,
list:[]
}
},
mounted(){
},
methods: {
initPage (id){
getBoxListApi(id).then(res=>{
this.list = res.list
})
},
changeCategoryId(data){
this.category_id = data
}
},
watch:{
category_id(value){
this.initPage(value)
}
} }
}
</script> </script>
<style scoped> <style scoped lang="less">
.box-index{
overflow: hidden;
padding: 20px;
display: block;
.add-block{
display: block;
text-align: right;
margin: 10px 0;
}
}
</style> </style>
src/components/single/dialog.vue
View file @ 7c9f9441
...@@ -7,9 +7,43 @@ ...@@ -7,9 +7,43 @@
width="800px"> width="800px">
<div v-loading="loading"> <div v-loading="loading">
<el-form ref="form" :model="form" :rules="rules" > <el-form ref="form" :model="form" :rules="rules" >
<el-row>
<el-col :span="4"><label>单品名称</label></el-col>
<el-col :span="8">
<el-form-item prop="name">
<el-input v-model="form.name"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<label>数量</label>
</el-col>
<el-col :span="8">
<el-form-item>
<el-input-number v-model="form.num"></el-input-number>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="4">
<label>封面图片</label>
</el-col>
<el-col :span="20">
<div class="upload-block">
<el-upload
action="/api/public/upload"
:class="{disabled:!uploadShow}"
:before-upload="beforeAvatarUpload"
list-type="picture-card"
:file-list="imageList"
:on-success="handleAvatarSuccess"
:on-remove="handleRemove">
<i class="el-icon-plus"></i>
</el-upload>
</div>
</el-col>
</el-row>
</el-form> </el-form>
<span slot="footer" class="dialog-footer" v-if="type !== 1"> <span slot="footer" class="dialog-footer">
<el-button @click="show = false">取 消</el-button> <el-button @click="show = false">取 消</el-button>
<el-button type="primary" @click="sub">确 定</el-button> <el-button type="primary" @click="sub">确 定</el-button>
</span> </span>
...@@ -18,8 +52,7 @@ ...@@ -18,8 +52,7 @@
</template> </template>
<script> <script>
import {getTeacherDetailApi,addTeacherApi,editTeacherApi} from "../../service/api"; import {getSingleDetailApi,addSingleApi,editSingleApi} from "../../service/api";
import {TEACHERTYPE} from "../../util/wordbook";
export default { export default {
name: "dialogObj", name: "dialogObj",
props:[ props:[
...@@ -27,61 +60,28 @@ ...@@ -27,61 +60,28 @@
], ],
data(){ data(){
return{ return{
show:false, show: false,
id: '', id: '',
statusOption:[ loading: true,
{ uploadShow: true,
label:'正常', type: 0,
value:0 title: '',
}, form:{ name: '', num: 0, cover: ''},
{ imageList: [],
label:'禁用', rules: {
value:1
}
],
typeOption:[
{
label:'老师',
value:0
},{
label:'新星妈妈',
value:1
},{
label:'推广人',
value:2
},{
label:'市场',
value:3
}
],
loading:true,
type:0,
title:'',
form:{
name:'',
type:0,
qr:'',
alias:'',
status:0,
},
rules:{
name:[
{ required: true, message: '请输入名称', trigger: 'change' }
],
qr:[
{ required: true, message: '请输入二维码', trigger: 'change' }
]
}, },
teacherDetail:{} teacherDetail: {}
} }
}, },
methods:{ methods:{
sub(){ sub(){
switch(this.dialogObj.type){ switch(this.dialogObj.type){
case 2: case 0:
this.$refs['form'].validate((valid) => { this.$refs['form'].validate((valid) => {
if(valid){ if(valid){
editTeacherApi(this.id,this.form).then(res=>{ this.form.cover = this.imageList[0].name;
addSingleApi(this.form).then(()=>{
this.$message({ this.$message({
type: 'success', type: 'success',
message: '修改成功!' message: '修改成功!'
...@@ -92,10 +92,11 @@ ...@@ -92,10 +92,11 @@
} }
}); });
break; break;
case 0: case 1:
this.$refs['form'].validate((valid) => { this.$refs['form'].validate((valid) => {
if(valid){ if(valid){
addTeacherApi(this.form).then(res=>{ this.form.cover = this.imageList[0].name;
editSingleApi(this.id,this.form).then(()=>{
this.$message({ this.$message({
type: 'success', type: 'success',
message: '新增成功!' message: '新增成功!'
...@@ -108,45 +109,52 @@ ...@@ -108,45 +109,52 @@
break break
} }
}, },
handleAvatarSuccess(res) {
this.imageList = [{name:res.data.url,url:process.env.IMAGE_URL_HEAD + res.data.url}]
},
beforeAvatarUpload(){
this.uploadShow = false
},
handleRemove(){
this.uploadShow = true
},
initDialog(){ initDialog(){
switch(this.dialogObj.type){ switch(this.dialogObj.type){
case 0: case 0:
this.title = '新增教师'; this.title = '新增单品';
this.show = this.dialogObj.show; this.show = this.dialogObj.show;
this.type = 0; this.type = 0;
this.form.name = ""; this.imageList = [];
this.form.alias = ""; this.form = {
this.form.qr = ""; name: '',
this.form.type = 0; num: 0,
this.form.status = 0; cover: ''
};
this.uploadShow = true;
this.loading = false; this.loading = false;
break; break;
case 1: case 1:
this.title = '教师详情'; this.title = '编辑';
this.show = this.dialogObj.show; this.show = this.dialogObj.show;
this.id = this.dialogObj.id; this.id = this.dialogObj.id;
this.type = 1; this.type = 1;
getTeacherDetailApi(this.id).then(res=>{ getSingleDetailApi(this.dialogObj.id).then(res=>{
this.teacherDetail = res; this.loading = false;
this.loading = false this.form = {
name:res.name,
num:res.num,
cover:res.cover
};
if(this.form.cover && this.form.cover !== ''){
this.imageList = [{name:res.cover,url:process.env.IMAGE_URL_HEAD + res.cover}];
this.uploadShow = false
}else{
this.imageList = [];
this.uploadShow = true
}
}); });
break; break;
case 2:
this.title = '编辑';
this.show = this.dialogObj.show;
this.id = this.dialogObj.id;
this.type = 2;
getTeacherDetailApi(this.id).then(res=>{
this.form.name = res.name;
this.form.alias = res.alias;
this.form.qr = res.qr;
this.form.type = res.type;
this.form.status = res.status;
this.loading = false
});
break
} }
} }
}, },
watch:{ watch:{
...@@ -166,19 +174,18 @@ ...@@ -166,19 +174,18 @@
<style scoped lang="less"> <style scoped lang="less">
.el-col{ .el-col{
height: 50px;
text-align: center;
margin-bottom: 20px; margin-bottom: 20px;
line-height: 40px; line-height: 40px;
.el-select{ .el-select{
width: 100%; width: 100%;
} }
img{ .upload-block{
width: 50px; height: 150px;
border-radius: 100px;
} }
label{ label{
color: #5982e6; color: #5982e6;
text-align: center;
display: block;
} }
} }
.dialog-footer{ .dialog-footer{
...@@ -186,3 +193,9 @@ ...@@ -186,3 +193,9 @@
text-align: center; text-align: center;
} }
</style> </style>
<style>
.disabled .el-upload--picture-card {
display: none !important;
}
</style>
src/components/single/index.vue
View file @ 7c9f9441
...@@ -10,18 +10,10 @@ ...@@ -10,18 +10,10 @@
</el-col> </el-col>
<el-col :span="4"> <el-col :span="4">
<el-form-item> <el-form-item>
<el-button <el-button type="primary" plain size="small" @click="initPage">
type="primary"
plain
size="small"
@click="">
搜索 搜索
</el-button> </el-button>
<el-button <el-button type="success" plain size="small" @click="onAdd">
type="success"
plain
size="small"
@click="">
添加单品 添加单品
</el-button> </el-button>
</el-form-item> </el-form-item>
...@@ -52,19 +44,19 @@ ...@@ -52,19 +44,19 @@
<el-button size="mini" plain type="warning" @click="edit(scope.row)"> <el-button size="mini" plain type="warning" @click="edit(scope.row)">
编辑 编辑
</el-button> </el-button>
<el-button size="mini" plain type="danger" @click="edit(scope.row)"> <el-button size="mini" plain type="danger" @click="delthat(scope.row)">
删除 删除
</el-button> </el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<page :total="total" v-model="nowPage"/> <page :total="total" v-model="nowPage"/>
<dialog-com :dialogObj="dialogObj" @changeShow="changeShow" @reflash="getUser"/> <dialog-com :dialogObj="dialogObj" @changeShow="changeShow" @reflash="initPage"/>
</div> </div>
</template> </template>
<script> <script>
import {getSingleListApi} from "../../service/api"; import {getSingleListApi,delSingleApi} from "../../service/api";
import page from '../framework/page' import page from '../framework/page'
import dialogCom from './dialog' import dialogCom from './dialog'
export default { export default {
...@@ -80,7 +72,12 @@ ...@@ -80,7 +72,12 @@
searchFrom: { searchFrom: {
name:'' name:''
}, },
tableData:[] tableData:[],
dialogObj:{
type:0,
show:false,
id:''
},
} }
}, },
created(){ created(){
...@@ -93,6 +90,37 @@ ...@@ -93,6 +90,37 @@
this.total = res.total this.total = res.total
}) })
}, },
changeShow() {
},
delthat(data){
this.$confirm('此操作将删除该单品?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
delSingleApi(data.id).then(res=>{
this.$message({
type: 'success',
message: '删除成功!'
});
});
this.initPage()
});
},
onAdd(){
this.dialogObj = {
type: 0,
show: true,
}
},
edit(data) {
this.dialogObj = {
type: 1,
show: true,
id: data.id
}
},
} }
} }
</script> </script>
......
src/router/index.js
View file @ 7c9f9441
...@@ -14,7 +14,7 @@ import teacher from '@/components/teacher' ...@@ -14,7 +14,7 @@ import teacher from '@/components/teacher'
import lesson from '@/components/lesson' import lesson from '@/components/lesson'
import box from '@/components/box' import box from '@/components/box'
import single from '@/components/single' import single from '@/components/single'
import periods from '@/components/periods'; import periods from '@/components/periods'
import classList from '@/components/class' import classList from '@/components/class'
import order from '@/components/order' import order from '@/components/order'
import shop from '@/components/shop' import shop from '@/components/shop'
...@@ -115,19 +115,12 @@ const router =new Router({ ...@@ -115,19 +115,12 @@ const router =new Router({
] ]
}); });
router.beforeEach((to,from,next)=> { router.beforeEach((to,from,next)=> {
//在已登录状态下不允许退回登录页面去
// if (to.name === 'login' && store.state.token) {
// next(false);
// return;
// }
//获取cookie里的token
store.commit('mainCanShow'); store.commit('mainCanShow');
if(Cookie.get('cc_token')){ if(Cookie.get('cc_token')){
store.dispatch('setToken',Cookie.get('cc_token')); store.dispatch('setToken',Cookie.get('cc_token'));
if(Cookie.get('cc_user_name') !== null){ if(Cookie.get('cc_user_name') !== null){
store.dispatch('setUserName',Cookie.get('cc_user_name')) store.dispatch('setUserName',Cookie.get('cc_user_name'))
}else{ }else{
} }
} }
store.state.nowTab = to.name; store.state.nowTab = to.name;
...@@ -142,10 +135,9 @@ router.beforeEach((to,from,next)=> { ...@@ -142,10 +135,9 @@ router.beforeEach((to,from,next)=> {
} }
} }
} }
if(store.state.openedTab.indexOf(thisMenu) < 0){ if(store.state.openedTab.indexOf(thisMenu) < 0){
store.state.openedTab.push(thisMenu); store.state.openedTab.push(thisMenu);
console.log(store.state.openedTab) }
}
} }
// 登录拦截 // 登录拦截
if (to.matched.some(record => record.meta.skip_auth !== true) && !store.state.token) { if (to.matched.some(record => record.meta.skip_auth !== true) && !store.state.token) {
...@@ -157,4 +149,4 @@ router.beforeEach((to,from,next)=> { ...@@ -157,4 +149,4 @@ router.beforeEach((to,from,next)=> {
} }
}); });
export default router; export default router;
src/service/api.js
View file @ 7c9f9441
...@@ -151,12 +151,36 @@ export const getCateListApi = function (id) { ...@@ -151,12 +151,36 @@ export const getCateListApi = function (id) {
// 获取单品列表 // 获取单品列表
const getSingleListUrl = `${_baseUrl}api/admin/item/stock/list`; const getSingleListUrl = `${_baseUrl}api/admin/item/stock/list`;
export const getSingleListApi = function (name) { export const getSingleListApi = function (name) {
return Vue.prototype.$fetch(`${getSingleListUrl}?name=${name}`) return Vue.prototype.$fetch(`${getSingleListUrl}`,{name:name})
}; };
// 获取单品详情 // 获取单品详情
const getSingleDetailUrl = `${_baseUrl}api/admin/item/stock/info/`; const getSingleDetailUrl = `${_baseUrl}api/admin/item/stock/info/`;
export const getSingleDetailApi = function (id) { export const getSingleDetailApi = function (id) {
return Vue.prototype.$fetch(`${getSingleDetailUrl}${id}`) return Vue.prototype.$fetch(`${getSingleDetailUrl}${id}`)
}; };
// 删除单品
const delSingleUrl = `${_baseUrl}api/admin/item/stock/`;
export const delSingleApi = function (id) {
return Vue.prototype.$del(`${delSingleUrl}${id}`)
};
// 新增单品
const addSingleUrl = `${_baseUrl}api/admin/item/stock/add`;
export const addSingleApi = function (json) {
return Vue.prototype.$post(addSingleUrl,json)
};
// 修改单品
const editSingleUrl = `${_baseUrl}api/admin/item/stock/info/`;
export const editSingleApi = function (id,json) {
return Vue.prototype.$put(`${editSingleUrl}${id}`,json)
};
// 获取盒子分类
const getBoxTypeListUrl = `${_baseUrl}api/admin/category/list/1`;
export const getBoxTypeListApi = function () {
return Vue.prototype.$fetch(getBoxTypeListUrl)
};
// 获取盒子列表
const getBoxListUrl = `${_baseUrl}api/admin/item/box/list/`;
export const getBoxListApi = function (id) {
return Vue.prototype.$fetch(`${getBoxListUrl}${id}`)
};
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 to comment