优化部分样式问题,新增部分功能,解决发现的bug,暂未完全测试通过。

This commit is contained in:
lemon橪
2021-06-10 18:31:54 +08:00
parent 8b3d19625f
commit c9ea7ba898
30 changed files with 1143 additions and 1131 deletions

View File

@@ -3,13 +3,7 @@
<div class="model-title">
<div>店铺装修</div>
<div class="btns">
<Button
@click="clickBtn(item)"
size="small"
v-for="(item, index) in way"
:key="index"
:type="item.selected ? 'primary' : ''"
>
<Button @click="clickBtn(item)" size="small" v-for="(item, index) in way" :key="index" :type="item.selected ? 'primary' : ''">
{{ item.title }}
</Button>
</div>
@@ -21,17 +15,9 @@
<div ref="qrCodeUrl"></div>
</div>
</Poptip>
<Button size="default" type="primary" @click="handleSpinShow"
>保存模板</Button
>
<Button size="default" type="primary" @click="handleSpinShow">保存模板</Button>
<Modal
title="保存中"
v-model="saveDialog"
:closable="true"
:mask-closable="false"
:footer-hide="true"
>
<Modal title="保存中" v-model="saveDialog" :closable="true" :mask-closable="false" :footer-hide="true">
<div v-if="progress">
<div class="model-item">
模板名称 <Input style="width: 200px" v-model="submitWay.name" />
@@ -61,7 +47,8 @@ export default {
progress: true, // 展示进度
num: 20, // 提交进度
saveDialog: false, // 加载状态
way: [ // 装修tab栏切换
way: [
// 装修tab栏切换
{
title: "首页",
name: "index",
@@ -80,7 +67,8 @@ export default {
},
],
qrcode: "", // 二维码
submitWay: { // 表单信息
submitWay: {
// 表单信息
pageShow: this.$route.query.type || false,
name: this.$route.query.name || "模板名称",
pageClientType: "H5",
@@ -124,11 +112,13 @@ export default {
// 更新
update() {
this.progress = false;
this.progress = false;
API_Other.updateHome(this.$route.query.id, {
pageData: JSON.stringify(this.$store.state.styleStore),
name: this.submitWay.name,
pageShow: this.submitWay.pageShow,
pageType: "INDEX",
pageClientType: "H5",
})
.then((res) => {
this.num = 50;
@@ -171,7 +161,7 @@ export default {
this.goback();
}, 1000);
} else {
this.progress = true;
this.progress = true;
this.saveDialog = false;
this.$Message.error("保存失败,请稍后重试");
}

View File

@@ -1,6 +1,6 @@
.image-mode {
max-width: 100%;
height: auto;
width: 100%;
height: 100%;
display: block;
padding: 1px;
}

View File

@@ -1,11 +1,11 @@
<template>
<div class="layout">
<img class="image-mode" :src="res.list[0].img" alt="">
<img class="image-mode" :src="res.list[1].img" alt="">
<img class="image-mode" :src="res.list[2].img" alt="">
<img class="image-mode" :src="res.list[3].img" alt="">
<img class="image-mode" :src="res.list[4].img" alt="">
<img class="image-mode" :src="res.list[0].img" alt="">
<img class="image-mode" :src="res.list[1].img" alt="">
<img class="image-mode" :src="res.list[2].img" alt="">
<img class="image-mode" :src="res.list[3].img" alt="">
<img class="image-mode" :src="res.list[4].img" alt="">
</div>
</template>
@@ -13,21 +13,18 @@
export default {
title: "五列单行图片模块",
props: ["res"],
mounted() {
console.log(this.res);
}
};
</script>
<style lang="scss" scoped>
@import "./tpl.scss";
.layout {
background: #e8e8e8;
display: flex;
align-items: center;
justify-content: center;
background-size: cover;
}
img{
img {
width: 67px;
}
</style>
</style>

View File

@@ -12,21 +12,22 @@
export default {
title: "四列单行图片模块",
props: ["res"],
mounted() {
console.log(this.res);
}
};
</script>
<style lang="scss" scoped>
@import "./tpl.scss";
.layout {
height: 84px;
// background: #e8e8e8;
// height: 84px;
display: flex;
padding: 0 8px;
align-items: center;
justify-content: center;
background-size: cover;
}
img{
width: 84px;
}
</style>
</style>

View File

@@ -11,14 +11,12 @@
export default {
title: "三列单行图片模块",
props: ["res"],
mounted() {
console.log(this.res);
}
};
</script>
<style lang="scss" scoped>
@import "./tpl.scss";
.layout {
background: #e8e8e8;
height: 110px;
display: flex;
align-items: center;
@@ -28,4 +26,4 @@ export default {
img{
width: 111px;
}
</style>
</style>

View File

@@ -20,7 +20,7 @@ export default {
title: "左一右二",
props: ["res"],
mounted() {
console.log(this.res);
}
};
</script>
@@ -34,4 +34,4 @@ export default {
background-size: cover;
}
</style>
</style>

View File

@@ -10,7 +10,7 @@
</div>
</div>
<div class="view-height-150">
<img class="image-mode" :src="res.list[2].img" />
<img class="image-mode" style="height:150px;" :src="res.list[2].img" />
</div>
</div>
</template>
@@ -21,18 +21,22 @@ export default {
props: ["res"],
mounted() {
console.log(this.res);
}
},
};
</script>
<style lang="scss" scoped>
@import "./tpl.scss";
.layout {
height: 167px;
height: 150px;
display: flex;
align-items: center;
justify-content: center;
background-size: cover;
}
</style>
.view-height-75 {
.image-mode {
height: 75px;
}
}
</style>