parent
801c4683a9
commit
36c1a45fe2
44 changed files with 2318 additions and 2631 deletions
@ -1,28 +0,0 @@ |
||||
.header{ |
||||
background-color: #242f42; |
||||
} |
||||
.login-wrap{ |
||||
background: #324157; |
||||
} |
||||
.plugins-tips{ |
||||
background: #eef1f6; |
||||
} |
||||
.plugins-tips a{ |
||||
color: #20a0ff; |
||||
} |
||||
.el-upload--text em { |
||||
color: #20a0ff; |
||||
} |
||||
.pure-button{ |
||||
background: #20a0ff; |
||||
} |
||||
.tags-li.active { |
||||
border: 1px solid #409EFF; |
||||
background-color: #409EFF; |
||||
} |
||||
.message-title{ |
||||
color: #20a0ff; |
||||
} |
||||
.collapse-btn:hover{ |
||||
background: rgb(40,52,70); |
||||
} |
||||
@ -0,0 +1,7 @@ |
||||
/* 改变主题色变量 */ |
||||
|
||||
$--color-primary: #062c87; |
||||
|
||||
/* 改变 icon 字体路径变量，必需 */ |
||||
$--font-path: '~element-ui/lib/theme-chalk/fonts'; |
||||
@import "~element-ui/packages/theme-chalk/src/index"; |
||||
@ -1,29 +0,0 @@ |
||||
.header{ |
||||
background-color: #fff; |
||||
} |
||||
.login-wrap{ |
||||
background: rgba(56, 157, 170, 0.82);; |
||||
} |
||||
.plugins-tips{ |
||||
background: #f2f2f2; |
||||
} |
||||
.plugins-tips a{ |
||||
color: #00d1b2; |
||||
} |
||||
.el-upload--text em { |
||||
color: #00d1b2; |
||||
} |
||||
.pure-button{ |
||||
background: #00d1b2; |
||||
} |
||||
.pagination > .active > a, .pagination > .active > a:hover, .pagination > .active > a:focus, .pagination > .active > span, .pagination > .active > span:hover, .pagination > .active > span:focus { |
||||
background-color: #00d1b2 !important; |
||||
border-color: #00d1b2 !important; |
||||
} |
||||
.tags-li.active { |
||||
border: 1px solid #9278FF; |
||||
background-color: #9278FF; |
||||
} |
||||
.collapse-btn:hover{ |
||||
background: #00d1b2; |
||||
} |
||||
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 697 B |
|
After Width: | Height: | Size: 583 B |
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 5.1 KiB |
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
@ -0,0 +1,251 @@ |
||||
<template> |
||||
<div class="page"> |
||||
<div style="margin-bottom: 10px;text-align: right;"> |
||||
<el-button v-auth="'/shop:营销推广管理:新增'" type="primary" round @click="add">新增</el-button> |
||||
</div> |
||||
<el-table :data="list" class="table" ref="table" stripe header-align="center" row-key="id"> |
||||
<el-table-column type="index" width="100" label="序号" align="center"></el-table-column> |
||||
<el-table-column prop="courseName" label="图片" min-width="150" align="center"> |
||||
<template slot-scope="scope"> |
||||
<img width="100" :src="scope.row.banner" alt=""> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="title" label="标题" min-width="150" align="center"></el-table-column> |
||||
<el-table-column prop="subheading" label="副标题" min-width="150" align="center"></el-table-column> |
||||
<el-table-column prop="url" label="链接" min-width="150" align="center"></el-table-column> |
||||
<el-table-column label="操作" align="center" width="250"> |
||||
<template slot-scope="scope"> |
||||
<el-switch v-model="scope.row.isOpen" :active-value="0" :inactive-value="1" |
||||
@change="switchOff($event, scope.row)" v-auth="'/shop:营销推广管理:禁用'"> |
||||
</el-switch> |
||||
<el-button style="margin-left: 10px;" v-auth="'/shop:营销推广管理:编辑'" type="text" |
||||
@click="edit(scope.row)">编辑</el-button> |
||||
<el-button v-auth="'/shop:营销推广管理:删除'" type="text" @click="handleDelete(scope.row)">删除</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
|
||||
<el-dialog :title="(form.id ? '编辑' : '新增') + 'banner'" :visible.sync="bannerVisible" width="500px" class="dialog" |
||||
:close-on-click-modal="false"> |
||||
<el-form ref="form" label-width="60px"> |
||||
<el-form-item label="图片"> |
||||
<el-upload class="avatar-uploader" accept=".jpg,.png,.jpeg,.gif" :on-change="changeFile" |
||||
:show-file-list="false" action="" :auto-upload="false"> |
||||
<img v-if="form.banner" :src="form.banner" class="avatar"> |
||||
<div class="uploader-default" v-else> |
||||
<i class="el-icon-plus"></i> |
||||
<p>上传图片</p> |
||||
</div> |
||||
</el-upload> |
||||
</el-form-item> |
||||
<el-form-item label="标题"> |
||||
<el-input v-model="form.title" placeholder="请输入标题" maxlength="100"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="副标题"> |
||||
<el-input v-model="form.subheading" placeholder="请输入副标题" maxlength="100"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="链接"> |
||||
<el-input v-model="form.url" placeholder="请输入链接" maxlength="100"></el-input> |
||||
</el-form-item> |
||||
</el-form> |
||||
<span slot="footer" class="dialog-footer"> |
||||
<el-button @click="bannerVisible = false">取消</el-button> |
||||
<el-button type="primary" @click="submitBanner">确定</el-button> |
||||
</span> |
||||
</el-dialog> |
||||
|
||||
<!-- 剪裁组件弹窗 --> |
||||
<el-dialog title="图片裁剪" append-to-body :visible.sync="cropperModel" width="1100px" :close-on-click-modal="false"> |
||||
<Cropper ref="cropper" :img-file.sync="file" :is-upload="isUpload" :fixed="true" :fixedNumber.sync="fixedNumber" |
||||
:autoCropWidth="500" :autoCropHeight="138.8" @upload="customUpload" /> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import Util from "@/libs/util"; |
||||
import Setting from '@/setting' |
||||
import Cropper from '@/components/img-upload/Cropper' |
||||
import Axios from 'axios' |
||||
import Oss from '@/components/upload/upload.js' |
||||
export default { |
||||
data () { |
||||
return { |
||||
headers: { |
||||
token: sessionStorage.getItem("token") |
||||
}, |
||||
list: [], |
||||
bannerVisible: false, |
||||
form: { |
||||
id: '', |
||||
banner: '', |
||||
title: '', |
||||
subheading: '', |
||||
url: '', |
||||
}, |
||||
cropperModel: false, |
||||
isUpload: false, |
||||
fixedNumber: [5.4, 1], |
||||
file: '' |
||||
}; |
||||
}, |
||||
components: { |
||||
Cropper |
||||
}, |
||||
mounted () { |
||||
this.getList() |
||||
}, |
||||
methods: { |
||||
getList () { |
||||
this.$post(this.api.listMarketing, { |
||||
pageNum: 1, |
||||
pageSize: 1000 |
||||
}).then(({ page }) => { |
||||
this.list = page.records; |
||||
this.total = page.total; |
||||
}).catch(res => { |
||||
}); |
||||
}, |
||||
// 图片裁剪上传事件 |
||||
customUpload (data) { |
||||
data.name = this.file.name |
||||
this.imgUpload(data) |
||||
}, |
||||
// 图片上传到服务器 |
||||
imgUpload (formData) { |
||||
this.isUpload = true |
||||
Oss.upload(formData).then(res => { |
||||
this.form.banner && Oss.del(this.form.banner) |
||||
this.form.banner = res.url |
||||
}) |
||||
this.$refs.cropper.isDisabled = false |
||||
this.isUpload = false |
||||
this.cropperModel = false |
||||
}, |
||||
// 图片改变钩子 |
||||
changeFile (file) { |
||||
const { size, name } = file |
||||
const ext = name.substring(name.lastIndexOf('.') + 1) |
||||
if (!Util.isImg(ext)) { |
||||
this.$message.error('请上传图片！') |
||||
return false |
||||
} |
||||
this.file = file |
||||
this.cropperModel = true |
||||
this.$nextTick(() => { |
||||
this.$refs.cropper.updateImg({ |
||||
url: window.URL.createObjectURL(file.raw), |
||||
size: file.size |
||||
}) |
||||
}) |
||||
}, |
||||
add () { |
||||
this.form = { |
||||
id: '', |
||||
banner: '', |
||||
title: '', |
||||
subheading: '', |
||||
url: '', |
||||
} |
||||
this.bannerVisible = true |
||||
}, |
||||
edit (row) { |
||||
this.form = JSON.parse(JSON.stringify(row)) |
||||
this.bannerVisible = true |
||||
}, |
||||
// banner弹框提交 |
||||
submitBanner () { |
||||
const { form } = this |
||||
if (!form.banner) return Util.errorMsg('请上传图片') |
||||
this.$post(this.api[form.id ? 'updateMarketing' : 'saveMarketing'], form).then(res => { |
||||
this.getList() |
||||
this.bannerVisible = false |
||||
}).catch(res => { }) |
||||
}, |
||||
handleDelete (row) { |
||||
this.$confirm("此删除操作不可逆，是否确认删除选中项？", "提示", { |
||||
type: "warning" |
||||
}) |
||||
.then(() => { |
||||
this.$post(`${this.api.delMarketing}?ids=${row.id}`).then(res => { |
||||
Util.successMsg("删除成功"); |
||||
this.getList(); |
||||
}).catch(res => { |
||||
}); |
||||
}) |
||||
.catch(() => { |
||||
}); |
||||
}, |
||||
switchOff (val, row) { |
||||
this.$post(`${this.api.bannerEnableOrDisable}?id=${row.id}&isDisable=${row.isOpen}`).then(res => { }).catch(err => { }) |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.m-l-10 { |
||||
margin-left: 10px; |
||||
} |
||||
|
||||
$avatar-width: 104px; |
||||
|
||||
/deep/ .avatar-uploader { |
||||
.el-upload { |
||||
position: relative; |
||||
width: $avatar-width; |
||||
height: $avatar-width; |
||||
border: 1px dashed #d9d9d9; |
||||
border-radius: 2px; |
||||
cursor: pointer; |
||||
overflow: hidden; |
||||
|
||||
&:hover { |
||||
border-color: #409eff; |
||||
} |
||||
|
||||
.uploader-default { |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: center; |
||||
width: $avatar-width !important; |
||||
height: $avatar-width; |
||||
text-align: center; |
||||
background: rgba(0, 0, 0, 0.04); |
||||
|
||||
i { |
||||
font-size: 20px; |
||||
font-weight: bold; |
||||
color: #8c939d; |
||||
} |
||||
|
||||
p { |
||||
margin-top: 10px; |
||||
font-size: 14px; |
||||
color: rgba(0, 0, 0, 0.65); |
||||
line-height: 1; |
||||
} |
||||
} |
||||
|
||||
.avatar { |
||||
width: $avatar-width; |
||||
height: $avatar-width; |
||||
display: block; |
||||
} |
||||
} |
||||
|
||||
.el-upload__tip { |
||||
margin-top: 0; |
||||
|
||||
p { |
||||
font-size: 14px; |
||||
color: rgba(0, 0, 0, 0.45); |
||||
line-height: 1; |
||||
|
||||
&:first-child { |
||||
margin-bottom: 5px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
File diff suppressed because it is too large
Load Diff
@ -1,55 +0,0 @@ |
||||
<template> |
||||
<div class="page"> |
||||
<div class="tabs"> |
||||
<a class="item" |
||||
v-for="(item,index) in tabs" |
||||
:key="index" |
||||
:class="{active: index == active}" |
||||
@click="tabChange(index)">{{ item }}</a> |
||||
</div> |
||||
<div class="page-content"> |
||||
<product v-if="active == 'first'" /> |
||||
<market v-if="active == 'second'" /> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import Setting from "@/setting"; |
||||
import product from "./product"; |
||||
import market from "./market"; |
||||
export default { |
||||
components: { |
||||
product, |
||||
market, |
||||
}, |
||||
data () { |
||||
return { |
||||
active: "first", // 当前标签页 |
||||
tabs: { |
||||
first: "产品管理", |
||||
second: "营销推广管理", |
||||
}, |
||||
showTabs: true |
||||
}; |
||||
}, |
||||
mounted () { |
||||
Setting.dynamicRoute && this.initTabs(); |
||||
}, |
||||
methods: { |
||||
tabChange (index) { |
||||
this.active = index; |
||||
}, |
||||
initTabs () { |
||||
const { btns } = this.$store.state |
||||
const tab1 = btns.includes('/shop:产品管理') |
||||
const tab2 = btns.includes('/shop:营销推广管理') |
||||
tab1 || delete this.tabs.first |
||||
tab2 || delete this.tabs.second |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
</style> |
||||
@ -1,314 +0,0 @@ |
||||
<template> |
||||
<!-- 营销推广管理 --> |
||||
<div style="padding-top: 24px"> |
||||
<div style="margin-bottom: 10px;text-align: right;"> |
||||
<el-button v-auth="'/shop:营销推广管理:新增'" |
||||
type="primary" |
||||
round |
||||
@click="add">新增</el-button> |
||||
</div> |
||||
<el-table :data="list" |
||||
class="table" |
||||
ref="table" |
||||
stripe |
||||
header-align="center" |
||||
row-key="id"> |
||||
<el-table-column type="index" |
||||
width="100" |
||||
label="序号" |
||||
align="center"></el-table-column> |
||||
<el-table-column prop="courseName" |
||||
label="图片" |
||||
min-width="150" |
||||
align="center"> |
||||
<template slot-scope="scope"> |
||||
<img width="100" |
||||
:src="scope.row.banner" |
||||
alt=""> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column prop="title" |
||||
label="标题" |
||||
min-width="150" |
||||
align="center"></el-table-column> |
||||
<el-table-column prop="subheading" |
||||
label="副标题" |
||||
min-width="150" |
||||
align="center"></el-table-column> |
||||
<el-table-column prop="url" |
||||
label="链接" |
||||
min-width="150" |
||||
align="center"></el-table-column> |
||||
<el-table-column label="操作" |
||||
align="center" |
||||
width="250"> |
||||
<template slot-scope="scope"> |
||||
<el-switch v-model="scope.row.isOpen" |
||||
:active-value="0" |
||||
:inactive-value="1" |
||||
@change="switchOff($event, scope.row)" |
||||
v-auth="'/shop:营销推广管理:禁用'"> |
||||
</el-switch> |
||||
<el-button style="margin-left: 10px;" |
||||
v-auth="'/shop:营销推广管理:编辑'" |
||||
type="text" |
||||
@click="edit(scope.row)">编辑</el-button> |
||||
<el-button v-auth="'/shop:营销推广管理:删除'" |
||||
type="text" |
||||
@click="handleDelete(scope.row)">删除</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
|
||||
<el-dialog :title="(form.id ? '编辑' : '新增') + 'banner'" |
||||
:visible.sync="bannerVisible" |
||||
width="500px" |
||||
class="dialog" |
||||
:close-on-click-modal="false"> |
||||
<el-form ref="form" |
||||
label-width="60px"> |
||||
<el-form-item label="图片"> |
||||
<el-upload class="avatar-uploader" |
||||
accept=".jpg,.png,.jpeg,.gif" |
||||
:on-change="changeFile" |
||||
:show-file-list="false" |
||||
action="" |
||||
:auto-upload="false"> |
||||
<img v-if="form.banner" |
||||
:src="form.banner" |
||||
class="avatar"> |
||||
<div class="uploader-default" |
||||
v-else> |
||||
<i class="el-icon-plus"></i> |
||||
<p>上传图片</p> |
||||
</div> |
||||
</el-upload> |
||||
</el-form-item> |
||||
<el-form-item label="标题"> |
||||
<el-input v-model="form.title" |
||||
placeholder="请输入标题" |
||||
maxlength="100"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="副标题"> |
||||
<el-input v-model="form.subheading" |
||||
placeholder="请输入副标题" |
||||
maxlength="100"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="链接"> |
||||
<el-input v-model="form.url" |
||||
placeholder="请输入链接" |
||||
maxlength="100"></el-input> |
||||
</el-form-item> |
||||
</el-form> |
||||
<span slot="footer" |
||||
class="dialog-footer"> |
||||
<el-button @click="bannerVisible = false">取消</el-button> |
||||
<el-button type="primary" |
||||
@click="submitBanner">确定</el-button> |
||||
</span> |
||||
</el-dialog> |
||||
|
||||
<!-- 剪裁组件弹窗 --> |
||||
<el-dialog title="图片裁剪" |
||||
append-to-body |
||||
:visible.sync="cropperModel" |
||||
width="1100px" |
||||
:close-on-click-modal="false"> |
||||
<Cropper ref="cropper" |
||||
:img-file.sync="file" |
||||
:is-upload="isUpload" |
||||
:fixed="true" |
||||
:fixedNumber.sync="fixedNumber" |
||||
:autoCropWidth="500" |
||||
:autoCropHeight="138.8" |
||||
@upload="customUpload" /> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import Util from "@/libs/util"; |
||||
import Setting from '@/setting' |
||||
import Cropper from '@/components/img-upload/Cropper' |
||||
import Axios from 'axios' |
||||
import Oss from '@/components/upload/upload.js' |
||||
export default { |
||||
data () { |
||||
return { |
||||
headers: { |
||||
token: sessionStorage.getItem("token") |
||||
}, |
||||
list: [], |
||||
bannerVisible: false, |
||||
form: { |
||||
id: '', |
||||
banner: '', |
||||
title: '', |
||||
subheading: '', |
||||
url: '', |
||||
}, |
||||
cropperModel: false, |
||||
isUpload: false, |
||||
fixedNumber: [5.4, 1], |
||||
file: '' |
||||
}; |
||||
}, |
||||
components: { |
||||
Cropper |
||||
}, |
||||
mounted () { |
||||
this.getList() |
||||
}, |
||||
methods: { |
||||
getList () { |
||||
this.$post(this.api.listMarketing, { |
||||
pageNum: 1, |
||||
pageSize: 1000 |
||||
}).then(({ page }) => { |
||||
this.list = page.records; |
||||
this.total = page.total; |
||||
}).catch(res => { |
||||
}); |
||||
}, |
||||
// 图片裁剪上传事件 |
||||
customUpload (data) { |
||||
data.name = this.file.name |
||||
this.imgUpload(data) |
||||
}, |
||||
// 图片上传到服务器 |
||||
imgUpload (formData) { |
||||
this.isUpload = true |
||||
Oss.upload(formData).then(res => { |
||||
this.form.banner && Oss.del(this.form.banner) |
||||
this.form.banner = res.url |
||||
}) |
||||
this.$refs.cropper.isDisabled = false |
||||
this.isUpload = false |
||||
this.cropperModel = false |
||||
}, |
||||
// 图片改变钩子 |
||||
changeFile (file) { |
||||
const { size, name } = file |
||||
const ext = name.substring(name.lastIndexOf('.') + 1) |
||||
if (!Util.isImg(ext)) { |
||||
this.$message.error('请上传图片！') |
||||
return false |
||||
} |
||||
this.file = file |
||||
this.cropperModel = true |
||||
this.$nextTick(() => { |
||||
this.$refs.cropper.updateImg({ |
||||
url: window.URL.createObjectURL(file.raw), |
||||
size: file.size |
||||
}) |
||||
}) |
||||
}, |
||||
add () { |
||||
this.form = { |
||||
id: '', |
||||
banner: '', |
||||
title: '', |
||||
subheading: '', |
||||
url: '', |
||||
} |
||||
this.bannerVisible = true |
||||
}, |
||||
edit (row) { |
||||
this.form = JSON.parse(JSON.stringify(row)) |
||||
this.bannerVisible = true |
||||
}, |
||||
// banner弹框提交 |
||||
submitBanner () { |
||||
const { form } = this |
||||
if (!form.banner) return Util.errorMsg('请上传图片') |
||||
this.$post(this.api[form.id ? 'updateMarketing' : 'saveMarketing'], form).then(res => { |
||||
this.getList() |
||||
this.bannerVisible = false |
||||
}).catch(res => { }) |
||||
}, |
||||
handleDelete (row) { |
||||
this.$confirm("此删除操作不可逆，是否确认删除选中项？", "提示", { |
||||
type: "warning" |
||||
}) |
||||
.then(() => { |
||||
this.$post(`${this.api.delMarketing}?ids=${row.id}`).then(res => { |
||||
Util.successMsg("删除成功"); |
||||
this.getList(); |
||||
}).catch(res => { |
||||
}); |
||||
}) |
||||
.catch(() => { |
||||
}); |
||||
}, |
||||
switchOff (val, row) { |
||||
this.$post(`${this.api.bannerEnableOrDisable}?id=${row.id}&isDisable=${row.isOpen}`).then(res => { }).catch(err => { }) |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.m-l-10 { |
||||
margin-left: 10px; |
||||
} |
||||
|
||||
$avatar-width: 104px; |
||||
/deep/ .avatar-uploader { |
||||
.el-upload { |
||||
position: relative; |
||||
width: $avatar-width; |
||||
height: $avatar-width; |
||||
border: 1px dashed #d9d9d9; |
||||
border-radius: 2px; |
||||
cursor: pointer; |
||||
overflow: hidden; |
||||
|
||||
&:hover { |
||||
border-color: #409eff; |
||||
} |
||||
|
||||
.uploader-default { |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: center; |
||||
width: $avatar-width !important; |
||||
height: $avatar-width; |
||||
text-align: center; |
||||
background: rgba(0, 0, 0, 0.04); |
||||
|
||||
i { |
||||
font-size: 20px; |
||||
font-weight: bold; |
||||
color: #8c939d; |
||||
} |
||||
|
||||
p { |
||||
margin-top: 10px; |
||||
font-size: 14px; |
||||
color: rgba(0, 0, 0, 0.65); |
||||
line-height: 1; |
||||
} |
||||
} |
||||
|
||||
.avatar { |
||||
width: $avatar-width; |
||||
height: $avatar-width; |
||||
display: block; |
||||
} |
||||
} |
||||
|
||||
.el-upload__tip { |
||||
margin-top: 0; |
||||
|
||||
p { |
||||
font-size: 14px; |
||||
color: rgba(0, 0, 0, 0.45); |
||||
line-height: 1; |
||||
|
||||
&:first-child { |
||||
margin-bottom: 5px; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</style> |
||||
@ -0,0 +1,217 @@ |
||||
<template> |
||||
<div class="wrap"> |
||||
<div class="block block1"> |
||||
<div class="title">系统后台</div> |
||||
<div class="apps"> |
||||
<div class="app"> |
||||
<img src="@/assets/img/workbench/1.png" alt=""> |
||||
<p class="name">Python系统</p> |
||||
</div> |
||||
<div class="app"> |
||||
<img src="@/assets/img/workbench/2.png" alt=""> |
||||
<p class="name">理论考试系统</p> |
||||
</div> |
||||
<div class="app"> |
||||
<img src="@/assets/img/workbench/3.png" alt=""> |
||||
<p class="name">金融产品设计及数字化营销沙盘系统</p> |
||||
</div> |
||||
<div class="app"> |
||||
<img src="@/assets/img/workbench/4.png" alt=""> |
||||
<p class="name">银行综合系统</p> |
||||
</div> |
||||
<div class="app"> |
||||
<img src="@/assets/img/workbench/5.png" alt=""> |
||||
<p class="name">众筹系统</p> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="block block2"> |
||||
<div class="title">职站教学后台</div> |
||||
<div class="apps"> |
||||
<div class="app" @click="to('/curriculum')"> |
||||
<img src="@/assets/img/workbench/6.png" alt=""> |
||||
<p class="name">教学课程管理</p> |
||||
</div> |
||||
<div class="app" @click="to('/theoreticalCourse')"> |
||||
<img src="@/assets/img/workbench/7.png" alt=""> |
||||
<p class="name">精品课程管理</p> |
||||
</div> |
||||
<div class="app" @click="to('/information')"> |
||||
<img src="@/assets/img/workbench/8.png" alt=""> |
||||
<p class="name">资讯管理</p> |
||||
</div> |
||||
<div class="app" @click="to('/curriculum')"> |
||||
<img src="@/assets/img/workbench/9.png" alt=""> |
||||
<p class="name">资源库</p> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="block middle" @click="to('/shop')"> |
||||
<img src="@/assets/img/workbench/10.png" alt=""> |
||||
<p class="name">产品管理</p> |
||||
</div> |
||||
<div class="block middle" @click="to('/market')"> |
||||
<img src="@/assets/img/workbench/11.png" alt=""> |
||||
<p class="name">营销管理</p> |
||||
</div> |
||||
<div class="block middle" @click="to('/parnerOperation')"> |
||||
<img src="@/assets/img/workbench/12.png" alt=""> |
||||
<p class="name">小程序内容管理</p> |
||||
</div> |
||||
<div class="block middle" @click="to('/parner')"> |
||||
<img src="@/assets/img/workbench/13.png" alt=""> |
||||
<p class="name">销售代理人管理</p> |
||||
</div> |
||||
|
||||
<div class="block block3"> |
||||
<div class="title">运营后台</div> |
||||
<div class="apps"> |
||||
<div class="app" @click="to('/match')"> |
||||
<img src="@/assets/img/workbench/14.png" alt=""> |
||||
<p class="name">大赛管理</p> |
||||
</div> |
||||
<div class="app" @click="to('/data')"> |
||||
<img src="@/assets/img/workbench/15.png" alt=""> |
||||
<p class="name">数据管理</p> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import Setting from '@/setting' |
||||
export default { |
||||
data () { |
||||
return { |
||||
|
||||
|
||||
}; |
||||
}, |
||||
mounted () { |
||||
|
||||
}, |
||||
methods: { |
||||
getData () { |
||||
this.loading = true |
||||
this.$post(this.api.userManagementList, { |
||||
countries: this.form.countries, |
||||
provinceId: this.form.provinces, |
||||
cityId: this.form.city, |
||||
platformId: this.form.platformId, |
||||
schoolId: this.form.schoolId, |
||||
month: this.form.month, |
||||
creationTime: this.form.startTime, |
||||
endTime: this.form.endTime, |
||||
roleId: this.form.accountRole, |
||||
searchContent: this.form.keyword, |
||||
pageNum: this.page, |
||||
pageSize: this.pageSize |
||||
}).then(({ page }) => { |
||||
const { records, total } = page |
||||
records.map(e => { |
||||
e.enable = e.displayState |
||||
if (e.enable === 2) { |
||||
e.enable = 1 |
||||
} |
||||
}) |
||||
this.userData = records |
||||
this.totals = total |
||||
this.loading = false |
||||
}).catch(res => { |
||||
this.loading = false |
||||
}) |
||||
}, |
||||
to (path) { |
||||
this.$router.push(path) |
||||
}, |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="scss" scoped> |
||||
.wrap { |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
justify-content: space-between; |
||||
width: 1000px; |
||||
margin: 0 auto; |
||||
|
||||
.block { |
||||
padding: 20px 20px 0; |
||||
background-color: #fff; |
||||
border-radius: 20px; |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
.block1 { |
||||
width: 55%; |
||||
|
||||
.app { |
||||
width: 30%; |
||||
} |
||||
|
||||
img { |
||||
margin-bottom: 10px; |
||||
} |
||||
} |
||||
|
||||
.block2 { |
||||
width: 40%; |
||||
|
||||
.app { |
||||
width: 48%; |
||||
} |
||||
} |
||||
|
||||
.block3 { |
||||
width: 100%; |
||||
margin-top: 30px; |
||||
|
||||
.app { |
||||
display: inline-flex; |
||||
align-items: center; |
||||
margin-right: 100px; |
||||
} |
||||
|
||||
img { |
||||
margin-right: 20px; |
||||
} |
||||
} |
||||
|
||||
.middle { |
||||
display: inline-flex; |
||||
align-items: center; |
||||
width: 200px; |
||||
padding: 20px; |
||||
margin-top: 30px; |
||||
cursor: pointer; |
||||
|
||||
img { |
||||
margin-right: 20px; |
||||
} |
||||
} |
||||
|
||||
.title { |
||||
margin-bottom: 30px; |
||||
font-size: 18px; |
||||
} |
||||
|
||||
.apps { |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
} |
||||
|
||||
.app { |
||||
margin-bottom: 30px; |
||||
text-align: center; |
||||
cursor: pointer; |
||||
} |
||||
|
||||
.name { |
||||
font-size: 14px; |
||||
color: #333; |
||||
} |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue