|
|
@@ -0,0 +1,468 @@
|
|
|
+<template>
|
|
|
+ <div class="pageConfig-box">
|
|
|
+ <div class="pageConfig-head">
|
|
|
+ <div style="display: flex;">
|
|
|
+ <div>
|
|
|
+ <el-select @change="Inquirechange()" v-model="ModulValue" clearable placeholder="全部模块">
|
|
|
+ <el-option v-for="item in ModulList" :key="item.value" :label="item.name" :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div style="display: flex;">
|
|
|
+ <el-input placeholder="请输入页面名称" v-model="SearchInput" clearable></el-input>
|
|
|
+
|
|
|
+ <el-button type="primary" @click="btnSearch" >搜 索</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-button type="primary" @click="pageload()" >刷 新</el-button>
|
|
|
+ <el-button type="primary" @click="addPage" >添 加</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="pageConfig-table">
|
|
|
+ <el-table :data="pageList.slice((currentPage - 1) * pageSize, currentPage * pageSize)" border style="width: 100%">
|
|
|
+ <el-table-column prop="pageName" label="页面名称" width="130" >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="systemMenuCode" label="页面Code" width="130">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="webUrl" label="WebUrl" width="130" >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="androidUrl" label="AndroidUrl" width="130">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="iosUrl" label="IosUrl" width="130">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="手机端图标" prop="icon" width="130" >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="pageIsEnable" label="web端启用" width="130">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-checkbox :true-label="1" disabled :false-label="0" v-model="pageList[scope.$index].pageIsEnable" ></el-checkbox>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="pagePhoneIsEnable" label="手机端启用" width="130">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-checkbox :true-label="1" disabled :false-label="0" v-model="pageList[scope.$index].pagePhoneIsEnable" ></el-checkbox>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button type="primary" size="small" icon="el-icon-s-tools" @click="Edit(pageList[scope.$index])" >编 辑</el-button>
|
|
|
+ <el-button type="primary" size="small" icon="el-icon-s-tools" @click="PageBindFun(pageList[scope.$index])" >功 能</el-button>
|
|
|
+ <el-button type="danger" size="small" icon="el-icon-delete-solid" @click="Del(pageList[scope.$index])" >删 除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div class="block">
|
|
|
+ <el-pagination align='center' @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
|
|
+ :current-page="currentPage" :page-sizes="[5,10,14,20]" :page-size="pageSize"
|
|
|
+ layout="total, sizes, prev, pager, next" :total="pageList.length">
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-dialog
|
|
|
+ title="提示"
|
|
|
+ width="30%"
|
|
|
+ :visible.sync="dialogVisible"
|
|
|
+ :modal-append-to-body='false'
|
|
|
+ :append-to-body="false"
|
|
|
+ >
|
|
|
+ <span>这是一段信息</span>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <Modal :title="dialogTitle" :height="350" :width="700" :show.sync="showModal" restrict-to=".is-vertical" @close="showModal = false" >
|
|
|
+ <template v-slot:content>
|
|
|
+ <div style=" padding: 10px;">
|
|
|
+ <el-form label-position="left" label-width="80px" :model="pageBind" :rules="rules" ref="pageBind">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="页面模块" prop="modulid"> <!--style="width: 48%;" -->
|
|
|
+ <el-select v-model="pageBind.modulid" placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="item in Modulfiltr"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="页面名称" prop="pageName"> <!--style="width: 48%;" -->
|
|
|
+ <el-input v-model="pageBind.pageName"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="页面代码" prop="systemMenuCode" >
|
|
|
+ <el-input v-model="pageBind.systemMenuCode"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="webUrl" prop="webUrl" >
|
|
|
+ <el-input v-model="pageBind.webUrl"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="AndroidUrl">
|
|
|
+ <el-input v-model="pageBind.androidUrl"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="IosUrl">
|
|
|
+ <el-input v-model="pageBind.iosUrl"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="图标">
|
|
|
+ <el-input v-model="pageBind.icon"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="16">
|
|
|
+ <el-form-item label="页面备注">
|
|
|
+ <el-input v-model="pageBind.pageRemark"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ </el-row>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="16">
|
|
|
+ <el-checkbox label="Web" :true-label="1" :false-label="0" v-model="pageBind.pageIsEnable"></el-checkbox>
|
|
|
+ <el-checkbox label="Android是否启用" :true-label="1" :false-label="0" v-model="pageBind.pagePhoneIsEnable" ></el-checkbox>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-slot:footer>
|
|
|
+ <div>
|
|
|
+ <el-button @click="showModal = false" type="danger">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="PageSave">保 存</el-button>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </Modal>
|
|
|
+
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+
|
|
|
+<script>
|
|
|
+import { cw } from '@fullcalendar/core/internal-common';
|
|
|
+import { promised, reject, resolve } from 'q';
|
|
|
+import Modal from '../template/dialog.vue';
|
|
|
+
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ bufferData:{},//暂存数据
|
|
|
+ pageList:[], //页面数据
|
|
|
+ SearchInput:'', //查询的值
|
|
|
+ currentPage : 1 , //页码
|
|
|
+ pageSize: 5,// 每页的数据条数
|
|
|
+ ModulValue:'', //模块val
|
|
|
+ ModulList:[],//模块数据
|
|
|
+ PathUrl:'http://localhost:5256',
|
|
|
+ dialogVisible: false,
|
|
|
+ showModal: false, //测试弹层
|
|
|
+ dialogTitle:'测试标题',
|
|
|
+ pageBind:{
|
|
|
+ androidUrl:'',
|
|
|
+ iosUrl:'',
|
|
|
+ pageIsEnable:0,
|
|
|
+ pageName:'',
|
|
|
+ pagePhoneIsEnable:0,
|
|
|
+ pageid:-1,
|
|
|
+ systemMenuCode:'',
|
|
|
+ webUrl:'',
|
|
|
+ modulName:'',
|
|
|
+ modulid:'',
|
|
|
+ icon:'',
|
|
|
+ modulRemark:'',
|
|
|
+ sTid:5,
|
|
|
+ pageRemark:'',
|
|
|
+ },//数据绑定对象
|
|
|
+ rules: {
|
|
|
+ pageName: [
|
|
|
+ { required: true, message: '请输入页面名称', trigger: 'blur' },
|
|
|
+ ],
|
|
|
+ modulid:[
|
|
|
+ { required: true, message: '请选中模块', trigger: 'blur' },
|
|
|
+ ],
|
|
|
+ systemMenuCode:[
|
|
|
+ { required: true, message: '请输入页面代码', trigger: 'blur' },
|
|
|
+ ]
|
|
|
+ ,webUrl:[
|
|
|
+ { required: true, message: '请输入WebUrl', trigger: 'blur' },
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ pageload(){
|
|
|
+ var that = this;
|
|
|
+ this.$axios.post(this.PathUrl + '/api/System/PageConfigInit', {
|
|
|
+
|
|
|
+ }, {
|
|
|
+ headers: {
|
|
|
+ 'Authorization': 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IkZ1dHVyZSIsImV4cCI6MTY3OTU0MjgwNSwiaXNzIjoiT0FTeXN0ZW0uY29tIiwiYXVkIjoiT0FTeXN0ZW0uY29tIn0.iy5SUInq1p3yjZultRPyzCa2ekLeepSdMLxvPwXY6MI',
|
|
|
+ }
|
|
|
+ }).then(resp => {
|
|
|
+ console.log(resp.data.data);
|
|
|
+ if (resp.data.code == 200) {
|
|
|
+ that.bufferData = resp.data.data;
|
|
|
+ that.ModulList = resp.data.data.modList.data;
|
|
|
+ that.ModulList.unshift({
|
|
|
+ 'id':-1,
|
|
|
+ 'name':"全部模块",
|
|
|
+ 'sTid':-1
|
|
|
+ });
|
|
|
+ that.pageList = resp.data.data.viewList.data;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ Inquirechange() {
|
|
|
+
|
|
|
+ var that = this;
|
|
|
+ if(this.ModulValue == -1){
|
|
|
+ this.pageList = this.bufferData.viewList.data;
|
|
|
+ }else{
|
|
|
+ this.pageList = this.bufferData.viewList.data.filter(function(item, i, arr) {
|
|
|
+ return item.modulid == that.ModulValue;
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ this.currentPage = 1;
|
|
|
+ },
|
|
|
+ //每页条数改变时触发 选择一页显示多少行
|
|
|
+ handleSizeChange(val) {
|
|
|
+ this.currentPage = 1;
|
|
|
+ this.pageSize = val;
|
|
|
+ },
|
|
|
+ //当前页改变时触发 跳转其他页
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.currentPage = val;
|
|
|
+ },
|
|
|
+ //搜索按钮
|
|
|
+ btnSearch(){
|
|
|
+ var that = this;
|
|
|
+ this.pageList = this.bufferData.viewList.data.filter(function(item, i, arr) {
|
|
|
+ return item.pageName.indexOf(that.SearchInput) != -1;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ addPage(){
|
|
|
+ this.showModal = true;
|
|
|
+ this.dialogTitle='添加页面';
|
|
|
+ this.pageBind = {
|
|
|
+ androidUrl:'',
|
|
|
+ iosUrl:'',
|
|
|
+ pageIsEnable:0,
|
|
|
+ pageName:'',
|
|
|
+ pagePhoneIsEnable:0,
|
|
|
+ pageid:-1,
|
|
|
+ systemMenuCode:'',
|
|
|
+ webUrl:'',
|
|
|
+ modulName:'',
|
|
|
+ modulid:'',
|
|
|
+ icon:'',
|
|
|
+ modulRemark:'',
|
|
|
+ sTid:5,
|
|
|
+ pageRemark:'',
|
|
|
+ };
|
|
|
+ },
|
|
|
+ Edit(page){
|
|
|
+ //this.dialogVisible = true;
|
|
|
+ this.showModal = true;
|
|
|
+ this.dialogTitle='编辑页面';
|
|
|
+ console.log(page);
|
|
|
+ this.pageBind = {
|
|
|
+ androidUrl:page.androidUrl,
|
|
|
+ iosUrl:page.iosUrl,
|
|
|
+ pageIsEnable:page.pageIsEnable,
|
|
|
+ pageName:page.pageName,
|
|
|
+ pagePhoneIsEnable:page.pagePhoneIsEnable,
|
|
|
+ pageid:page.pageid,
|
|
|
+ systemMenuCode:page.systemMenuCode,
|
|
|
+ webUrl:page.webUrl,
|
|
|
+ modulName:page.modulName,
|
|
|
+ modulid:page.modulid,
|
|
|
+ icon:page.icon,
|
|
|
+ modulRemark:page.modulRemark,
|
|
|
+ sTid:page.sTid,
|
|
|
+ pageRemark:page.pageRemark,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ PageSave(){
|
|
|
+ var that = this;
|
|
|
+ if(this.pageBind.pageid == -1){
|
|
|
+
|
|
|
+ var p = new Promise((resolve,reject)=>{
|
|
|
+ this.$refs.pageBind.validate((valid) => {
|
|
|
+ if(valid){
|
|
|
+ resolve(true);
|
|
|
+ }else{
|
|
|
+ reject(false);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ })
|
|
|
+
|
|
|
+ p.then(resolve=>{
|
|
|
+ //新增
|
|
|
+ this.$axios.post(this.PathUrl + '/api/System/AddPageInfo', this.pageBind, {
|
|
|
+ headers: {
|
|
|
+ 'Authorization': 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IkZ1dHVyZSIsImV4cCI6MTY3OTU0MjgwNSwiaXNzIjoiT0FTeXN0ZW0uY29tIiwiYXVkIjoiT0FTeXN0ZW0uY29tIn0.iy5SUInq1p3yjZultRPyzCa2ekLeepSdMLxvPwXY6MI',
|
|
|
+ }
|
|
|
+ }).then(resp => {
|
|
|
+ that.showModal = false;
|
|
|
+
|
|
|
+ if (resp.data.code == 200) {
|
|
|
+ this.$message({
|
|
|
+ message: '添加成功',
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ }else{
|
|
|
+ this.$message.error(resp.data.msg);
|
|
|
+ }
|
|
|
+ that.pageload();
|
|
|
+ })
|
|
|
+ }).catch(err=>{
|
|
|
+ console.log("表单验证未通过");
|
|
|
+ })
|
|
|
+
|
|
|
+ }else{
|
|
|
+ //修改
|
|
|
+ var p = new Promise((resolve,reject)=>{
|
|
|
+ this.$refs.pageBind.validate((valid) => {
|
|
|
+ if(valid){
|
|
|
+ resolve(true);
|
|
|
+ }else{
|
|
|
+ reject(false);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ })
|
|
|
+
|
|
|
+ p.then(resolve=>{
|
|
|
+ //新增
|
|
|
+ this.$axios.post(this.PathUrl + '/api/System/EditPageInfo', this.pageBind, {
|
|
|
+ headers: {
|
|
|
+ 'Authorization': 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IkZ1dHVyZSIsImV4cCI6MTY3OTU0MjgwNSwiaXNzIjoiT0FTeXN0ZW0uY29tIiwiYXVkIjoiT0FTeXN0ZW0uY29tIn0.iy5SUInq1p3yjZultRPyzCa2ekLeepSdMLxvPwXY6MI',
|
|
|
+ }
|
|
|
+ }).then(resp => {
|
|
|
+ that.showModal = false;
|
|
|
+
|
|
|
+ if (resp.data.code == 200) {
|
|
|
+ this.$message({
|
|
|
+ message: '保存成功!',
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ }else{
|
|
|
+ this.$message.error(resp.data.msg);
|
|
|
+ }
|
|
|
+ that.pageload();
|
|
|
+ })
|
|
|
+ }).catch(err=>{
|
|
|
+ console.log("表单验证未通过");
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ Del(page){
|
|
|
+ let that = this;
|
|
|
+ var dellist = [];
|
|
|
+ dellist.push({
|
|
|
+ 'Pageid':page.pageid,
|
|
|
+ 'Userid':235,
|
|
|
+ })
|
|
|
+
|
|
|
+ this.$axios.post(this.PathUrl + '/api/System/DelPageInfo',dellist, {
|
|
|
+ headers: {
|
|
|
+ 'Authorization': 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IkZ1dHVyZSIsImV4cCI6MTY3OTU0MjgwNSwiaXNzIjoiT0FTeXN0ZW0uY29tIiwiYXVkIjoiT0FTeXN0ZW0uY29tIn0.iy5SUInq1p3yjZultRPyzCa2ekLeepSdMLxvPwXY6MI',
|
|
|
+ }
|
|
|
+ }).then(resp => {
|
|
|
+ if (resp.data.code == 200) {
|
|
|
+ this.$message({
|
|
|
+ message: '删除成功!',
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$message.error('删除失败!' + resp.data.msg);
|
|
|
+ }
|
|
|
+ that.pageload();
|
|
|
+
|
|
|
+ }).catch(err=>{
|
|
|
+ this.$message.error('网络错误!');
|
|
|
+ })
|
|
|
+ },
|
|
|
+ PageBindFun(page){
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ mounted(){
|
|
|
+ this.pageload();
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ Modal
|
|
|
+ },
|
|
|
+ computed:{
|
|
|
+ Modulfiltr(){
|
|
|
+ return this.bufferData.modList.data.filter((item,i,arr)=>{
|
|
|
+ return item.id != -1;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style>
|
|
|
+body {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.pageConfig-head {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+
|
|
|
+.pageConfig-box {
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 10px;
|
|
|
+ border-radius: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.pageConfig-table {
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.pageConfig-table .block {
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.pageConfig-table .el-table--enable-row-transition .el-table__body td.el-table__cell {
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.job-table .el-table--border .el-table__cell:first-child .cell {
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.el-checkbox__input.is-disabled + .el-checkbox__label {
|
|
|
+ color: #808080 !important;
|
|
|
+}
|
|
|
+
|
|
|
+.el-checkbox__input.is-disabled.is-checked + .el-checkbox__label {
|
|
|
+ color: #1890ff !important;
|
|
|
+}
|
|
|
+
|
|
|
+.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
|
|
|
+ background-color: #1890ff !important;
|
|
|
+ border-color: #1890ff !important;
|
|
|
+}
|
|
|
+
|
|
|
+</style>
|
Yuan