zhuce
/
lilishop-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

增加楼层专题

master
mahe 2022-09-02 09:30:57 +08:00
parent 2aceffc112
commit 4ea142ea08
8 changed files with 340 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
manager/src/views/lili-dialog/link-dialog.vue
View File

@ -1,16 +1,26 @@
<template>
<div class="wrapper">
<Tabs :value="wap[0].title" class="tabs">
<TabPane :label="item.title" :name="item.title" @click="clickTag(item, i)" v-for="(item, i) in wap" :key="i">
<component ref="lili-component" :is="templateWay[item.name]" @selected="
(val) => {
changed = val;
}
" />
<!-- <template v-for="(item, i) in wap"> -->
<TabPane
v-for="(item, i) in wap"
:label="item.title"
:name="item.title"
@click="clickTag(item, i)"
:key="i"
>
<component
ref="lili-component"
:is="templateWay[item.name]"
@selected="
(val) => {
changed = val;
}
"
/>
</TabPane>
<!-- </template> -->
</Tabs>
</div>
</template>
<script>
@ -19,7 +29,7 @@ import goodsDialog from "./goods-dialog";
import templateWay from "./template/index";
export default {
components: {
goodsDialog,
goodsDialog
},
data() {
return {
@ -27,7 +37,7 @@ export default {
changed: "", // 变更模板
selected: 0, // 已选数据
selectedLink: "", //选中的链接
wap // tab标签
wap // tab标签
};
},
watch: {
@ -35,19 +45,32 @@ export default {
handler(val) {
this.$emit("selectedLink", val[0]); //因为是单选，所以直接返回第一个
},
deep: true,
},
deep: true
}
},
mounted() {
this.$nextTick(() => {
this.$refs["lili-component"][0].type = "single"; //商品页面设置成为单选
});
this.wap.forEach((item) => {
item.selected = false;
this.wap.forEach(item => {
if (item) {
item.selected = false;
}
});
},
methods: {},
methods: {
// isVisible(item) {
// const type = this.$route.query.pagetype;
// if (type == "INDEX" && [ "discover"].includes(item.name)) {
// return false;
// }else if(type == "DISCOVER" && item.name == 'special'){
// return false;
// }else{
// return true
// }
// },
}
};
</script>
<style scoped lang="scss">

2
manager/src/views/lili-dialog/template/index.js
View File

@ -5,6 +5,7 @@ import marketing from './marketing.vue'
import pages from './pages.vue'
import goods from '../goods-dialog.vue'
import other from './other.vue'
import special from './special.vue'
export default {
pages,
marketing,
@ -12,4 +13,5 @@ export default {
category,
goods,
other,
special
}

169
manager/src/views/lili-dialog/template/special.vue Normal file
View File

@ -0,0 +1,169 @@
<template>
<div class="wrapper">
<div class="content">
<div >
<div class="tables">
<Table
border
height="350"
tooltip
:loading="loading"
:columns="columns"
:data="data"
>
</Table>
<Page
@on-change="
(val) => {
params.pageNumber = val;
}
"
:current="params.pageNumber"
:page-size="params.pageSize"
class="mt_10"
:total="Number(totals)"
size="small"
show-elevator
/>
</div>
</div>
</div>
</div>
</template>
<script>
import {
getAllPromotion,
} from "@/api/promotion";
import { getHomeList } from "@/api/other.js";
export default {
data() {
return {
loading: true, //表格请求数据为true
promotionList: "", // 活动列表
selectedIndex: 0, //左侧菜单选择
promotions: "", //选中的活动key
index: 999, // 已选下标
data:[],
params: {
sort: "createTime",
order: "desc",
pageClientType: "H5",
pageNumber: 1,
pageSize: 10,
pageType: "SPECIAL",
},
total: 0, // 表单数据总数
columns: [
{
title: "专题名称",
key: "name",
tooltip: true,
// slot: 'name'
// width: 200,
},
{
title: "操作",
key: "action",
fixed: "right",
width: 100,
render: (h, params) => {
return h("div", [
h(
"Button",
{
props: {
type: this.index == params.index ? "primary" : "",
size: "small",
},
on: {
click: () => {
this.index = params.index;
this.$emit("selected", [params.row]);
},
},
},
this.index == params.index ? "已选" : "选择"
),
]);
},
},
],
};
},
mounted() {
this.init();
},
methods: {
// 获取话题的标题
async init() {
let res = await getHomeList(this.params);
if (res.success) {
this.loading = false;
this.data= res.result.records
} else {
this.loading = false;
}
},
},
};
</script>
<style lang="scss" scoped>
img {
max-width: 100% !important;
}
.search {
width: 300px;
}
.page {
margin-top: 2vh;
text-align: right;
}
.time {
font-size: 12px;
}
.tables {
height: 400px;
margin-top: 20px;
overflow: auto;
width: 100%;
}
/deep/ .ivu-table-wrapper {
width: 100%;
}
.list {
margin: 0 1.5%;
height: 400px;
overflow: auto;
> .list-item {
padding: 10px;
transition: 0.35s;
cursor: pointer;
}
.list-item:hover {
background: #ededed;
}
}
.list {
flex: 1;
width: auto;
}
.content {
overflow: hidden;
flex: 4;
}
.active {
background: #ededed;
}
.wrapper {
overflow: hidden;
}
.search-views {
display: flex;
> * {
margin: 0 4px;
}
}
</style>

7
manager/src/views/lili-dialog/wap.js
View File

@ -29,5 +29,10 @@ export default [
title: "其他",
url: "3",
name: "other"
}
},
{
title: "专题",
url: "4",
name: "special"
},
];

22
manager/src/views/lili-floor-renovation/floorList.vue
View File

@ -82,7 +82,9 @@ export default {
pageNumber:1,
pageSize:10,
sort: 'createTime',
order: 'desc'
order: 'desc',
pageType:"INDEX",
pageClientType:"PC",
},
columns: [
// 列表展示的column
@ -106,10 +108,10 @@ export default {
type: "INDEX",
title: "首页",
},
// {
// type: "SPECIAL",
// title: "专题",
// },
{
type: "SPECIAL",
title: "专题",
}
],
list: [], // 模板列表
};
@ -125,7 +127,8 @@ export default {
const data = this.formData;
data.status ? (data.pageShow = "OPEN") : (data.pageShow = "CLOSE");
delete data.status;
(data.pageType = "INDEX"), (data.pageClientType = "PC");
// (data.pageType = "INDEX"), (data.pageClientType = "PC");
(data.pageType = this.searchForm.pageType), (data.pageClientType = "PC");
if (data.id) {
API_floor.updateHome(data.id, data).then((res) => {
this.$Message.success("编辑模板成功");
@ -144,6 +147,13 @@ export default {
}
});
},
clickType(type,index){
this.searchForm.pageNumber = 1
this.searchForm.pageType = type;
this.selectedIndex = index;
this.getTemplateList();
},
createTemp() {
// 新建表单

13
manager/src/views/lili-floor-renovation/wap/main.vue
View File

@ -1,8 +1,8 @@
<template>
<div class="box">
<!-- 顶部栏 -->
<navbar @selected="selected" />
<!-- <navbar @selected="selected" /> -->
<navbar @selected="selected" :pagetype="pagetype"/>
<component :is="layout[name]"></component>
</div>
</template>
@ -11,16 +11,21 @@ import layout from "./index";
import navbar from "./navbar";
export default {
components: {
navbar,
navbar
},
mounted() {
this.pagetype = this.$route.query.pagetype;
},
data() {
return {
layout, // 装修模块
name: "index", // 装修的页面
pagetype: "INDEX"
};
},
methods: {
selected(val) { // 顶部栏点击切换
selected(val) {
// 顶部栏点击切换
this.name = val;
}
}

62
manager/src/views/lili-floor-renovation/wap/navbar.vue
View File

@ -9,9 +9,7 @@
v-for="(item, index) in way"
:key="index"
:type="item.selected ? 'primary' : ''"
>
{{ item.title }}
</Button>
>{{ item.title }}</Button>
</div>
<div class="model-title-view-btn">
<!-- TODO 后期会补全 目前版本暂无 -->
@ -21,7 +19,7 @@
<div>临时预览</div>
<div ref="qrCodeUrl"></div>
</div>
</Poptip> -->
</Poptip>-->
<Button size="default" type="primary" @click="handleSpinShow">保存模板</Button>
<Modal
@ -33,7 +31,8 @@
>
<div v-if="progress">
<div class="model-item">
模板名称 <Input style="width: 200px" v-model="submitWay.name" />
模板名称
<Input style="width: 200px" v-model="submitWay.name"/>
</div>
<div class="model-item">
是否立即发布
@ -45,7 +44,7 @@
<Button type="primary" @click="save()">保存</Button>
</div>
<Progress v-else :percent="num" status="active" />
<Progress v-else :percent="num" status="active"/>
</Modal>
</div>
</div>
@ -54,6 +53,7 @@
import * as API_Other from "@/api/other.js";
export default {
props: ["pagetype"],
data() {
return {
progress: true, // 展示进度
@ -61,11 +61,11 @@ export default {
saveDialog: false, // 加载状态
way: [
// 装修tab栏切换
{
title: "首页",
name: "index",
selected: true,
},
// {
// title: "首页",
// name: "index",
// selected: true,
// },
// {
// title: "全屏广告",
// name: "advertising",
@ -82,11 +82,23 @@ export default {
// 表单信息
pageShow: this.$route.query.type || false,
name: this.$route.query.name || "模板名称",
pageClientType: "H5",
},
pageClientType: "H5"
}
};
},
watch: {},
watch: {
pagetype: {
handler(val) {
this.way.length = 0;
if (val == "INDEX") {
this.way.push({ title: "首页", name: "index", selected: true });
} else if (val == "SPECIAL") {
this.way.push({ title: "专题", name: "special", selected: true });
}
},
immediate: true
}
},
mounted() {},
methods: {
clickBtn(val) {
@ -116,7 +128,8 @@ export default {
: (this.submitWay.pageShow = "CLOSE");
this.submitWay.pageData = JSON.stringify(this.$store.state.styleStore);
this.submitWay.pageType = "INDEX";
// this.submitWay.pageType = "INDEX";
this.submitWay.pageType = this.pagetype;
this.$route.query.id ? this.update() : this.submit(this.submitWay);
},
@ -128,10 +141,11 @@ export default {
pageData: JSON.stringify(this.$store.state.styleStore),
name: this.submitWay.name,
pageShow: this.submitWay.pageShow,
pageType: "INDEX",
pageClientType: "H5",
// pageType: "INDEX",
pageType: this.pagetype,
pageClientType: "H5"
})
.then((res) => {
.then(res => {
this.num = 50;
if (res.success) {
this.num = 80;
@ -147,13 +161,13 @@ export default {
}
console.log(res);
})
.catch((error) => {});
.catch(error => {});
},
// 返回查询数据页面
goback() {
this.$router.push({
path: "/wapList",
path: "/wapList"
});
},
@ -161,7 +175,7 @@ export default {
submit(submitWay) {
this.progress = false;
API_Other.setHomeSetup(submitWay)
.then((res) => {
.then(res => {
this.num = 50;
if (res.success) {
this.num = 80;
@ -178,9 +192,9 @@ export default {
}
console.log(res);
})
.catch((error) => {});
},
},
.catch(error => {});
}
}
};
</script>
<style scoped lang="scss">

102
manager/src/views/lili-floor-renovation/wap/wapList.vue
View File

@ -1,7 +1,12 @@
<template>
<div class="wrapper">
<Card class="category">
<div :class="{active:i == selectedIndex}" class="category-item" v-for="(typeItem,i) in pageTypes" :key="typeItem.type">
<div
:class="{active:i == selectedIndex}"
class="category-item"
v-for="(typeItem,i) in pageTypes"
:key="typeItem.type"
>
<div @click="clickType(typeItem.type,i)">{{typeItem.title}}</div>
</div>
</Card>
@ -9,7 +14,7 @@
<Button type="primary" @click="handleAdd()">添加页面</Button>
<div class="list">
<Spin size="large" fix v-if="loading"></Spin>
<div class="item item-title" >
<div class="item item-title">
<div>页面名称</div>
<div class="item-config">
<div>状态</div>
@ -25,19 +30,25 @@
<span slot="close">关</span>
</i-switch>
<Button type="info" placement="right" @click="handleEdit(item)" size="small">修改</Button>
<Poptip confirm title="删除此模板？" @on-ok="handleDel(item)" >
<Poptip confirm title="删除此模板？" @on-ok="handleDel(item)">
<Button type="error" size="small">删除</Button>
</Poptip>
</div>
</div>
<div class="no-more" v-if="list.length ==0">暂无更多模板</div>
</div>
<Page :total="total" size="small" @on-change="(val) => {params.pageNumber = val; } " :current="params.pageNumber" :page-size="params.pageSize" show-sizer :page-size-opts="[10, 20, 50]" @on-page-size-change="changePageSize"/>
<Page
:total="total"
size="small"
@on-change="(val) => {params.pageNumber = val; } "
:current="params.pageNumber"
:page-size="params.pageSize"
show-sizer
:page-size-opts="[10, 20, 50]"
@on-page-size-change="changePageSize"
/>
</Card>
</div>
</template>
<script>
import * as API_Other from "@/api/other.js";
@ -46,66 +57,70 @@ export default {
data() {
return {
selectedIndex: 0, // 装修那个页面的下标
columns: [ // 表头
columns: [
// 表头
{
title: "页面名称",
key: "name",
key: "name"
},
{
title: "状态",
title: "状态"
},
{
title: "操作",
key: "action",
},
key: "action"
}
],
loading: false, // 加载状态
pageTypes: [ // 装修类型
pageTypes: [
// 装修类型
{
type: "INDEX",
title: "首页",
title: "首页"
},
{
type: "SPECIAL",
title: "专题",
},
title: "专题"
}
],
params: { // 请求参数
params: {
// 请求参数
pageNumber: 1,
pageSize: 10,
sort: "createTime",
order: "desc",
pageType: "INDEX",
pageClientType: "H5",
pageClientType: "H5"
},
total: 0, // 页面数量
list: [], // 总数据
list: [] // 总数据
};
},
watch: {
params: {
handler(val) {
// this.pageNumber++;
this.init();
},
deep: true,
},
// params: {
// handler(val) {
// // this.pageNumber++;
// this.init();
// },
// deep: true,
// },
},
mounted() {
this.init();
},
methods: {
// 切换tab
clickType(val,index) {
this.params.pageNumber = 1
this.selectedIndex = index
clickType(val, index) {
this.params.pageNumber = 1;
this.selectedIndex = index;
this.params.pageType = val;
this.init();
},
// 是否发布
changeSwitch(item) {
this.loading = true;
API_Other.releasePageHome(item.id).then((res) => {
API_Other.releasePageHome(item.id).then(res => {
if (res.result) {
this.loading = false;
this.$Message.success("发布成功");
@ -120,10 +135,10 @@ export default {
// 初始化数据
init() {
this.loading = true;
API_Other.getHomeList(this.params).then((res) => {
API_Other.getHomeList(this.params).then(res => {
if (!res.result) return false;
this.loading = false;
res.result.records.forEach((item) => {
res.result.records.forEach(item => {
if (item.pageShow == "OPEN") {
item.pageShow = true;
} else {
@ -139,17 +154,24 @@ export default {
handleEdit(val) {
this.$router.push({
path: "/floorList/main",
query: { id: val.id, name: val.name, type: val.pageShow },
// query: { id: val.id, name: val.name, type: val.pageShow },
query: {
id: val.id,
name: val.name,
type: val.pageShow,
pagetype: this.params.pageType
}
});
},
// 添加模板
handleAdd() {
this.$router.push({
path: "/floorList/main",
query: { pagetype: this.params.pageType }
});
},
// 分页 改变页数
changePageSize(v) {
// 分页 改变页数
changePageSize(v) {
this.params.pageNumber = 1;
this.params.pageSize = v;
this.init();
@ -157,7 +179,7 @@ export default {
// 删除模板
handleDel(val) {
this.loading = true;
API_Other.removePageHome(val.id).then((res) => {
API_Other.removePageHome(val.id).then(res => {
if (res.result) {
this.loading = false;
this.init();
@ -166,8 +188,8 @@ export default {
this.loading = false;
});
},
},
}
}
};
</script>
<style scoped lang="scss">
@ -179,7 +201,7 @@ export default {
background: #ededed;
}
.item-title {
background: #d7e7f5!important;
background: #d7e7f5 !important;
height: 54px;
}
.no-more {
@ -223,7 +245,7 @@ export default {
align-items: center;
}
}
.item:nth-of-type(2n+1) {
.item:nth-of-type(2n + 1) {
background: #f5f7fa;
}
</style>