Commit 9ebdf5e7 authored by zhengke's avatar zhengke

修改

parent 6e8cf9e4
...@@ -12,7 +12,7 @@ export default { ...@@ -12,7 +12,7 @@ export default {
<style> <style>
@import url('~assets/css/font.css'); @import url('~assets/css/font.css');
@import url('//at.alicdn.com/t/font_2077629_8mt7fp1wle5.css'); @import url('//at.alicdn.com/t/font_2077629_82qvnhne0zp.css');
html, html,
body, body,
......
import request from '../../utils/request'
/**
* 获取网站导航分页
*
*/
export function GetWebNavPage(data) {
return request({
url: '/WebManager/GetWebNavPage',
method: 'post',
data
})
}
/**
* 获取导航类型列表
*
*/
export function GetNavTypeList() {
return request({
url: '/WebManager/GetNavTypeList',
method: 'post',
data:''
})
}
/**
* 新增修改网站导航
*
*/
export function SetWebNav(data) {
return request({
url: '/WebManager/SetWebNav',
method: 'post',
data
})
}
/**
* 修改网站导航状态
*
*/
export function RemoveWebNavStatus(data) {
return request({
url: '/WebManager/RemoveWebNavStatus',
method: 'post',
data
})
}
/**
* 获取网站导航详情
*
*/
export function GetWebNav(data) {
return request({
url: '/WebManager/GetWebNav',
method: 'post',
data
})
}
/**
* 获取网站菜单分页
*
*/
export function GetWebMenuPage(data) {
return request({
url: '/WebManager/GetWebMenuPage',
method: 'post',
data
})
}
/**
* 新增修改网站菜单
*
*/
export function SetWebMenu(data) {
return request({
url: '/WebManager/SetWebMenu',
method: 'post',
data
})
}
<template>
<q-dialog v-model="persistent" content-class="bg-grey-1" persistent transition-show="scale" transition-hide="scale">
<q-card style="width: 800px;max-width:900px;">
<q-card-section>
<div class="text-h6">{{objOption.Id==0?'新增网站导航信息':'修改网站导航信息'}}</div>
</q-card-section>
<q-card-section class="q-pt-none scroll" style="max-height: 70vh">
<div class="text-caption q-mb-lg q-px-md text-grey-6">网站导航信息</div>
<div class="row wrap">
<q-input filled stack-label maxlength="20" :dense="false" v-model="objOption.NavTitle" ref="NavTitle"
class="col-6 q-pr-lg q-pb-lg" label="导航大标题" :rules="[val => !!val || '请填写导航大标题']" />
<q-input filled stack-label maxlength="100" :dense="false" v-model="objOption.SubTitle" ref="SubTitle"
class="col-6 q-pb-lg" label="导航子标题" />
<q-input stack-label maxlength="200" :dense="false" v-model="objOption.LinkUrl" class="col-6 q-pr-lg q-pb-lg"
label="导航地址" />
<q-select class="col-6 q-pb-lg" option-value="Id" option-label="Name" v-model="objOption.NavType"
:options="NavTypeList" emit-value map-options label="导航类型" />
<div class="col-6 q-pb-lg q-pr-lg">
<q-uploader :style="{ backgroundImage: 'url(' + objOption.BgImg + ')' }" style="width:auto;height:200px"
flat hide-upload-btn max-files="1" label="导航背景图" accept=".jpg, image/*" :factory="uploadFile" auto-upload>
</q-uploader>
</div>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right" class="bg-white">
<q-btn label="取消" flat color="grey-10" style="font-weight:400 !important" @click="closeSaveForm" />
<q-btn label="立即提交" color="accent q-px-md" style="font-weight:400 !important" :loading="saveLoading"
@click="saveWebkitMenu" />
</q-card-actions>
</q-card>
</q-dialog>
</template>
<script>
import {
GetNavTypeList,
SetWebNav,
GetWebNav
} from '../../api/system/webkit'
import {
UploadSelfFile
} from "../../api/common/common";
export default {
props: {
saveObj: {
type: Object,
default: null
}
},
data() {
return {
//菜单等级
MenuLevelOpts: [],
//菜单类型
NavTypeList: [],
persistent: true,
objOption: {
Id: 0,
NavTitle: '', //导航大标题
SubTitle: '', //导航子标题
BgImg: '', // 导航背景图
LinkUrl: '', //导航地址
NavType: 0 //导航类型
},
optionTitle: "",
//菜单列表
MenuList: [],
saveLoading: false,
}
},
mounted() {
this.initNavType();
this.initObj()
},
methods: {
//初始化下拉框
initNavType() {
GetNavTypeList().then(res => {
if (res.Code == 1) {
this.NavTypeList = res.Data;
} else {
this.$q.notify({
type: 'negative',
position: "top",
message: res.Message
})
}
})
},
uploadFile(files) {
UploadSelfFile("course", files[0], res => {
if (res.Code == 1) {
this.objOption.BgImg = res.FileUrl;
}
});
},
//初始化表单
initObj() {
if (this.saveObj && this.saveObj.Id > 0) {
GetWebNav({
Id: this.saveObj.Id
}).then(res => {
console.log(res, '数据');
this.objOption.Id = res.Data.Id;
this.objOption.NavTitle = res.Data.NavTitle;
this.objOption.SubTitle = res.Data.SubTitle;
this.objOption.BgImg = res.Data.BgImg;
this.objOption.LinkUrl = res.Data.LinkUrl;
this.objOption.NavType = res.Data.NavType;
})
this.optionTitle = "修改网站导航信息"
} else {
this.optionTitle = "新增网站导航信息"
this.objOption.Id = 0;
this.objOption.NavTitle = '';
this.objOption.SubTitle = '';
this.objOption.BgImg = '';
this.objOption.LinkUrl = '';
this.objOption.NavType = 0;
}
},
//关闭弹窗
closeSaveForm() {
this.$emit('close')
this.persistent = false
},
//保存菜单
saveWebkitMenu() {
this.saveLoading = true
SetWebNav(this.objOption).then(res => {
this.saveLoading = false
this.$q.notify({
icon: 'iconfont icon-chenggong',
color: 'accent',
timeout: 2000,
message: '数据保存成功!',
position: 'top'
})
this.$emit("success")
this.closeSaveForm()
}).catch(() => {
this.saveLoading = false
})
}
},
}
</script>
<template>
<q-dialog v-model="persistent" content-class="bg-grey-1" persistent transition-show="scale" transition-hide="scale">
<q-card style="width: 800px;max-width:900px;">
<q-card-section>
<div class="text-h6">{{objOption.Id==0?'新增网站菜单':'修改网站菜单'}}</div>
</q-card-section>
<q-card-section class="q-pt-none scroll" style="max-height: 70vh">
<div class="text-caption q-mb-lg q-px-md text-grey-6">网站菜单信息</div>
<div class="row wrap">
<q-input filled stack-label maxlength="20" :dense="false" v-model="objOption.Name" ref="Name"
class="col-6 q-pr-lg q-pb-lg" label="菜单名称" :rules="[val => !!val || '请填写菜单名称']" />
<q-input filled stack-label maxlength="100" :dense="false" v-model="objOption.MenuUrl" ref="MenuUrl"
class="col-6 q-pb-lg" label="菜单地址" />
<q-input stack-label maxlength="200" :dense="false" v-model="objOption.ParentId" class="col-6 q-pr-lg q-pb-lg"
label="父级Id" />
<q-input filled stack-label maxlength="100" :dense="false" @keyup.native="checkInteger(objOption,'MenuLevel')" v-model="objOption.MenuLevel" ref="MenuLevel"
class="col-6 q-pb-lg" label="菜单等级" />
<q-input filled stack-label maxlength="100" :dense="false" v-model="objOption.ClassName" ref="ClassName"
class="col-6 q-pb-lg q-pr-lg" label="班级名称" />
<q-input filled stack-label maxlength="100" :dense="false" @keyup.native="checkInteger(objOption,'SortNum')" v-model="objOption.SortNum" ref="SortNum"
class="col-6 q-pb-lg" label="排序" />
<div class="col-6 q-pb-lg q-pr-lg">
<q-uploader :style="{ backgroundImage: 'url(' + objOption.Icon + ')' }" style="width:auto;height:200px"
flat hide-upload-btn max-files="1" label="菜单图标" accept=".jpg, image/*" :factory="uploadFile" auto-upload>
</q-uploader>
</div>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right" class="bg-white">
<q-btn label="取消" flat color="grey-10" style="font-weight:400 !important" @click="closeSaveForm" />
<q-btn label="立即提交" color="accent q-px-md" style="font-weight:400 !important" :loading="saveLoading"
@click="saveWebkitMenu" />
</q-card-actions>
</q-card>
</q-dialog>
</template>
<script>
import {
GetNavTypeList,
SetWebMenu,
GetWebNav
} from '../../api/system/webkit'
import {
UploadSelfFile
} from "../../api/common/common";
export default {
props: {
saveObj: {
type: Object,
default: null
}
},
data() {
return {
//菜单等级
MenuLevelOpts: [],
//菜单类型
NavTypeList: [],
persistent: true,
objOption: {
Id: 0,
Name: '', //菜单名称
MenuUrl: '',
ParentId: 0,
MenuLevel: '',
ClassName : '',
Icon:'',
SortNum:''
},
optionTitle: "",
//菜单列表
MenuList: [],
saveLoading: false,
}
},
mounted() {
this.initNavType();
this.initObj()
},
methods: {
//初始化下拉框
initNavType() {
GetNavTypeList().then(res => {
if (res.Code == 1) {
this.NavTypeList = res.Data;
} else {
this.$q.notify({
type: 'negative',
position: "top",
message: res.Message
})
}
})
},
uploadFile(files) {
UploadSelfFile("course", files[0], res => {
if (res.Code == 1) {
this.objOption.Icon = res.FileUrl;
}
});
},
//初始化表单
initObj() {
if (this.saveObj && this.saveObj.Id > 0) {
GetWebNav({
Id: this.saveObj.Id
}).then(res => {
console.log(res, '数据');
this.objOption.Id = res.Data.Id;
this.objOption.NavTitle = res.Data.NavTitle;
this.objOption.SubTitle = res.Data.SubTitle;
this.objOption.BgImg = res.Data.BgImg;
this.objOption.LinkUrl = res.Data.LinkUrl;
this.objOption.NavType = res.Data.NavType;
})
this.optionTitle = "修改网站导航信息"
} else {
this.optionTitle = "新增网站导航信息"
this.objOption.Id = 0;
this.objOption.NavTitle = '';
this.objOption.SubTitle = '';
this.objOption.BgImg = '';
this.objOption.LinkUrl = '';
this.objOption.NavType = 0;
}
},
//关闭弹窗
closeSaveForm() {
this.$emit('close')
this.persistent = false
},
//保存菜单
saveWebkitMenu() {
this.saveLoading = true
SetWebMenu(this.objOption).then(res => {
this.saveLoading = false
this.$q.notify({
icon: 'iconfont icon-chenggong',
color: 'accent',
timeout: 2000,
message: '数据保存成功!',
position: 'top'
})
this.$emit("success")
this.closeSaveForm()
}).catch(() => {
this.saveLoading = false
})
}
},
}
</script>
<template>
<div class="page-body">
<div class="page-search row items-center">
<div class="col row wrap q-mr-lg q-col-gutter-md">
<div class="col-3">
<q-input @change="resetSearch" clearable standout="bg-primary text-white" class="col-6 q-pr-lg q-pr-lg"
v-model="msg.Name" label="菜单名称" maxlength="20" @clear="resetSearch" />
</div>
<div class="col-3">
<q-select @input="resetSearch" standout="bg-primary text-white" class="col-6 q-pr-lg q-pr-lg"
v-model="msg.Status" :options="ShowOpts" emit-value map-options label="状态" />
</div>
</div>
</div>
<div class="page-content">
<q-table :pagination="msg" :loading="loading" no-data-label="暂无相关数据" flat class="sticky-column-table"
separator="none" :data="data" :columns="columns" row-key="name">
<template v-slot:top="props">
<div class="col-2 q-table__title">导航信息</div>
<q-space />
<div class="page-option">
<q-btn color="accent" class="q-mr-md" size="sm" icon="add" label="新增导航" @click="EditMenu(null)" />
</div>
</template>
<template v-slot:body-cell-Icon="props">
<q-td :props="props">
<img :src="props.row.Icon" style="width:50px;" />
</q-td>
</template>
<template v-slot:body-cell-Status="props">
<q-td :props="props">
<q-toggle size="md" color="primary" :false-value="1" :true-value="0" v-model="props.row.Status"
title="注意:关闭后,分类将无法正常使用." @input="DeleteMenu(props.row)" />
</q-td>
</template>
<template v-slot:bottom>
<q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount"
:input="true" @input="changePage" />
</template>
<template v-slot:body-cell-optioned="props">
<q-td :props="props">
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="编辑"
@click="EditMenu(props.row)" />
</q-td>
</template>
</q-table>
<webmenu-form v-if="isShowMenuForm" :save-obj="menuObjOption" @close="closeMenuSaveForm" @success="refreshPage">
</webmenu-form>
</div>
</div>
</template>
<script>
import {
GetWebMenuPage,
RemoveWebMenuStatus,
} from '../../api/system/webkit'
import webmenuForm from '../../components/system/webmenu-form'
export default {
meta: {
title: "菜单管理"
},
components: {
webmenuForm
},
data() {
return {
columns: [{
name: 'Name',
label: '菜单名称',
field: 'Name',
align: 'left'
},
{
name: 'MenuUrl',
label: '菜单链接',
field: 'MenuUrl',
align: 'left'
},
{
name: 'MenuLevel',
label: '菜单等级',
field: 'MenuLevel',
align: 'left'
},
{
name: 'Icon',
label: '图标',
field: 'Icon',
align: 'left'
},
{
name: 'Status',
label: '状态',
field: 'Status',
align: 'left'
},
{
name: 'optioned',
label: '操作',
field: 'MenuId'
}
],
data: [],
loading: true,
ShowOpts: [{
label: '全部',
value: -1
},
{
label: '正常',
value: 0
},
{
label: '删除',
value: 1
}
],
msg: {
pageIndex: 1,
pageSize: 12,
rowsPerPage: 12,
Name:'',
Status: -1
},
pageCount: 0,
isShowMenuForm: false,
menuObjOption: null,
}
},
mounted() {
this.getList()
},
methods: {
//修改菜单状态
DeleteMenu(obj) {
var that = this;
var delMsg = {
Id: obj.Id,
Status: obj.Status
};
var tipMsg = "";
if (delMsg.Status == 0) {
tipMsg = "是否启用【" + obj.NavTitle + "】菜单?";
} else {
tipMsg = "是否禁用【" + obj.NavTitle + "】菜单?";
}
this.$q.dialog({
title: '提示信息',
message: tipMsg,
cancel: true,
persistent: true,
ok: "确定",
cancel: "取消",
}).onOk(() => {
RemoveWebMenuStatus(delMsg).then(res => {
if (res.Code == 1) {
that.$q.notify({
icon: 'iconfont icon-chenggong',
color: 'accent',
timeout: 2000,
message: '操作成功',
position: 'top'
})
that.getList();
}
})
}).onCancel(() => {
obj.Status = obj.Status == 1 ? 0 : 1;
});
},
//重新查询
resetSearch() {
this.msg.pageIndex = 1;
this.getList();
},
//翻页
changePage(val) {
this.msg.pageIndex = val;
this.getList()
},
//获取菜单分页列表
getList() {
this.loading = true;
GetWebMenuPage(this.msg).then(res => {
console.log(res,'数据来也!');
this.loading = false
this.data = res.Data.PageData;
this.pageCount = res.Data.PageCount;
}).catch(() => {
this.loading = false
})
},
//刷新页面
refreshPage() {
if (!this.menuObjOption) {
this.msg.pageIndex = 1;
this.msg.NavTitle = "";
this.msg.SubTitle = "";
this.msg.NavType = 0;
this.msg.Status = "-1";
}
this.getList()
},
//新增修改菜单
EditMenu(obj) {
if (obj) {
this.menuObjOption = obj
} else {
this.menuObjOption = null
}
this.isShowMenuForm = true
},
//关闭弹窗
closeMenuSaveForm() {
this.isShowMenuForm = false
},
}
}
</script>
<style lang="sass">
@import url('~assets/css/table.sass')
</style>
<template>
<div class="page-body">
<div class="page-search row items-center">
<div class="col row wrap q-mr-lg q-col-gutter-md">
<div class="col-3">
<q-input @change="resetSearch" clearable standout="bg-primary text-white" class="col-6 q-pr-lg q-pr-lg"
v-model="msg.NavTitle" label="导航大图标" maxlength="20" @clear="resetSearch" />
</div>
<div class="col-3">
<q-input @change="resetSearch" clearable standout="bg-primary text-white" class="col-6 q-pr-lg q-pr-lg"
v-model="msg.SubTitle" label="导航子标题" maxlength="20" @clear="resetSearch" />
</div>
<div class="col-3">
<q-select @input="resetSearch" option-value="Id" option-label="Name" standout="bg-primary text-white" v-model="msg.NavType"
class="col-6 q-pr-lg q-pr-lg" :options="NavTypeList" emit-value map-options label="导航类型" />
</div>
<div class="col-3">
<q-select @input="resetSearch" standout="bg-primary text-white" class="col-6 q-pr-lg q-pr-lg"
v-model="msg.Status" :options="ShowOpts" emit-value map-options label="状态" />
</div>
</div>
</div>
<div class="page-content">
<q-table :pagination="msg" :loading="loading" no-data-label="暂无相关数据" flat class="sticky-column-table"
separator="none" :data="data" :columns="columns" row-key="name">
<template v-slot:top="props">
<div class="col-2 q-table__title">导航信息</div>
<q-space />
<div class="page-option">
<q-btn color="accent" class="q-mr-md" size="sm" icon="add" label="新增导航" @click="EditMenu(null)" />
</div>
</template>
<template v-slot:body-cell-BgImg="props">
<q-td :props="props">
<img :src="props.row.BgImg" style="width:50px;" />
</q-td>
</template>
<template v-slot:body-cell-Status="props">
<q-td :props="props">
<q-toggle size="md" color="primary" :false-value="1" :true-value="0" v-model="props.row.Status"
title="注意:关闭后,分类将无法正常使用." @input="DeleteMenu(props.row)" />
</q-td>
</template>
<template v-slot:bottom>
<q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount"
:input="true" @input="changePage" />
</template>
<template v-slot:body-cell-optioned="props">
<q-td :props="props">
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="编辑"
@click="EditMenu(props.row)" />
</q-td>
</template>
</q-table>
<webkit-form v-if="isShowWebkitForm" :save-obj="webkitObjOption" @close="closeWebSaveForm" @success="refreshPage">
</webkit-form>
</div>
</div>
</template>
<script>
import {
GetWebNavPage,
GetNavTypeList,
RemoveWebNavStatus,
} from '../../api/system/webkit'
import webkitForm from '../../components/system/webkit-form'
export default {
meta: {
title: "网站管理"
},
components: {
webkitForm
},
data() {
return {
columns: [{
name: 'NavTitle',
label: '导航大标题',
field: 'NavTitle',
align: 'left'
},
{
name: 'SubTitle',
label: '导航子标题',
field: 'SubTitle',
align: 'left'
},
{
name: 'BgImg',
label: '导航背景图',
field: 'BgImg',
align: 'left'
},
{
name: 'LinkUrl',
label: '导航地址',
field: 'LinkUrl',
align: 'left'
},
{
name: 'NavTypeName',
label: '导航类型',
field: 'NavTypeName',
align: 'left'
},
{
name: 'Status',
label: '状态',
field: 'Status',
align: 'left'
},
{
name: 'optioned',
label: '操作',
field: 'MenuId'
}
],
data: [],
loading: true,
ShowOpts: [{
label: '全部',
value: -1
},
{
label: '正常',
value: 0
},
{
label: '删除',
value: 1
}
],
//菜单类型
NavTypeList: [],
msg: {
pageIndex: 1,
pageSize: 12,
rowsPerPage: 12,
NavTitle: "",
SubTitle: "",
NavType: 0,
Status: -1,
},
pageCount: 0,
isShowWebkitForm: false,
webkitObjOption: null,
}
},
mounted() {
this.initNavType();
this.getList()
},
methods: {
//初始化下拉框
initNavType() {
GetNavTypeList().then(res => {
if (res.Code == 1) {
this.NavTypeList = res.Data;
let obj = {
Id:0,
Name:'不限'
}
this.NavTypeList.unshift(obj);
} else {
this.$q.notify({
type: 'negative',
position: "top",
message: res.Message
})
}
})
},
//修改菜单状态
DeleteMenu(obj) {
var that = this;
var delMsg = {
Id: obj.Id,
Status: obj.Status
};
var tipMsg = "";
if (delMsg.Status == 0) {
tipMsg = "是否启用【" + obj.NavTitle + "】菜单?";
} else {
tipMsg = "是否禁用【" + obj.NavTitle + "】菜单?";
}
this.$q.dialog({
title: '提示信息',
message: tipMsg,
cancel: true,
persistent: true,
ok: "确定",
cancel: "取消",
}).onOk(() => {
RemoveWebNavStatus(delMsg).then(res => {
if (res.Code == 1) {
that.$q.notify({
icon: 'iconfont icon-chenggong',
color: 'accent',
timeout: 2000,
message: '操作成功',
position: 'top'
})
that.getList();
}
})
}).onCancel(() => {
obj.Status = obj.Status == 1 ? 0 : 1;
});
},
//重新查询
resetSearch() {
this.msg.pageIndex = 1;
this.getList();
},
//翻页
changePage(val) {
this.msg.pageIndex = val;
this.getList()
},
//获取菜单分页列表
getList() {
this.loading = true;
GetWebNavPage(this.msg).then(res => {
this.loading = false
this.data = res.Data.PageData;
this.pageCount = res.Data.PageCount;
}).catch(() => {
this.loading = false
})
},
//刷新页面
refreshPage() {
if (!this.webkitObjOption) {
this.msg.pageIndex = 1;
this.msg.NavTitle = "";
this.msg.SubTitle = "";
this.msg.NavType = 0;
this.msg.Status = "-1";
}
this.getList()
},
//新增修改菜单
EditMenu(obj) {
if (obj) {
this.webkitObjOption = obj
} else {
this.webkitObjOption = null
}
this.isShowWebkitForm = true
},
//关闭弹窗
closeWebSaveForm() {
this.isShowWebkitForm = false
},
}
}
</script>
<style lang="sass">
@import url('~assets/css/table.sass')
</style>
...@@ -97,6 +97,16 @@ const routes = [{ ...@@ -97,6 +97,16 @@ const routes = [{
component: () => component: () =>
import("pages/system/okrmanage.vue") import("pages/system/okrmanage.vue")
}, },
{
path: "/system/webkitManage", //网站管理
component: () =>
import("pages/system/webkitManage.vue")
},
{
path: "/system/menuManage", //菜单管理
component: () =>
import("pages/system/menuManage.vue")
},
{ {
path: "/course/catagory", //课程分类 path: "/course/catagory", //课程分类
component: () => component: () =>
......
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