Skip to content

E
ElectricitySheep
Commit 35f0ea4f authored by zhengke's avatar zhengke
Browse files
Options

增加页面

parent 59e6fc9a
Hide whitespace changes
Inline Side-by-side
Showing with 472 additions and 13 deletions
src/components/StoreDesign/Article.vue 0 → 100644
View file @ 35f0ea4f
<template>
<div class="Article">
<template v-if="ArticleIsShowAdd">
<div class="head-title">
文章列表
<el-button @click="ArticleIsShowAdd=false" style="float:right;margin-top: -5px;" size="small" type="primary">
添加文章
</el-button>
</div>
<div class="content">
<div>
<div class="searchInput">
<el-input style="display:inline-block;width:225px;height:30px" placeholder="请输入搜索内容"
v-model="msg.NavIconName" size="small" clearable @keyup.enter.native="msg.pageIndex=1,getList()">
</el-input>
<span class="el-icon-search" style="color:#979dad;font-size:14px;position:relative;top:1px"
@click="msg.pageIndex=1,getList()"> </span>
</div>
</div>
<el-table :data="dataList" v-loading="loading" border style="width: 100%;margin:20px 0">
<el-table-column prop="id" label="ID" width="150">
</el-table-column>
<el-table-column prop="title" label="标题" width="829">
</el-table-column>
<el-table-column prop="sort" label="排序" width="250">
</el-table-column>
<el-table-column prop="status" label="状态" width="150">
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<img @click="EditArticle(scope.row)" class="operatImg"
src="../../assets/img/userman/edit.png" alt="">
<img @click="RemoveArticle(scope.row)" class="operatImg"
src="../../assets/img/userman/del.png" alt="">
</template>
</el-table-column>
</el-table>
<el-pagination style="text-align:right" background @current-change="handleCurrentChange"
:page-size="msg.pageSize" layout="prev, pager, next" :total="total">
</el-pagination>
</div>
</template>
<template v-else>
<div class="head-title">
<span @click="ArticleIsShowAdd=true" style="color:rgb(64, 158, 255);cursor:pointer;">文章</span><span
style="margin:0 9px;color:#C0C4CC">/</span><span>文章编辑</span>
</div>
<div class="content">
<div class="Article_condiv">
<el-form :model="addMsg" :rules="rules" ref="addMsg" label-width="100px" style="padding:0 20px;">
<el-form-item label="标题" prop="title">
<el-input v-model="addMsg.title" size="small" placeholder="请输入名称" maxlength="20" />
</el-form-item>
<el-form-item label="排序">
<el-input type="text" v-model="addMsg.Sort" size="small" placeholder="请输入排序"
maxlength="4" />
</el-form-item>
<el-form-item label="状态">
<el-switch v-model="addMsg.status" active-color="#409EFF" :active-value="1" :inactive-value="0">
</el-switch>
</el-form-item>
<el-form-item label="内容">
<div style="line-height:normal;">
<UE :defaultMsg="defaultMsg" :config="config" ref="ue" @input="input"></UE>
</div>
</el-form-item>
</el-form>
</div>
</div>
<el-button size="small" style="margin-top:20px;padding:9px 25px;" type="primary" @click="submitform('addMsg')">保存
</el-button>
</template>
</div>
</template>
<script>
import UE from '@/components/global/UE.vue'
export default {
data() {
return {
//是否线下链接弹窗
loading: false,
dataList: [{
id:123,
title:'标题',
sort:1,
status:0
}],
msg: {
pageIndex: 1,
pageSize: 15,
NavIconName: "",
MallBaseId: 0,
NavIconIsShow:-1
},
total: 0,
ArticleIsShowAdd: true,
addMsg: {
title:'', //标题
Sort:'', //排序
status:0, //状态
content:'' // 内容
},
rules:{
title: [
{ required: true, message: '标题不能为空', trigger: 'change' }
],
},
defaultMsg: '',
config: {
initialFrameWidth: null,
initialFrameHeight: 350,
},
};
},
components: {
UE
},
created() {
},
methods: {
getMenu() {
//调用子组件方法
var obj = this.$refs.chooseMeun.getChooseMenu();
this.addMsg.NavIconUrl = obj.PageUrl;
this.isShowLink = false;
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
getList() {
// this.apipost("/api/Tenant/GetMiniProgrameNaviconPage", this.msg, res => {
// if (res.data.resultCode == 1) {
// this.dataList = res.data.data.pageData;
// this.total = res.data.data.count;
// } else {
// this.Info(res.data.message);
// }
// })
},
submitform(addMsg) {
//提交创建、修改表单
this.$refs[addMsg].validate(valid => {
if (valid) {
this.saveMsg();
} else {
return false;
}
});
},
//保存
saveMsg() {
},
//修改
EditArticle(item) {
},
//删除
RemoveArticle(item) {
var that = this;
that.Confirm("是否要删除?", function () {
that.apipost("/api/Tenant/RemoveMiniProgrameNavicon", {
NavIconId: item.NavIconId
}, res => {
if (res.data.resultCode == 1) {
that.getList();
} else {
that.Info(res.data.message);
}
})
})
},
input(obj) {
this.addMsg.content = obj
},
},
mounted() {
this.getList();
}
};
</script>
<style>
.Article .content .searchInput {
border: 1px solid #DCDFE6;
border-radius: 4px;
}
.Article .content .searchInput .el-input__inner {
border: none;
outline: none;
height: 30px;
line-height: 30px;
}
.Article .content .searchInput {
line-height: normal;
display: inline-table;
width: 100%;
border-collapse: separate;
border-spacing: 0;
width: 250px;
margin-right: 20px;
}
.Article .content {
background: #fff;
margin-top: 10px;
padding: 20px;
box-sizing: border-box;
}
.Article .operatImg{
width:32px;
height:32px;
margin:0 10px
}
.Article .Article_condiv{
padding: 20px 0;
background-color: #fff;
margin-bottom: 20px;
padding-right: 50%;
}
</style>
src/components/StoreDesign/ProjectClassific.vue 0 → 100644
View file @ 35f0ea4f
<template>
<div class="projectClass">
<template v-if="projectClassIsShowAdd">
<div class="head-title">
文章列表
<el-button @click="projectClassIsShowAdd=false" style="float:right;margin-top: -5px;" size="small" type="primary">
添加文章
</el-button>
</div>
<div class="content">
<div>
<div class="searchInput">
<el-input style="display:inline-block;width:225px;height:30px" placeholder="请输入搜索内容"
v-model="msg.NavIconName" size="small" clearable @keyup.enter.native="msg.pageIndex=1,getList()">
</el-input>
<span class="el-icon-search" style="color:#979dad;font-size:14px;position:relative;top:1px"
@click="msg.pageIndex=1,getList()"> </span>
</div>
</div>
<el-table :data="dataList" v-loading="loading" border style="width: 100%;margin:20px 0">
<el-table-column prop="id" label="ID" width="150">
</el-table-column>
<el-table-column prop="title" label="标题" width="829">
</el-table-column>
<el-table-column prop="sort" label="排序" width="250">
</el-table-column>
<el-table-column prop="status" label="状态" width="150">
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<img @click="EditprojectClass(scope.row)" class="operatImg"
src="../../assets/img/userman/edit.png" alt="">
<img @click="RemoveprojectClass(scope.row)" class="operatImg"
src="../../assets/img/userman/del.png" alt="">
</template>
</el-table-column>
</el-table>
<el-pagination style="text-align:right" background @current-change="handleCurrentChange"
:page-size="msg.pageSize" layout="prev, pager, next" :total="total">
</el-pagination>
</div>
</template>
<template v-else>
<div class="head-title">
<span @click="projectClassIsShowAdd=true" style="color:rgb(64, 158, 255);cursor:pointer;">文章</span><span
style="margin:0 9px;color:#C0C4CC">/</span><span>文章编辑</span>
</div>
<div class="content">
<div class="projectClass_condiv">
<el-form :model="addMsg" :rules="rules" ref="addMsg" label-width="100px" style="padding:0 20px;">
<el-form-item label="标题" prop="title">
<el-input v-model="addMsg.title" size="small" placeholder="请输入名称" maxlength="20" />
</el-form-item>
<el-form-item label="排序">
<el-input type="text" v-model="addMsg.Sort" size="small" placeholder="请输入排序"
maxlength="4" />
</el-form-item>
<el-form-item label="状态">
<el-switch v-model="addMsg.status" active-color="#409EFF" :active-value="1" :inactive-value="0">
</el-switch>
</el-form-item>
<el-form-item label="内容">
<div style="line-height:normal;">
<UE :defaultMsg="defaultMsg" :config="config" ref="ue" @input="input"></UE>
</div>
</el-form-item>
</el-form>
</div>
</div>
<el-button size="small" style="margin-top:20px;padding:9px 25px;" type="primary" @click="submitform('addMsg')">保存
</el-button>
</template>
</div>
</template>
<script>
import UE from '@/components/global/UE.vue'
export default {
data() {
return {
//是否线下链接弹窗
loading: false,
dataList: [{
id:123,
title:'标题',
sort:1,
status:0
}],
msg: {
pageIndex: 1,
pageSize: 15,
NavIconName: "",
MallBaseId: 0,
NavIconIsShow:-1
},
total: 0,
projectClassIsShowAdd: true,
addMsg: {
title:'', //标题
Sort:'', //排序
status:0, //状态
content:'' // 内容
},
rules:{
title: [
{ required: true, message: '标题不能为空', trigger: 'change' }
],
},
defaultMsg: '',
config: {
initialFrameWidth: null,
initialFrameHeight: 350,
},
};
},
components: {
UE
},
created() {
},
methods: {
getMenu() {
//调用子组件方法
var obj = this.$refs.chooseMeun.getChooseMenu();
this.addMsg.NavIconUrl = obj.PageUrl;
this.isShowLink = false;
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
getList() {
// this.apipost("/api/Tenant/GetMiniProgrameNaviconPage", this.msg, res => {
// if (res.data.resultCode == 1) {
// this.dataList = res.data.data.pageData;
// this.total = res.data.data.count;
// } else {
// this.Info(res.data.message);
// }
// })
},
submitform(addMsg) {
//提交创建、修改表单
this.$refs[addMsg].validate(valid => {
if (valid) {
this.saveMsg();
} else {
return false;
}
});
},
//保存
saveMsg() {
},
//修改
EditprojectClass(item) {
},
//删除
RemoveprojectClass(item) {
var that = this;
that.Confirm("是否要删除?", function () {
that.apipost("/api/Tenant/RemoveMiniProgrameNavicon", {
NavIconId: item.NavIconId
}, res => {
if (res.data.resultCode == 1) {
that.getList();
} else {
that.Info(res.data.message);
}
})
})
},
input(obj) {
this.addMsg.content = obj
},
},
mounted() {
this.getList();
}
};
</script>
<style>
.projectClass .content .searchInput {
border: 1px solid #DCDFE6;
border-radius: 4px;
}
.projectClass .content .searchInput .el-input__inner {
border: none;
outline: none;
height: 30px;
line-height: 30px;
}
.projectClass .content .searchInput {
line-height: normal;
display: inline-table;
width: 100%;
border-collapse: separate;
border-spacing: 0;
width: 250px;
margin-right: 20px;
}
.projectClass .content {
background: #fff;
margin-top: 10px;
padding: 20px;
box-sizing: border-box;
}
.projectClass .operatImg{
width:32px;
height:32px;
margin:0 10px
}
.projectClass .projectClass_condiv{
padding: 20px 0;
background-color: #fff;
margin-bottom: 20px;
padding-right: 50%;
}
</style>
src/components/global/UE.vue
View file @ 35f0ea4f
......@@ -59,15 +59,14 @@
html = '<img src="' + this.domainManager().ImageUrl + e.url + '" style="max-width: 100%;">';
this.ue.execCommand('inserthtml', html);
}
this.isInputChange = false;
this.changeState = false;
},
getUEContent() { // 获取内容方法
return this.editor.getContent()
},
loadUe() {
const _this = this;
UE.registerUI('appinsertimage', (editor, uiName) => {
UE.registerUI('appinsertimage', (editor, uiName) => {
return new UE.ui.Button({
name: uiName,
title: '插入图片',
......@@ -81,12 +80,9 @@
});
this.editor = UE.getEditor(this.id, this.config); // 初始化UE
let self = this;
this.editor.addListener("ready", function () {
_this.editor.setContent(_this.defaultMsg); // 确保UE加载完成后，放入内容。
});
this.editor.addListener('ready', editor => {
if (_this.tempContent) {
_this.editor.setContent(_this.tempContent);
......@@ -100,8 +96,6 @@
this.isInputChange = false;
_this.$emit('input', _this.editor.getContent());
});
}
},
destroyed() {
......
src/components/sallCenter/plugin/image-text.vue
View file @ 35f0ea4f
......@@ -6,11 +6,11 @@
overflow-y: auto;
}
.bb {
.imgVisible {
visibility: hidden;
}
.classA {
.visibleA {
visibility: visible;
}
......@@ -32,7 +32,7 @@
<div v-else flex="main:center" style="line-height: 500px;color: rgb(173, 177, 184);">图文详情</div>
</div>
</div>
<div class="diy-component-edit bb" :class="{'classA':imageData.isCked}">
<div class="diy-component-edit imgVisible" :class="{'visibleA':imageData.isCked}">
<UE :defaultMsg="defaultMsg" :config="config" ref="ue" @input="input"></UE>
</div>
</div>
......@@ -60,6 +60,7 @@
methods: {
//向父组件传值 并调用排序
resetSord(IsUp) {
console.log(IsUp);
this.$emit('getSord', this.index, IsUp);
},
//点击触发父组件删除
......@@ -77,7 +78,6 @@
watch: {
defaultMsg: {
handler(newVal, oldVal) {
console.log(newVal);
},
deep: true
}
......
src/router/index.js
View file @ 35f0ea4f
......@@ -294,7 +294,20 @@ export default new Router({
path: '/minipage',
name: 'minipage',
component: resolve => require(['@/components/StoreDesign/minipage'], resolve),
}, //店铺管理 小程序页面标题
},
//店铺管理 内容管理 文章
{
path: '/Article',
name: 'Article',
component: resolve => require(['@/components/StoreDesign/Article'], resolve),
},
//店铺管理 内容管理 专题分类
{
path: '/ProjectClassific',
name: 'ProjectClassific',
component: resolve => require(['@/components/StoreDesign/ProjectClassific'], resolve),
},
//店铺管理 小程序页面标题
{
path: '/minititle',
name: 'minititle',
......
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