You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
592 lines
12 KiB
592 lines
12 KiB
<template>
|
|
<view class="goods">
|
|
<view class="goods-hd">
|
|
<view class="item">
|
|
<view class="a">商品链接<text>*</text></view>
|
|
<view class="b b1" style="width: 500rpx;">
|
|
<u-input v-model="from.urls" wi max-height="260" maxlength="100" type="textarea"
|
|
placeholder="请输入商品链接" :border="true" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="item">
|
|
<view class="a">商品主图<text>*</text></view>
|
|
<view class="b">
|
|
<u-radio-group v-model="from.imageStorage">
|
|
<u-radio active-color='#F34A40' v-for="(item, index) in goodsImage" :key="index"
|
|
:name="item.value">
|
|
{{ item.name }}
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</view>
|
|
</view>
|
|
<view class="item">
|
|
<view class="a">商品类型<text>*</text></view>
|
|
<view class="b">
|
|
<u-radio-group v-model="from.goods_type">
|
|
<u-radio active-color='#F34A40' v-for="(item, index) in goodsType" :key="index"
|
|
:name="item.value">
|
|
{{ item.name }}
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</view>
|
|
</view>
|
|
<view class="item">
|
|
<view class="a">商品分类<text>*</text></view>
|
|
<view class="b roomCover" style="width: 350rpx;height: 40rpx;text-align: right;" @click="choseCategory">
|
|
<text :style="{color: from.categoryIds? '#606266' : '#C7C7C7'}">
|
|
{{from.categoryIds?category_name:'请选商品分类'}}</text>
|
|
<u-icon name="arrow-right" color="#C7C7C7"></u-icon>
|
|
</view>
|
|
</view>
|
|
<view class="item">
|
|
<view class="a">运费模版<text>*</text></view>
|
|
<view class="b" style="width: 350rpx;height: 40rpx;text-align: right;">
|
|
<picker @change="changeDeliveryTemplate" mode="selector" placeholder="请选择运费模版"
|
|
style="width: 350rpx;height: 40rpx;" range-key="name" :value="index" :range="deliveryTemplate">
|
|
<text :style="{color: template_name? '#606266' : '#C7C7C7'}">
|
|
{{template_name?template_name:'请选择运费模版'}}</text>
|
|
<u-icon name="arrow-right" color="#C7C7C7"></u-icon>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
<view class="item">
|
|
<view class="a">商品状态<text>*</text></view>
|
|
<view class="b">
|
|
<u-radio-group v-model="from.goods_status">
|
|
<u-radio active-color='#F34A40' v-for="(item, index) in goodsStatus" :key="index"
|
|
:name="item.value">
|
|
{{ item.name }}
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="btnGroup">
|
|
<view class="reset" @click="reset">
|
|
重置
|
|
</view>
|
|
<view class="submit" @click="submit" style="margin-left:24upx;">
|
|
确定
|
|
</view>
|
|
</view>
|
|
<view class="look" @click="toback">
|
|
查看采集列表
|
|
</view>
|
|
<category ref="category" :tabList='categoryList' @getChoseCategory="getChoseCategory"
|
|
:activeIndex='activeIndex'></category>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import * as newFunApi from '@/api/newFun'
|
|
import category from './components/category.vue'
|
|
export default {
|
|
components: {
|
|
category
|
|
},
|
|
data() {
|
|
return {
|
|
afterSale: false,
|
|
category_name: '',
|
|
template_name: '',
|
|
from: {
|
|
goods_type: 10,
|
|
urls: "",
|
|
imageStorage: 10,
|
|
goods_status: 10,
|
|
delivery_id: '',
|
|
categoryIds: '',
|
|
},
|
|
deliveryTemplate: [],
|
|
goodsType: [{
|
|
name: '实物商品',
|
|
value: 10
|
|
},
|
|
{
|
|
name: '虚拟商品',
|
|
value: 20
|
|
}
|
|
],
|
|
goodsStatus: [{
|
|
name: '上架',
|
|
value: 10
|
|
},
|
|
{
|
|
name: '下架',
|
|
value: 20
|
|
}
|
|
],
|
|
goodsImage: [{
|
|
name: '下载到本地',
|
|
value: 10
|
|
},
|
|
{
|
|
name: '使用源图片url',
|
|
value: 20
|
|
}
|
|
],
|
|
categoryList: [],
|
|
activeIndex: []
|
|
};
|
|
},
|
|
onLoad() {
|
|
this.getCategory()
|
|
this.getDelivery()
|
|
},
|
|
onReady() {},
|
|
methods: {
|
|
findElementsById(arr, ids) {
|
|
let result = []
|
|
arr.forEach(item => {
|
|
if (ids.indexOf(item.category_id) > -1) {
|
|
result.push(item.name);
|
|
}
|
|
item.children.forEach(item1 => {
|
|
if (ids.indexOf(item1.category_id) > -1) {
|
|
result.push(item1.name);
|
|
}
|
|
});
|
|
});
|
|
return result;
|
|
},
|
|
// 获取分类
|
|
getChoseCategory(res) {
|
|
let nameList = [];
|
|
nameList = this.findElementsById(this.categoryList, res.category_id);
|
|
this.category_name = nameList.join(',') + (nameList.length > 3 ? '等' : '');
|
|
this.from.categoryIds = res.category_id;
|
|
this.$refs.category.afterSale = false;
|
|
},
|
|
// 獲取运费模版
|
|
async getDelivery() {
|
|
let {
|
|
status,
|
|
message,
|
|
data
|
|
} = await newFunApi.deliveryall();
|
|
this.deliveryTemplate = data.list
|
|
},
|
|
// 獲取分类
|
|
async getCategory() {
|
|
let {
|
|
status,
|
|
message,
|
|
data
|
|
} = await newFunApi.category();
|
|
this.categoryList = data.list
|
|
},
|
|
reset() {
|
|
this.from.goods_typ = 10;
|
|
this.from.urls = "";
|
|
this.from.imageStorage = 10;
|
|
this.from.goods_status = 10;
|
|
this.from.delivery_id = '';
|
|
this.from.categoryIds = '';
|
|
},
|
|
choseCategory() {
|
|
this.$refs.category.afterSale = true;
|
|
},
|
|
// 运费模板
|
|
changeDeliveryTemplate(e) {
|
|
this.from.delivery_id = this.deliveryTemplate[e.detail.value].delivery_id;
|
|
this.template_name = this.deliveryTemplate[e.detail.value].name;
|
|
|
|
},
|
|
async submit() {
|
|
let that = this
|
|
if (!that.from.urls) {
|
|
return that.$toast('请输入商品链接')
|
|
}
|
|
if (!that.from.categoryIds) {
|
|
return that.$toast('请选择商品分类')
|
|
}
|
|
if (!that.from.delivery_id) {
|
|
return that.$toast('请选择运费模版')
|
|
}
|
|
let {
|
|
status,
|
|
message,
|
|
data
|
|
} = await newFunApi.editCollector(this.from);
|
|
if (status == 200) {
|
|
uni.showToast({
|
|
title: "保存成功"
|
|
})
|
|
uni.navigateBack()
|
|
}
|
|
},
|
|
toback() {
|
|
uni.navigateTo({
|
|
url: '/pages/news/goods/oneGrounding'
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.look {
|
|
font-size: 30rpx;
|
|
padding: 0rpx 50rpx 80rpx 0;
|
|
text-align: right;
|
|
color: #409eff;
|
|
}
|
|
|
|
.btnGroup {
|
|
margin: 60rpx 50rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
.reset {
|
|
width: 300upx;
|
|
height: 80upx;
|
|
background: #E9E9E9;
|
|
border-radius: 22px 22px 22px 22px;
|
|
opacity: 1;
|
|
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #585858;
|
|
line-height: 80upx;
|
|
text-align: center;
|
|
}
|
|
|
|
.submit {
|
|
width: 300upx;
|
|
height: 80upx;
|
|
background: linear-gradient(180deg, #FD5D06 0%, #F3211A 100%);
|
|
border-radius: 50px 50px 50px 50px;
|
|
opacity: 1;
|
|
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #FFFFFF;
|
|
line-height: 80upx;
|
|
text-align: center;
|
|
|
|
}
|
|
}
|
|
|
|
.goods {
|
|
padding: 0 0 130rpx;
|
|
overflow: hidden;
|
|
margin-top: 12rpx;
|
|
|
|
&-top {
|
|
background-color: #fff;
|
|
padding: 40rpx 15rpx;
|
|
overflow: hidden;
|
|
margin-bottom: 20rpx;
|
|
|
|
input {
|
|
display: block;
|
|
line-height: 60rpx;
|
|
font-size: 28rpx;
|
|
color: #212121;
|
|
}
|
|
|
|
.btn {
|
|
width: 158rpx;
|
|
line-height: 50rpx;
|
|
background: #FF5050;
|
|
border-radius: 50rpx;
|
|
text-align: center;
|
|
font-size: 24rpx;
|
|
font-weight: 500;
|
|
color: #FFFFFF;
|
|
float: right;
|
|
|
|
}
|
|
}
|
|
|
|
&-hd {
|
|
background-color: #fff;
|
|
padding: 0 25rpx 0;
|
|
overflow: hidden;
|
|
margin-bottom: 20rpx;
|
|
|
|
.item {
|
|
padding: 30rpx 20rpx;
|
|
line-height: 50rpx;
|
|
font-size: 28rpx;
|
|
color: #212121;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
border-bottom: 1px solid #F7F7F7;
|
|
|
|
.b1 {
|
|
::v-deep .u-input {
|
|
width: 500rpx !important;
|
|
}
|
|
}
|
|
|
|
.a {
|
|
text {
|
|
color: #F34A40;
|
|
margin-left: 5rpx;
|
|
}
|
|
}
|
|
|
|
.b {
|
|
font-size: 28rpx;
|
|
color: #606266;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
|
|
input {
|
|
font-size: 28rpx;
|
|
color: #6D6D6D;
|
|
flex: 1;
|
|
line-height: 50rpx;
|
|
font-size: 28rpx;
|
|
text-align: right;
|
|
margin-right: 10rpx;
|
|
}
|
|
|
|
.select {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
color: #C7C7C7;
|
|
justify-content: flex-end;
|
|
|
|
&-on {
|
|
color: #212121;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.items {
|
|
padding: 20rpx 30rpx;
|
|
line-height: 50rpx;
|
|
font-size: 28rpx;
|
|
color: #212121;
|
|
border-bottom: 1px solid #F7F7F7;
|
|
|
|
.t {
|
|
width: 480rpx;
|
|
height: 40rpx;
|
|
padding-left: 30rpx;
|
|
font-size: 28rpx;
|
|
color: #212121;
|
|
margin-top: 5rpx;
|
|
}
|
|
|
|
.a {
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
input {
|
|
flex: 1;
|
|
font-size: 26rpx;
|
|
color: #212121;
|
|
line-height: 50rpx;
|
|
margin-left: 20rpx;
|
|
}
|
|
|
|
text {
|
|
color: #F34A40;
|
|
margin-left: 5rpx;
|
|
}
|
|
|
|
.select {
|
|
flex: 1;
|
|
}
|
|
|
|
.tip {
|
|
margin-left: 15rpx;
|
|
font-size: 24rpx;
|
|
font-weight: 500;
|
|
color: #9F9F9F;
|
|
}
|
|
}
|
|
|
|
.b {
|
|
padding-top: 20rpx;
|
|
font-size: 24rpx;
|
|
font-weight: 400;
|
|
color: #C7C7C7;
|
|
}
|
|
|
|
.c {
|
|
padding-top: 20rpx;
|
|
overflow: hidden;
|
|
|
|
.slot-btn {
|
|
width: 180rpx;
|
|
height: 180rpx;
|
|
background: #F6F6F6;
|
|
border-radius: 10rpx;
|
|
border: 1px solid #C0C0C0;
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
font-weight: 500;
|
|
color: #6D6D6D;
|
|
|
|
image {
|
|
width: 50rpx;
|
|
height: 50rpx;
|
|
margin-top: 30rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
&-fd {
|
|
width: 100%;
|
|
position: fixed;
|
|
left: 0;
|
|
bottom: 0;
|
|
padding: 30rpx;
|
|
z-index: 99;
|
|
background-color: #fafafa;
|
|
box-sizing: border-box;
|
|
|
|
.btn {
|
|
width: 630rpx;
|
|
line-height: 88rpx;
|
|
background: #F34A40;
|
|
border-radius: 88rpx;
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
font-weight: 500;
|
|
color: #FFFFFF;
|
|
}
|
|
}
|
|
|
|
&-classify {
|
|
width: 100%;
|
|
overflow: hidden;
|
|
|
|
&-hd {
|
|
padding: 30rpx 60rpx;
|
|
position: relative;
|
|
font-size: 32rpx;
|
|
font-weight: 500;
|
|
color: #303030;
|
|
text-align: center;
|
|
|
|
.a {
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 28rpx;
|
|
font-weight: 500;
|
|
color: #FF624F;
|
|
position: absolute;
|
|
top: 30rpx;
|
|
left: 40rpx;
|
|
z-index: 2;
|
|
}
|
|
}
|
|
|
|
&-bd {
|
|
overflow: hidden;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
|
|
.l {
|
|
width: 210rpx;
|
|
height: 560rpx;
|
|
background-color: #fff;
|
|
|
|
.item {
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
height: 80rpx;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #303030;
|
|
white-space: nowrap;
|
|
line-height: 80rpx;
|
|
padding-left: 30rpx;
|
|
box-sizing: border-box;
|
|
|
|
&-on {
|
|
background-color: #fff;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
}
|
|
|
|
.m {
|
|
width: 100%;
|
|
text-align: center;
|
|
max-height: 560rpx;
|
|
|
|
.item {
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
height: 70rpx;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #303030;
|
|
white-space: nowrap;
|
|
line-height: 70rpx;
|
|
box-sizing: border-box;
|
|
|
|
&-on {
|
|
color: #FF624F;
|
|
}
|
|
}
|
|
}
|
|
|
|
.r {
|
|
width: 540rpx;
|
|
height: 560rpx;
|
|
|
|
.item {
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
height: 80rpx;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #303030;
|
|
white-space: nowrap;
|
|
line-height: 80rpx;
|
|
padding-left: 80rpx;
|
|
box-sizing: border-box;
|
|
|
|
&-on {
|
|
color: #FF624F;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
::v-deep .u-list-item {
|
|
margin: 10rpx 20rpx 10rpx 0 !important;
|
|
}
|
|
|
|
::v-deep .uni-textarea {
|
|
max-height: 100rpx !important;
|
|
}
|
|
|
|
::v-deep .uni-input-placeholder {
|
|
color: #C7C7C7 !important;
|
|
}
|
|
|
|
.roomCover {
|
|
overflow: hidden;
|
|
|
|
text {
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
-webkit-line-clamp: 1;
|
|
max-width: 400rpx;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
</style>
|
|
|