初始化商家端
This commit is contained in:
wangxiaowei
252
pages/md/rotationChart/rotationChart.vue
Normal file
252
pages/md/rotationChart/rotationChart.vue
Normal file
@ -0,0 +1,252 @@
|
||||
<template>
|
||||
<view class="warp">
|
||||
<view class="list">
|
||||
<view class="item" v-for="(item,index) in images" :key="index" @click.stop="picClick(images,index)">
|
||||
<image mode="aspectFill" :src="item.thumb || item.path"></image>
|
||||
<view class="shop-del" @tap.stop="shopChoose(item,index)">
|
||||
<image class="delimg" :src='STATIC_URL+"shop-del.png"'></image>
|
||||
</view>
|
||||
<view class="shop-add" v-if="item.checked">
|
||||
<view class="">
|
||||
<text class="active" @tap.stop="relationShop(item,index,'images')">关联商品</text>
|
||||
<text class="lines"></text>
|
||||
<text class="active" @tap.stop="del(item,index,'images')">删除图片</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item" v-if="images.length < 3">
|
||||
<image @tap="handleUploadImage('images')" :src='STATIC_URL+"32.png"'></image>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="shop-pic">
|
||||
<view class="background-image sure" @tap="sure"> {{ i18n['保存'] }}</view>
|
||||
</view> -->
|
||||
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
UploadImage
|
||||
} from '@/common/utils/index'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
images_ids: '',
|
||||
images: [],
|
||||
index: '',
|
||||
count: 3
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.setNavigationBarTitle(this.i18n['店铺轮播图'])
|
||||
},
|
||||
onShow() {
|
||||
this.getStore()
|
||||
},
|
||||
methods: {
|
||||
//获取店铺信息
|
||||
getStore() {
|
||||
this.$api.post(global.apiUrls.getShopSwiper).then(res => {
|
||||
if (res.data.code == 1) {
|
||||
this.images = res.data.data;
|
||||
this.images.forEach(item => {
|
||||
item.checked = false
|
||||
})
|
||||
}
|
||||
console.log(this.images)
|
||||
})
|
||||
},
|
||||
del(item, index, type) {
|
||||
let that = this
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否删除该轮播图',
|
||||
confirmColor: "#FF9300",
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
that.$api.post(global.apiUrls.getDelShopSwiper, {
|
||||
aid: item.aid
|
||||
}).then(res => {
|
||||
that.$message.info(res.data.msg)
|
||||
that.images.splice(index, 1)
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
shopChoose(item, index) {
|
||||
let list = this.images;
|
||||
this.images[index].checked = !this.images[index].checked;
|
||||
list = list.map((item, i) => {
|
||||
if (i == index) {
|
||||
item.checked = item.checked;
|
||||
} else {
|
||||
item.checked = false;
|
||||
}
|
||||
item.checked = item.checked;
|
||||
return item;
|
||||
})
|
||||
this.images = list
|
||||
console.log(this.images)
|
||||
},
|
||||
picClick(item, index) {
|
||||
console.log(item)
|
||||
uni.previewImage({
|
||||
urls: item,
|
||||
current: index
|
||||
});
|
||||
},
|
||||
relationShop(item, index) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/md/associatedGoods/associatedGoods?thumb=' + item.thumb + '&id=' + item.aid
|
||||
})
|
||||
},
|
||||
// 上传图片
|
||||
handleUploadImage(imgtype) {
|
||||
let that = this;
|
||||
uni.chooseImage({
|
||||
count: 1, // 默认3
|
||||
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
|
||||
success: function(res) {
|
||||
const tempFilePaths = res.tempFilePaths;
|
||||
// 开始上传
|
||||
new UploadImage(res.tempFiles, {
|
||||
complete: function(res) {
|
||||
console.log(res);
|
||||
that[imgtype].push(...res);
|
||||
that.sure(res[0].path)
|
||||
},
|
||||
})
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
sure(character) {
|
||||
let that = this;
|
||||
console.log(character)
|
||||
that.$api.post(global.apiUrls.getAddShopSwiper, {
|
||||
thumb: character,
|
||||
}).then(res => {
|
||||
that.$message.info(res.data.msg)
|
||||
that.getStore()
|
||||
})
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #fff;
|
||||
|
||||
.list {
|
||||
width: 686rpx;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.item {
|
||||
margin-top: 30rpx;
|
||||
position: relative;
|
||||
|
||||
.shop-del {
|
||||
width: 52rpx;
|
||||
height: 52rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
top: 16rpx;
|
||||
right: 16rpx;
|
||||
border-radius: 50%;
|
||||
|
||||
.iconfont {
|
||||
font-size: 20rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.shop-add {
|
||||
width: 136rpx;
|
||||
height: 122rpx;
|
||||
position: absolute;
|
||||
top: 76rpx;
|
||||
right: 16rpx;
|
||||
background: #fff;
|
||||
box-shadow: 0px 3px 24px 1px rgba(153, 153, 153, 0.16);
|
||||
|
||||
view {
|
||||
width: 136rpx;
|
||||
height: 122rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
top: 0rpx;
|
||||
right: 0rpx;
|
||||
font-size: 24rpx;
|
||||
|
||||
.active {
|
||||
display: block;
|
||||
height: 64rpx;
|
||||
line-height: 64rpx;
|
||||
}
|
||||
|
||||
.lines {
|
||||
width: 104rpx;
|
||||
height: 0px;
|
||||
border-bottom: 1rpx solid #FFFFFF;
|
||||
opacity: 0.12;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
image {
|
||||
width: 334rpx;
|
||||
height: 250rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.delimg {
|
||||
width: 52rpx;
|
||||
height: 52rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.shop-pic {
|
||||
width: 702rpx;
|
||||
height: 400rpx;
|
||||
margin: 0 auto;
|
||||
|
||||
image {
|
||||
width: 702rpx;
|
||||
height: 400rpx;
|
||||
}
|
||||
|
||||
.background-image {
|
||||
width: 686rpx;
|
||||
height: 88rpx;
|
||||
text-align: center;
|
||||
line-height: 88rpx;
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
position: fixed;
|
||||
bottom: 64rpx;
|
||||
left: 32rpx;
|
||||
background: linear-gradient(126deg, #FFB037 0%, #FE6304 100%);
|
||||
border-radius: 100rpx;
|
||||
}
|
||||
|
||||
.sure {
|
||||
bottom: 184rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user