Merge branch 'master' of http://182.92.169.222:3000/yu/CostumingPlatform
commit
b9abc51a58
6 changed files with 613 additions and 4 deletions
@ -0,0 +1,581 @@ |
|||||||
|
<template> |
||||||
|
<!-- 服装详情页--> |
||||||
|
<div class="clothDetails"> |
||||||
|
<Header fontColor="#000"></Header> |
||||||
|
<div class="jz menu d-flex"> |
||||||
|
<el-breadcrumb separator="/"> |
||||||
|
<el-breadcrumb-item :to="{ path: '/shopping/clothType' }">服装类型</el-breadcrumb-item> |
||||||
|
<el-breadcrumb-item :to="{ path: '/shopping/clothType' }">{{ |
||||||
|
this.$route.query.parentName |
||||||
|
}}</el-breadcrumb-item> |
||||||
|
<el-breadcrumb-item :to="{ path: '/shopping/clothType' }">{{ |
||||||
|
this.$route.query.name |
||||||
|
}}</el-breadcrumb-item> |
||||||
|
<el-breadcrumb-item>{{ |
||||||
|
this.$route.query.title |
||||||
|
}}</el-breadcrumb-item> |
||||||
|
</el-breadcrumb> |
||||||
|
<div class="collect d-flex"> |
||||||
|
<span v-if="!collectFlag" class="iconfont icon-weishoucang" @click="collectChange"></span> |
||||||
|
<span v-if="collectFlag" class="iconfont icon-yishoucang" @click="collectChange"></span> |
||||||
|
<span>点击收藏（{{popularity}}人气）</span> |
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
<div class="detailDiv jz d-flex"> |
||||||
|
<div class="l"> |
||||||
|
<a-carousel arrows dots-class="slick-dots slick-thumb" > |
||||||
|
<template slot="customPaging" slot-scope="props" > |
||||||
|
<a v-for="(item,index) in baseUrl" :key="index"> |
||||||
|
<!-- <img v-for="(item,index) in baseUrl" :key="index" :src="item" />--> |
||||||
|
<img :src="item" /> |
||||||
|
</a> |
||||||
|
</template> |
||||||
|
<div v-for="(item,index) in baseUrl" :key="index"> |
||||||
|
<img :src="item" /> |
||||||
|
</div> |
||||||
|
</a-carousel> |
||||||
|
</div> |
||||||
|
<div class="r"> |
||||||
|
<div class="title f_20">{{title}}</div> |
||||||
|
<p class="sales f_12">销量：{{sales}}件</p> |
||||||
|
<p class="price f_14 c_333">价格：<span class="f_20">¥{{price}}</span></p> |
||||||
|
<p class="favour f_14 c_333">优惠：<span class="f_12">{{favour}}</span></p> |
||||||
|
<p class="sell f_14 c_333 d-flex"> |
||||||
|
<span id="title">促销：</span> |
||||||
|
<span class="f_14 textfield" id="sell"> |
||||||
|
{{sell}} |
||||||
|
<span class="button" id="btn02" @click="xiangQing(false)">收起>>></span> |
||||||
|
</span> |
||||||
|
<span class="button" id="btn01" @click="xiangQing(true)">详情>>></span> |
||||||
|
</p> |
||||||
|
<div class="line"></div> |
||||||
|
<div class="color f_14">颜色:{{color}} </div> |
||||||
|
<a-radio-group v-model="radioValue" @change="onChange"> |
||||||
|
<a-radio :value="'白色'"> |
||||||
|
白色 |
||||||
|
</a-radio> |
||||||
|
<a-radio :value="'黑色'"> |
||||||
|
黑色 |
||||||
|
</a-radio> |
||||||
|
<a-radio :value="'灰色'"> |
||||||
|
灰色 |
||||||
|
</a-radio> |
||||||
|
</a-radio-group> |
||||||
|
<div class="size f_14">尺码:<a @click="dialogVisible1 = true">尺码参照表</a> | <i class="iconfont icon-ic_jia"></i> <span class="c_333 f_14">找到您的尺寸</span></div> |
||||||
|
<el-dialog |
||||||
|
title="尺码参照表" |
||||||
|
:visible.sync="dialogVisible1" |
||||||
|
width="30%"> |
||||||
|
<span>这里放尺码参照表</span> |
||||||
|
<span slot="footer" class="dialog-footer"> |
||||||
|
<el-button type="primary" @click="dialogVisible1 = false">关 闭</el-button> |
||||||
|
</span> |
||||||
|
</el-dialog> |
||||||
|
<div class="sizeDiv"> |
||||||
|
<!-- <div class="sizeDiv d-flex" id="sizeDiv">--> |
||||||
|
<!-- <span class="item f_16" v-for="(item,index) in sizeList" :key="index" @click="chooseSize(item,index)">{{item.size}}</span>--> |
||||||
|
<el-radio-group v-model="size" size="small" @change="sizeChange"> |
||||||
|
<el-radio-button v-for="(item,index) in sizeList" :key="index" :label="item.size" :disabled="!item.flag" ></el-radio-button> |
||||||
|
</el-radio-group> |
||||||
|
</div> |
||||||
|
<div class="line"></div> |
||||||
|
<div class="serve f_16 c_1B">免费配送与退货服务<span class="button" @click="dialogVisible2 = true">更多详情</span></div> |
||||||
|
<el-dialog |
||||||
|
title="免费配送与退货服务" |
||||||
|
:visible.sync="dialogVisible2" |
||||||
|
width="30%"> |
||||||
|
<span>text</span> |
||||||
|
<span slot="footer" class="dialog-footer"> |
||||||
|
<el-button type="primary" @click="dialogVisible2 = false">关 闭</el-button> |
||||||
|
</span> |
||||||
|
</el-dialog> |
||||||
|
<div class="line"></div> |
||||||
|
<div class="stages f_16 c_1B">使用花呗分期，最低每月¥1182.50。<span class="button c_1B" @click="dialogVisible3 = true">详细说明</span></div> |
||||||
|
<el-dialog |
||||||
|
title="花呗分期详细说明" |
||||||
|
:visible.sync="dialogVisible3" |
||||||
|
width="30%"> |
||||||
|
<span>text</span> |
||||||
|
<span slot="footer" class="dialog-footer"> |
||||||
|
<el-button type="primary" @click="dialogVisible3 = false">关 闭</el-button> |
||||||
|
</span> |
||||||
|
</el-dialog> |
||||||
|
<div class="d-flex btnDiv"> |
||||||
|
<div class="dialogButton default f_14">加入购物袋</div> |
||||||
|
<div type="primary" class="dialogButton primary f_14" @click="buyNow">立即购买</div></div> |
||||||
|
|
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
<div class="selected jz"> |
||||||
|
<div class="title f_16 c_333">已选</div> |
||||||
|
<div class="selectedCloth d-flex"> |
||||||
|
<div class="item" v-for="(item,index) in selectedClothList" :key="index"> |
||||||
|
<img :src="item.url"> |
||||||
|
<p class="c_333">{{item.text}}</p> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="detail jz"> |
||||||
|
<div class="title d-flex"> |
||||||
|
<span class="c_fff">商品介绍</span> |
||||||
|
<span class="c_fff">加入购物车</span> |
||||||
|
</div> |
||||||
|
<table> |
||||||
|
<tr> |
||||||
|
<td class="textfield">商品名称：{{clothDetail.name}}</td> |
||||||
|
<td>商品编号：{{clothDetail.num}}</td> |
||||||
|
<td>规格：{{clothDetail.style}}</td> |
||||||
|
<td>产品概述：{{clothDetail.weight}}</td> |
||||||
|
</tr> |
||||||
|
<tr> |
||||||
|
<td>结构：{{clothDetail.itemNo}}</td> |
||||||
|
<td>特征：{{clothDetail.collar}}</td> |
||||||
|
<td>折叠搭配及包装：{{clothDetail.material}}</td> |
||||||
|
<td>适用场景：{{clothDetail.scene}}</td> |
||||||
|
</tr> |
||||||
|
<tr> |
||||||
|
<td>配件及标志：{{clothDetail.type}}</td> |
||||||
|
<td>缝纫形式：{{clothDetail.placket}}</td> |
||||||
|
<td>产地：{{clothDetail.slit}}</td> |
||||||
|
<td>适用人群：{{clothDetail.people}}</td> |
||||||
|
</tr> |
||||||
|
</table> |
||||||
|
</div> |
||||||
|
<Footer></Footer> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import Header from "../components/Header/HeaderView"; |
||||||
|
import Footer from "../components/Footer/FooterView" |
||||||
|
import { httpAction, getAction } from '@/api/manage' |
||||||
|
export default { |
||||||
|
name: "clothDetail", |
||||||
|
components: { Header,Footer }, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
url: { |
||||||
|
lxlistxq: "/zygoods/zyGoods/lxlistxq", |
||||||
|
}, |
||||||
|
dialogVisible1: false,//控制 尺码参照表 弹窗开关 |
||||||
|
dialogVisible2: false,//控制 更多详情 弹窗开关 |
||||||
|
dialogVisible3: false,//控制 详细说明 弹窗开关 |
||||||
|
collectFlag:false,//是否收藏 |
||||||
|
popularity:172,//人气 |
||||||
|
title:'【西服定制】定制西装男套装结婚西装婚礼伴郎订婚正装新郎西服套装夏季 款式仅供参考 一人一版量身定制',//标题 |
||||||
|
sales:2342,//销量 |
||||||
|
price:13200.00,//价格 |
||||||
|
favour:'满1100减300',//优惠 |
||||||
|
sell:'每满300元，可减40元现金，最多可减40000元 | 距结束还剩每满300元，可减40元现金，最多可减40000元 | 距结束还剩 ',//促销 |
||||||
|
color:'白色',//颜色 |
||||||
|
radioValue: '白色',//选中的颜色 |
||||||
|
sizeList:[ |
||||||
|
{ |
||||||
|
id:1, |
||||||
|
size:"XXS", |
||||||
|
flag:false//没有该尺码库存 |
||||||
|
}, |
||||||
|
{ |
||||||
|
id:2, |
||||||
|
size:"XS", |
||||||
|
flag:true//有该尺码库存 |
||||||
|
}, |
||||||
|
{ |
||||||
|
id:3, |
||||||
|
size:"S", |
||||||
|
flag:true |
||||||
|
}, |
||||||
|
{ |
||||||
|
id:4, |
||||||
|
size:"M", |
||||||
|
flag:true |
||||||
|
}, |
||||||
|
{ |
||||||
|
id:5, |
||||||
|
size:"L", |
||||||
|
flag:false |
||||||
|
}, |
||||||
|
{ |
||||||
|
id:6, |
||||||
|
size:"XL", |
||||||
|
flag:true |
||||||
|
}, |
||||||
|
{ |
||||||
|
id:7, |
||||||
|
size:"XXL", |
||||||
|
flag:true |
||||||
|
}, |
||||||
|
],//尺码列表 |
||||||
|
size:'',//选中的尺码 |
||||||
|
selectedClothList:[ |
||||||
|
{ |
||||||
|
id:1, |
||||||
|
text:'明门襟', |
||||||
|
url:require("../assets/selected04.png") |
||||||
|
}, |
||||||
|
{ |
||||||
|
id:2, |
||||||
|
text:'大八字领', |
||||||
|
url:require("../assets/selected02.png") |
||||||
|
}, |
||||||
|
{ |
||||||
|
id:3, |
||||||
|
text:'无口袋', |
||||||
|
url:require("../assets/selected05.png") |
||||||
|
}, |
||||||
|
{ |
||||||
|
id:4, |
||||||
|
text:'边褶不收省', |
||||||
|
url:require("../assets/selected03.png") |
||||||
|
}, |
||||||
|
{ |
||||||
|
id:5, |
||||||
|
text:'礼服圆角', |
||||||
|
url:require("../assets/selected01.png") |
||||||
|
}, |
||||||
|
],//已选的图片信息 |
||||||
|
clothDetail:{ |
||||||
|
name:'【西服定制】定制西装男套装结婚西装婚礼伴郎订婚正装新郎西服套装夏季 款式仅供参考 一人一版量身定制', |
||||||
|
num:10053909681884, |
||||||
|
style:'通勤风', |
||||||
|
weight:'1.0Kg', |
||||||
|
itemNo:'3680婚庆西服', |
||||||
|
collar:'青果领', |
||||||
|
material:'羊毛100%', |
||||||
|
scene:'婚礼，宴会', |
||||||
|
type:'标准型', |
||||||
|
placket:'单排扣', |
||||||
|
slit:'后中开衩', |
||||||
|
people:'青年' |
||||||
|
},//商品信息 |
||||||
|
baseUrl:[require("../assets/details01.png"),require("../assets/details02.png"),require("../assets/details03.png"),require("../assets/details04.png"),] |
||||||
|
}; |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
collectChange(){ |
||||||
|
if(!this.collectFlag){ |
||||||
|
this.collectFlag = true |
||||||
|
this.popularity+=1 |
||||||
|
}else{ |
||||||
|
this.collectFlag = false |
||||||
|
this.popularity-=1 |
||||||
|
} |
||||||
|
}, |
||||||
|
onChange(e) { |
||||||
|
console.log('radio checked', e.target.value); |
||||||
|
this.color = e.target.value; |
||||||
|
}, |
||||||
|
sizeChange(value){ |
||||||
|
this.size = value |
||||||
|
}, |
||||||
|
xiangQing(flag){ |
||||||
|
let sell = document.getElementById('sell') |
||||||
|
let btn01 = document.getElementById('btn01') |
||||||
|
let btn02 = document.getElementById('btn02') |
||||||
|
if(flag){ |
||||||
|
sell.classList.remove('textfield') |
||||||
|
btn01.style.display = 'none' |
||||||
|
sell.style.width = '600px' |
||||||
|
btn02.style.display = 'inline-block' |
||||||
|
}else{ |
||||||
|
sell.classList.add('textfield') |
||||||
|
sell.style.width = '300px' |
||||||
|
|
||||||
|
btn01.style.display = 'inline-block' |
||||||
|
btn02.style.display = 'none' |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
}, |
||||||
|
buyNow(){ |
||||||
|
this.$router.push({ |
||||||
|
path: "/shopping/placeOrder", |
||||||
|
query: { |
||||||
|
// id: item.id,//传参 |
||||||
|
}, |
||||||
|
}); |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
getAction(this.url.lxlistxq,{id:this.$route.query.id}).then((res1) => { |
||||||
|
if (res1.success) { |
||||||
|
//console.log(res1.result) |
||||||
|
this.selectedClothList = res1.result.selectedClothList; |
||||||
|
this.baseUrl = res1.result.baseUrl; |
||||||
|
this.title = res1.result.zyGoods.goodsName; |
||||||
|
this.popularity = res1.result.zyGoods.click; |
||||||
|
this.sales = res1.result.zyGoods.num; |
||||||
|
this.price = res1.result.zyGoods.unitPrice; |
||||||
|
this.clothDetail.name = res1.result.zyGoods.goodsName; |
||||||
|
this.clothDetail.num = res1.result.zyGoods.goodsCode; |
||||||
|
this.clothDetail.style = res1.result.zyGoods.specification; |
||||||
|
this.clothDetail.weight = res1.result.zyGoods.productOverview; |
||||||
|
this.clothDetail.itemNo = res1.result.zyGoods.structure; |
||||||
|
this.clothDetail.collar = res1.result.zyGoods.characteristic; |
||||||
|
this.clothDetail.material = res1.result.zyGoods.foldingPackaging; |
||||||
|
//this.clothDetail.scene = res1.result.zyGoods.goodsName; |
||||||
|
this.clothDetail.type = res1.result.zyGoods.accLogos; |
||||||
|
this.clothDetail.placket = res1.result.zyGoods.sewingForm; |
||||||
|
this.clothDetail.slit = res1.result.zyGoods.placeOrigin; |
||||||
|
//this.clothDetail.people = res1.result.zyGoods.goodsName; |
||||||
|
}else{ |
||||||
|
this.$message.error(res1.message); |
||||||
|
} |
||||||
|
}); |
||||||
|
// let sell = document.getElementById('sell') |
||||||
|
// let title = document.getElementById('title') |
||||||
|
// console.log('sell') |
||||||
|
// console.log(sell) |
||||||
|
// console.log(sell.getBoundingClientRect()) |
||||||
|
// console.log(title.getBoundingClientRect()) |
||||||
|
// console.log(sell.style.width) |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
<style> |
||||||
|
.clothDetails .cytj { |
||||||
|
border-bottom: 2px solid #000; |
||||||
|
} |
||||||
|
|
||||||
|
</style> |
||||||
|
<style lang="less" scoped> |
||||||
|
/*&:hover .iconfont{*/ |
||||||
|
/* color: red;*/ |
||||||
|
/*}*/ |
||||||
|
@import '../assets/common.css'; |
||||||
|
.textfield {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;} |
||||||
|
#btn02{ |
||||||
|
display: none; |
||||||
|
} |
||||||
|
.clothDetails { |
||||||
|
.menu{ |
||||||
|
justify-content: space-between; |
||||||
|
padding-top: 100px; |
||||||
|
.collect{ |
||||||
|
box-sizing: border-box; |
||||||
|
align-items: center; |
||||||
|
font-size: 14px; |
||||||
|
.icon-yishoucang{ |
||||||
|
color: red; |
||||||
|
} |
||||||
|
.iconfont{ |
||||||
|
width: 16px; |
||||||
|
height: 16px; |
||||||
|
line-height: 16px; |
||||||
|
text-align: center; |
||||||
|
padding: 1px; |
||||||
|
box-sizing: border-box; |
||||||
|
/*&:hover{*/ |
||||||
|
/* border: 1px dashed #C4C4C4;*/ |
||||||
|
|
||||||
|
/*}*/ |
||||||
|
} |
||||||
|
span{ |
||||||
|
margin-right: 5px; |
||||||
|
vertical-align: top; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
.detailDiv { |
||||||
|
justify-content: space-between; |
||||||
|
min-width: 1200px; |
||||||
|
.l{ |
||||||
|
width: 610px; |
||||||
|
.cloth{ |
||||||
|
width: 610px; |
||||||
|
height: 641px; |
||||||
|
} |
||||||
|
} |
||||||
|
.r{ |
||||||
|
padding: 20px; |
||||||
|
.title{ |
||||||
|
color: #1B1B1B; |
||||||
|
font-weight: 500; |
||||||
|
margin-bottom: 16px; |
||||||
|
} |
||||||
|
.sales{ |
||||||
|
font-weight: 400; |
||||||
|
color: rgba(51,51,51,0.5); |
||||||
|
} |
||||||
|
.favour{ |
||||||
|
color: #746957; |
||||||
|
span{ |
||||||
|
border: 1px solid #746957; |
||||||
|
padding: 2px 5px; |
||||||
|
} |
||||||
|
} |
||||||
|
.sell{ |
||||||
|
align-items: start; |
||||||
|
.f_14{ |
||||||
|
display: inline-block; |
||||||
|
width: 300px; |
||||||
|
} |
||||||
|
.button{ |
||||||
|
/*display: none;*/ |
||||||
|
} |
||||||
|
} |
||||||
|
.line{ |
||||||
|
height: 0px; |
||||||
|
border-bottom: 1px solid #ccc; |
||||||
|
margin: 20px 0 20px 0; |
||||||
|
} |
||||||
|
.color{ |
||||||
|
font-weight: 600; |
||||||
|
color: #1B1B1B; |
||||||
|
margin-bottom: 15px; |
||||||
|
} |
||||||
|
& /deep/ .ant-radio-wrapper{ |
||||||
|
margin-right: 25px; |
||||||
|
} |
||||||
|
.size{ |
||||||
|
margin-top: 20px; |
||||||
|
a{ |
||||||
|
margin-left: 20px; |
||||||
|
text-decoration: underline; |
||||||
|
color: #333333; |
||||||
|
margin-right: 20px; |
||||||
|
} |
||||||
|
i{ |
||||||
|
margin-left: 20px; |
||||||
|
margin-right: 6px; |
||||||
|
color: #1B1B1B; |
||||||
|
} |
||||||
|
} |
||||||
|
.sizeDiv{ |
||||||
|
margin-top: 20px; |
||||||
|
margin-bottom: 20px; |
||||||
|
} |
||||||
|
.serve{ |
||||||
|
font-weight: 600; |
||||||
|
.button{ |
||||||
|
margin-left: 10px; |
||||||
|
text-decoration: underline; |
||||||
|
} |
||||||
|
} |
||||||
|
.stages{ |
||||||
|
color: #B79674; |
||||||
|
margin-bottom: 30px; |
||||||
|
.button{ |
||||||
|
text-decoration: underline; |
||||||
|
} |
||||||
|
} |
||||||
|
.btnDiv{ |
||||||
|
justify-content: space-around; |
||||||
|
.dialogButton { |
||||||
|
width: 35%; |
||||||
|
min-width: 300px; |
||||||
|
height: 44px; |
||||||
|
text-align: center; |
||||||
|
line-height: 44px; |
||||||
|
transition: all 0.2s; |
||||||
|
} |
||||||
|
.default { |
||||||
|
border: 1px solid #1b1b1b; |
||||||
|
color: #1b1b1b; |
||||||
|
margin-right: 20px; |
||||||
|
|
||||||
|
&:hover { |
||||||
|
border-color: #fff; |
||||||
|
color: #fff; |
||||||
|
background-color: #1b1b1b; |
||||||
|
} |
||||||
|
} |
||||||
|
.primary { |
||||||
|
background: #1b1b1b; |
||||||
|
border: 2px solid #1b1b1b; |
||||||
|
color: #e5dfd9; |
||||||
|
&:hover { |
||||||
|
// border-color: #1b1b1b; |
||||||
|
// color: #1b1b1b; |
||||||
|
// background-color: #fff; |
||||||
|
opacity: 0.8; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
.selected{ |
||||||
|
.title{ |
||||||
|
border-left: 5px solid #746957; |
||||||
|
height: 40px; |
||||||
|
line-height: 40px; |
||||||
|
padding-left: 25px; |
||||||
|
margin-bottom: 50px; |
||||||
|
} |
||||||
|
.selectedCloth{ |
||||||
|
flex-wrap: wrap; |
||||||
|
.item{ |
||||||
|
margin-right: 55px; |
||||||
|
width: 180px; |
||||||
|
height: 250px; |
||||||
|
img{ |
||||||
|
width: 180px; |
||||||
|
height: 180px; |
||||||
|
margin-bottom: 20px; |
||||||
|
} |
||||||
|
p{ |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.detail{ |
||||||
|
margin-bottom: 20px; |
||||||
|
.title{ |
||||||
|
justify-content: space-between; |
||||||
|
background-color: #F7F7F7; |
||||||
|
border: 1px solid #EEEEEE; |
||||||
|
margin-bottom: 25px; |
||||||
|
span{ |
||||||
|
width: 146px; |
||||||
|
height: 38px; |
||||||
|
line-height: 38px; |
||||||
|
background-color: #746957; |
||||||
|
text-align: center; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
} |
||||||
|
table{ |
||||||
|
width: 100%; |
||||||
|
td{ |
||||||
|
max-width: 500px; |
||||||
|
min-width: 300px; |
||||||
|
margin-right: 20px; |
||||||
|
padding-right: 50px; |
||||||
|
padding-bottom: 10px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
|
<style scoped> |
||||||
|
/* For demo */ |
||||||
|
.ant-carousel >>> .slick-dots { |
||||||
|
height: auto; |
||||||
|
} |
||||||
|
.ant-carousel >>> .slick-slide img { |
||||||
|
border: 5px solid #fff; |
||||||
|
display: block; |
||||||
|
margin: auto; |
||||||
|
max-width: 80%; |
||||||
|
} |
||||||
|
.ant-carousel >>> .slick-thumb { |
||||||
|
bottom: -45px; |
||||||
|
} |
||||||
|
.ant-carousel >>> .slick-thumb li { |
||||||
|
width: 60px; |
||||||
|
height: 45px; |
||||||
|
} |
||||||
|
.ant-carousel >>> .slick-thumb li img { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
filter: grayscale(100%); |
||||||
|
} |
||||||
|
.ant-carousel >>> .slick-thumb li.slick-active img { |
||||||
|
filter: grayscale(0%); |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,13 @@ |
|||||||
|
package org.jeecg.modules.system.vo; |
||||||
|
|
||||||
|
import lombok.Data; |
||||||
|
import org.jeecg.modules.system.entity.SysUser; |
||||||
|
|
||||||
|
import java.util.List; |
||||||
|
|
||||||
|
@Data |
||||||
|
public class SysUserdfVO { |
||||||
|
private SysUser sysUser; |
||||||
|
private List<String> fapiao; |
||||||
|
private List<String> dizhi; |
||||||
|
} |
||||||
Loading…
Reference in new issue