Commit 7068bd08 authored by 黄奎's avatar 黄奎

页面修改

parent f30293dc
...@@ -14,20 +14,20 @@ ...@@ -14,20 +14,20 @@
</div> </div>
</div> </div>
<div> <div>
<div class="app-banner-list"> <div class="app-banner-list" v-for="(item,index) in dataList" :key="index">
<div class="el-card app-banner-list-item"> <div class="el-card app-banner-list-item">
<div style="padding:0"> <div style="padding:0">
<div style="position: relative;"><img class="banner_topImg" <div style="position: relative;"><img class="banner_topImg" :src="getIconLink(item.NavImg)" alt="">
src="https://cdnimg.iotweixin.com/uploads/mall1285/20200519/8d4e60ccdcc4ec7f06eb9f9a09aa116f.jpg" <a @click="EditRole(item)">修改</a>
alt="">
<el-tooltip slot="label" class="item" effect="dark" content="删除" placement="top"> <el-tooltip slot="label" class="item" effect="dark" content="删除" placement="top">
<img class="delImg" src="../../assets/img/userman/del.png" alt=""> <img class="delImg" src="../../assets/img/userman/del.png" alt="" @click="RemmoveRole(item)">
</el-tooltip> </el-tooltip>
</div> </div>
</div> </div>
<div class="banner_btmDiv"> <div class="banner_btmDiv">
<div class="app-banner-text">标题:12</div> <div class="app-banner-text">标题:{{item.NavName}}</div>
<div class="app-banner-text">路径:12</div> <div class="app-banner-text">路径:{{item.NavLink}}</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -36,29 +36,29 @@ ...@@ -36,29 +36,29 @@
</template> </template>
<!-- 选择图片文件 --> <!-- 选择图片文件 -->
<el-dialog title="轮播图编辑" :visible.sync="isShowLunbo" width="960px"> <el-dialog title="轮播图编辑" :visible.sync="isShowLunbo" width="960px">
<el-form label-width="100px" :model="addMsg" :rules="rules" ref="addMsg"> <el-form label-width="100px" :model="addMsg" :rules="rules" ref="addMsg">
<el-form-item label="标题"> <el-form-item label="标题">
<el-input type="text" v-model="addMsg.title" size="small" maxlength="100"></el-input> <el-input type="text" v-model="addMsg.NavName" size="small" maxlength="100"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="跳转链接"> <el-form-item label="跳转链接">
<el-input type="text" v-model="addMsg.link" size="small" maxlength="200"> <el-input type="text" v-model="addMsg.NavLink" size="small" maxlength="200">
<el-button slot="append" @click="isShowLink=true">选择链接</el-button> <el-button slot="append" @click="isShowLink=true">选择链接</el-button>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="图片" prop="imgUrl"> <el-form-item label="图片" prop="NavImg">
<el-tooltip class="item" effect="dark" content="建议尺寸:750 * 350" placement="top"> <el-tooltip class="item" effect="dark" content="建议尺寸:750 * 350" placement="top">
<el-button size="mini" @click="choicImg=true">选择图片</el-button> <el-button size="mini" @click="choicImg=true">选择图片</el-button>
</el-tooltip> </el-tooltip>
<div class="zk_pic_box" flex="main:center cross:center" style="width:80px;height:80px;" <div class="zk_pic_box" flex="main:center cross:center" style="width:80px;height:80px;"
:style="{backgroundImage:'url(' + getIconLink(addMsg.imgUrl) + ')'}"> :style="{backgroundImage:'url(' + getIconLink(addMsg.NavImg) + ')'}">
<i v-if="addMsg.imgUrl==''" class="el-icon-picture-outline"></i> <i v-if="addMsg.NavImg==''" class="el-icon-picture-outline"></i>
</div> </div>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="isShowLunbo = false" size="small">取消</el-button> <el-button @click="isShowLunbo = false" size="small">取消</el-button>
<el-button type="primary" @click="addShuffImg" size="small">提交</el-button> <el-button type="primary" @click="addShuffImg" size="small">提交</el-button>
</span> </span>
</el-dialog> </el-dialog>
<!-- 选择图片文件 --> <!-- 选择图片文件 -->
<el-dialog title="选择文件" :visible.sync="choicImg" width="1240px"> <el-dialog title="选择文件" :visible.sync="choicImg" width="1240px">
...@@ -72,7 +72,6 @@ ...@@ -72,7 +72,6 @@
<el-button size="small" type="danger" @click="getChoiceLink()">确 定</el-button> <el-button size="small" type="danger" @click="getChoiceLink()">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
...@@ -83,23 +82,20 @@ ...@@ -83,23 +82,20 @@
return { return {
loading: false, loading: false,
//添加图片弹窗 //添加图片弹窗
isShowLunbo:false, isShowLunbo: false,
//选择图片弹窗 //选择图片弹窗
choicImg:false, choicImg: false,
//选择链接弹窗 //选择链接弹窗
isShowLink:false, isShowLink: false,
dataList: [], dataList: [],
msg: {
pageIndex: 1,
pageSize: 15,
},
addMsg: { addMsg: {
title:'', //标题 Id: 0, //编号
link:'', //跳转链接 NavName: '', //标题
imgUrl:'' //图片链接 NavLink: '', //跳转链接
NavImg: '' //图片链接
}, },
rules: { rules: {
imgUrl: [{ NavImg: [{
required: true, required: true,
message: "图片不能为空", message: "图片不能为空",
trigger: "change" trigger: "change"
...@@ -107,37 +103,50 @@ ...@@ -107,37 +103,50 @@
}, },
}; };
}, },
created() { created() {},
},
components: { components: {
ChooseImg, ChooseImg,
chooseMeun chooseMeun
}, },
methods: { methods: {
//添加图片 //添加图片
addShuffImg(){ addShuffImg() {
this.apipost("/api/Tenant/SetMallNav", this.addMsg, res => {
if (res.data.resultCode == 1) {
this.isShowLunbo = false;
this.getList();
this.clearMsg();
this.Success(res.data.message);
} else {
this.Info(res.data.message);
}
})
},
//清空消息
clearMsg() {
this.addMsg.Id = 0;
this.addMsg.NavName = '';
this.addMsg.NavLink = '';
this.addMsg.NavImg = '';
}, },
//选择图片 //选择图片
SelectId(msg) { SelectId(msg) {
this.addMsg.imgUrl = msg.url; this.addMsg.NavImg = msg.url;
this.choicImg = false; this.choicImg = false;
}, },
//获取选择链接 //获取选择链接
getChoiceLink() { getChoiceLink() {
//调用子组件方法 //调用子组件方法
var obj = this.$refs.chooseMeun.getChooseMenu(); var obj = this.$refs.chooseMeun.getChooseMenu();
this.addMsg.link = obj.PageUrl; this.addMsg.NavLink = obj.PageUrl;
this.isShowLink = false; this.isShowLink = false;
}, },
//获取轮播图列表
getList() { getList() {
this.apipost("/api/Employee/GetRolePageList", this.msg, res => { this.apipost("/api/Tenant/GetMallNavList", {}, res => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.dataList = res.data.data.pageData; this.dataList = res.data.data
this.total = res.data.data.count; console.log("this.dataList", this.dataList)
} else { } else {
this.Info(res.data.message); this.Info(res.data.message);
} }
...@@ -155,15 +164,16 @@ ...@@ -155,15 +164,16 @@
}, },
//修改 //修改
EditRole(item) { EditRole(item) {
this.apipost("/api/Employee/GetRole", { this.apipost("/api/Tenant/GetMallNav", {
RoleId: item.RoleId Id: item.Id
}, res => { }, res => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.addMsg = res.data.data; this.isShowLunbo = true;
let newArr = this.addMsg.RoleAuth.split(','); var jsonData = res.data.data;
setTimeout(() => { this.addMsg.Id = jsonData.Id;
this.$refs.tree.setCheckedKeys(newArr); this.addMsg.NavName = jsonData.NavName;
}, 10) this.addMsg.NavLink = jsonData.NavLink;
this.addMsg.NavImg = jsonData.NavImg;
} else { } else {
this.Info(res.data.message); this.Info(res.data.message);
} }
...@@ -173,8 +183,8 @@ ...@@ -173,8 +183,8 @@
RemmoveRole(item) { RemmoveRole(item) {
var that = this; var that = this;
that.Confirm("是否要删除?", function () { that.Confirm("是否要删除?", function () {
that.apipost("/api/Employee/RemoveRole", { that.apipost("/api/Tenant/RemoveMallNav", {
RoleId: item.RoleId Id: item.Id
}, res => { }, res => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
that.getList(); that.getList();
...@@ -238,32 +248,38 @@ ...@@ -238,32 +248,38 @@
margin-right: 20px; margin-right: 20px;
cursor: pointer; cursor: pointer;
} }
.shuffing .app-banner-text { .shuffing .app-banner-text {
max-width: 240px; max-width: 240px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
margin-top:10px; margin-top: 10px;
} }
.shuffing .delImg{
display: none; .shuffing .delImg {
position: absolute; display: none;
bottom: 20px; position: absolute;
right: 20px; bottom: 20px;
padding: 0px; right: 20px;
padding: 0px;
} }
.shuffing .app-banner-list:hover .delImg{
display: block; .shuffing .app-banner-list:hover .delImg {
display: block;
} }
.shuffing .banner_btmDiv{
height: 90px; .shuffing .banner_btmDiv {
padding: 10px; height: 90px;
font-size: 12px; padding: 10px;
border-bottom: 1px solid rgba(0, 0, 0, 0.125); font-size: 12px;
border-bottom: 1px solid rgba(0, 0, 0, 0.125);
} }
.shuffing .banner_topImg{
height: 190px; .shuffing .banner_topImg {
width: 250px; height: 190px;
width: 250px;
display: block; display: block;
} }
</style> </style>
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