Compare commits
No commits in common. "7298bd33474a2cbaa2617acc444314f489611381" and "d7e760c920bb6252f993908a9f228d80ddc3ca42" have entirely different histories.
7298bd3347
...
d7e760c920
@ -112,7 +112,7 @@ defineProps<{ property: MenuGridProperty }>()
|
|||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 5px 0;
|
padding: 5px 0;
|
||||||
// margin-top: 10px;
|
margin-top: 10px;
|
||||||
padding-bottom: 10px;
|
padding-bottom: 10px;
|
||||||
padding-top: 10px;
|
padding-top: 10px;
|
||||||
&>.t {
|
&>.t {
|
||||||
|
|||||||
@ -1,109 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="main">
|
|
||||||
<div class="mainTop">
|
|
||||||
<div>商品分类</div>
|
|
||||||
<div class="right">
|
|
||||||
<div class="save" @click="save">保存</div>
|
|
||||||
<div class="cz" @click="cz">重置</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mainBottom">
|
|
||||||
<div class='item' :class="currItem== 1 ? 'on': ''" @click="clickItem(1)">
|
|
||||||
<img class="img" src="https://zysc.fjptzykj.com:3000/shangcheng/a7d0409cbf5335a2780409756914c530fc7c88bec85fc81302b53760d9be4a03.jpg" />
|
|
||||||
<div class="text">样式1</div>
|
|
||||||
</div>
|
|
||||||
<div class='item' :class="currItem== 2 ? 'on': ''" @click="clickItem(2)">
|
|
||||||
<img class="img" src="https://zysc.fjptzykj.com:3000/shangcheng/9096b2c04a6e46ea562999a93a1b975100c6b4557e680dcb31de6d3555407841.png" />
|
|
||||||
<div class="text">样式2</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<script setup lang="ts">
|
|
||||||
// TODO @疯狂：要不要建个 decorate 目录，然后挪进去，改成 index.vue，这样可以更明确看到是个独立界面哈，更好找
|
|
||||||
import * as DiyTemplateApi from '@/api/mall/promotion/diy/template'
|
|
||||||
import * as DiyPageApi from '@/api/mall/promotion/diy/page'
|
|
||||||
import { useTagsdivStore } from '@/store/modules/tagsdiv'
|
|
||||||
import { DiyComponentLibrary, PAGE_LIBS } from '@/components/DiyEditor/util' // 商城的 DIY 组件，在 DiyEditor 目录下
|
|
||||||
import { toNumber } from 'lodash-es'
|
|
||||||
|
|
||||||
const currItem = ref(1);
|
|
||||||
|
|
||||||
function clickItem (val){
|
|
||||||
currItem.value = val;
|
|
||||||
}
|
|
||||||
|
|
||||||
function cz (val){
|
|
||||||
currItem.value = 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
function save (){
|
|
||||||
// currItem.value = val;
|
|
||||||
console.log("请求接口还没有写啊！！！！快让后端提供啊")
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.main{
|
|
||||||
display:flex;
|
|
||||||
flex-wrap:wrap;
|
|
||||||
.mainTop{
|
|
||||||
width:100%;
|
|
||||||
margin:10px 10px;
|
|
||||||
background:white;
|
|
||||||
padding:10px 20px;
|
|
||||||
font-weight:700;
|
|
||||||
display:flex;
|
|
||||||
justify-content:space-between;
|
|
||||||
align-items: center;
|
|
||||||
.right{
|
|
||||||
display:flex;
|
|
||||||
div{
|
|
||||||
padding:5px 15px;
|
|
||||||
font-weight:400;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
.save{
|
|
||||||
background:#0256FF;
|
|
||||||
margin-right:10px;
|
|
||||||
color:white;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.cz{
|
|
||||||
border:1px solid #cccccc;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.mainBottom{
|
|
||||||
width:100%;
|
|
||||||
margin:10px 10px;
|
|
||||||
background:white;
|
|
||||||
padding:30px 30px;
|
|
||||||
display:flex;
|
|
||||||
.item{
|
|
||||||
margin-right:20px;
|
|
||||||
text-align: center;
|
|
||||||
border-radius: 12px;
|
|
||||||
cursor: pointer;
|
|
||||||
&.on{
|
|
||||||
.text{
|
|
||||||
color:#0256ff;
|
|
||||||
}
|
|
||||||
.img{
|
|
||||||
border:2px solid #0256ff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.img{
|
|
||||||
width:260px;
|
|
||||||
border-radius: 12px;
|
|
||||||
border:2px solid white;
|
|
||||||
}
|
|
||||||
.text{
|
|
||||||
margin-top:10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,162 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="main">
|
|
||||||
<div class="mainTop">
|
|
||||||
<div>主题风格</div>
|
|
||||||
<div class="right">
|
|
||||||
<div class="save" @click="save">保存</div>
|
|
||||||
<!-- <div class="cz" @click="cz">重置</div> -->
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ztfg">
|
|
||||||
<div class='top'>
|
|
||||||
<div class="item" :class="currItem== 1 ? 'on': ''" @click="clickItem(1)">
|
|
||||||
<div class="le"></div>
|
|
||||||
<div class="ri">天空蓝</div>
|
|
||||||
</div>
|
|
||||||
<div class="item" :class="currItem== 2 ? 'on': ''" @click="clickItem(2)">
|
|
||||||
<div class="le" style="background:rgb(66, 202, 77);"></div>
|
|
||||||
<div class="ri">生鲜绿</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="mainBottom">
|
|
||||||
<div class='item' v-show="currItem== 1">
|
|
||||||
<img class="img"
|
|
||||||
src="https://zysc.fjptzykj.com:3000/shangcheng/4bffe9f0cee9605262a579ee45156c9e37a16e2a24035a0e49b8a4433075f793.jpg" />
|
|
||||||
</div>
|
|
||||||
<div class='item' v-show="currItem== 2">
|
|
||||||
<img class="img"
|
|
||||||
src="https://zysc.fjptzykj.com:3000/shangcheng/0d0a7ab210afb5cee674e402ca3ec197a30523687acbec2e8e5f16fb52075e9b.jpg" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<script setup lang="ts">
|
|
||||||
// TODO @疯狂：要不要建个 decorate 目录，然后挪进去，改成 index.vue，这样可以更明确看到是个独立界面哈，更好找
|
|
||||||
import * as DiyTemplateApi from '@/api/mall/promotion/diy/template'
|
|
||||||
import * as DiyPageApi from '@/api/mall/promotion/diy/page'
|
|
||||||
import { useTagsdivStore } from '@/store/modules/tagsdiv'
|
|
||||||
import { DiyComponentLibrary, PAGE_LIBS } from '@/components/DiyEditor/util' // 商城的 DIY 组件，在 DiyEditor 目录下
|
|
||||||
import { toNumber } from 'lodash-es'
|
|
||||||
|
|
||||||
const currItem = ref(1);
|
|
||||||
|
|
||||||
function clickItem(val) {
|
|
||||||
currItem.value = val;
|
|
||||||
}
|
|
||||||
|
|
||||||
function cz(val) {
|
|
||||||
currItem.value = 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
function save() {
|
|
||||||
// currItem.value = val;
|
|
||||||
console.log("请求接口还没有写啊！！！！快让后端提供啊")
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.main {
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
.mainTop {
|
|
||||||
width: 100%;
|
|
||||||
margin: 10px 10px;
|
|
||||||
background: white;
|
|
||||||
padding: 10px 20px;
|
|
||||||
font-weight: 700;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.right {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
div {
|
|
||||||
padding: 5px 15px;
|
|
||||||
font-weight: 400;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.save {
|
|
||||||
background: #0256FF;
|
|
||||||
margin-right: 10px;
|
|
||||||
color: white;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cz {
|
|
||||||
border: 1px solid #cccccc;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ztfg {
|
|
||||||
width: 100%;
|
|
||||||
margin: 10px 10px;
|
|
||||||
background: white;
|
|
||||||
padding: 30px 30px;
|
|
||||||
.top{
|
|
||||||
display: flex;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
.item{
|
|
||||||
padding:10px 15px;
|
|
||||||
border:1px solid #cccccc;
|
|
||||||
border-radius:6px;
|
|
||||||
margin-right:10px;
|
|
||||||
display:flex;
|
|
||||||
align-items:center;
|
|
||||||
cursor: pointer;
|
|
||||||
&.on{
|
|
||||||
border:1px solid #0256ff;
|
|
||||||
}
|
|
||||||
.le{
|
|
||||||
margin-right:10px;
|
|
||||||
border-radius:6px;
|
|
||||||
width:25px;
|
|
||||||
height:25px;
|
|
||||||
background:rgb(28, 165, 233);
|
|
||||||
}
|
|
||||||
.ti{
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.mainBottom {
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.item {
|
|
||||||
margin-right: 20px;
|
|
||||||
text-align: center;
|
|
||||||
border-radius: 12px;
|
|
||||||
|
|
||||||
// &.on {
|
|
||||||
// .text {
|
|
||||||
// color: #0256ff;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// .img {
|
|
||||||
// border: 2px solid #0256ff;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
.img {
|
|
||||||
width: 800px;
|
|
||||||
border-radius: 12px;
|
|
||||||
border: 2px solid white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.text {
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
Loading…
x
Reference in New Issue
Block a user