hlm_pl_mall_store/pages/seller/goods/GoodsForm2.vue

<template>
	<page-meta :root-font-size="fontSize+'px'"></page-meta>
	<seller-base :show="false">
		<view class="div container goods-form-2">
			<view class="div common-header-wrap">
				<view :style="'height:'+navHeight+'px'"></view>
				<view class="common-header-holder"></view>
				<view class="common-header-fixed">
					<title-header />
					<uni-nav-bar title="商品发布" class="common-header" left-icon="back" @clickLeft="goBack()">
					</uni-nav-bar>
				</view>
			</view>
			<step :options="options" :active="1"></step>
			<view class="div label">特殊商品</view>
			<view class="div main-content">
				<view class="div" v-if="goods_class.gc_virtual">
					<flex-line :show-border="true"><text class="span line-name">虚拟商品</text>
						<view class="div" slot="right">
							<switch @change="switchChange(1,$event)" :checked="!!goods.is_virtual"></switch>
						</view>
					</flex-line>
					<view class="div" v-if="goods.is_virtual">
						<view class="div" @click="showPopup('showVirtualPicker')">
							<flex-line :is-link="true" :show-border="true"><text class="line-name">虚拟商品类型</text>
								<view class="div" slot="right">{{goods.virtual_type_text}}</view>
							</flex-line>
						</view>
						<view class="div" v-if="!ifSpec && goods.virtual_type==1" @click="showCard()">
							<flex-line :is-link="true" :show-border="true"><text class="line-name">卡券管理</text>
								<view class="div" slot="right">添加卡券【{{goods.card_num?goods.card_num:0}}】</view>
							</flex-line>
						</view>
						<flex-line v-if="!ifSpec && goods.virtual_type==2" class="field-line" :show-border="true"><text
								class="field-name">网盘信息</text>
							<view class="field-line-right" slot="right"><input class="field-input"
									v-model="goods.vc_pan" /></view>
						</flex-line>
						<flex-line v-if="!ifSpec && goods.virtual_type==3" :show-border="true">
							<text>商品资源</text>
							<view class="div" slot="right">
								<uni-file-picker style="text-align: right;"
									v-model="vc_file[0]" file-extname="zip" file-mediatype="all" :limit="1" :auto-upload="false"
									@select="uploadResource"></uni-file-picker>
							</view>
						</flex-line>
						<view v-if="goods.virtual_type==0" class="div">
							<flex-line :is-link="true" :show-border="true">
								<text class="span line-name">虚拟商品有效期</text>
								<view class="span" slot="right">
									<uni-datetime-picker class="common-datetime-picker" type="date"
										v-model="goods.virtual_indate" :start="$moment().format('YYYY-MM-DD')">
									</uni-datetime-picker>
								</view>
							</flex-line>
						</view>
						<flex-line class="field-line" :show-border="true"><text class="span field-name">购买上限</text>
							<view class="div field-line-right" slot="right"><input class="field-input"
									v-model="goods.virtual_limit" /></view>
						</flex-line>
						<flex-line v-if="goods.virtual_type==0" :show-border="true"><text
								class="span line-name">支持过期退款</text>
							<view class="div" slot="right">
								<switch @change="switchChange(2,$event)" :checked="!!goods.virtual_invalid_refund">
								</switch>
							</view>
						</flex-line>
					</view>
				</view>
				<view class="div" v-if="!goods.is_virtual">
					<flex-line :show-border="true"><text class="span line-name">F码商品</text>
						<view class="div" slot="right">
							<switch @change="switchChange(3,$event)" :checked="!!goods.is_goodsfcode"></switch>
						</view>
					</flex-line>
					<view class="div" v-if="goods.is_goodsfcode">
						<flex-line class="field-line" :show-border="true"><text class="span field-name">生成F码数量</text>
							<view class="div field-line-right" slot="right"><input class="field-input"
									v-model="g_fccount" /></view>
						</flex-line>
						<flex-line class="field-line" :show-border="true"><text class="span field-name">F码前缀</text>
							<view class="div field-line-right" slot="right"><input class="field-input"
									v-model="g_fcprefix" /></view>
						</flex-line>
					</view>

				</view>
			</view>
			<view class="div label">商品基本信息</view>
			<view class="div main-content">
				<view class="div" @click="goClass">
					<flex-line :is-link="true" :show-border="true"><text class="span line-name">商品分类</text><text
							class="span" slot="right">{{goods_class.gctag_name}}</text></flex-line>
				</view>
				<flex-line class="field-line" :show-border="true"><text class="span field-name">商品名称</text>
					<view class="div field-line-right" slot="right"><input class="field-input"
							v-model="goods.goods_name" /></view>
				</flex-line>
				<flex-line class="field-line" :show-border="true"><text class="span field-name">商品卖点</text>
					<view class="div field-line-right" slot="right"><input class="field-input"
							v-model="goods.goods_advword" /></view>
				</flex-line>
				<flex-line class="field-line" :show-border="true"><text class="span field-name">商品价格</text>
					<view class="div field-line-right" slot="right"><input class="field-input" :readonly="ifSpec"
							v-model="goods.goods_price" /></view>
				</flex-line>
				<flex-line class="field-line" :show-border="true"><text class="span field-name">市场价</text>
					<view class="div field-line-right" slot="right"><input class="field-input"
							v-model="goods.goods_marketprice" /></view>
				</flex-line>
				<flex-line class="field-line" :show-border="true"><text class="span field-name">成本价</text>
					<view class="div field-line-right" slot="right"><input class="field-input"
							v-model="goods.goods_costprice" /></view>
				</flex-line>
				<flex-line class="field-line" style="display: none" :show-border="true"><text
						class="span field-name">折扣</text>
					<view class="div field-line-right" slot="right"><input class="field-input"
							v-model="goods.goods_discount" readonly /></view>
				</flex-line>
				<flex-line class="field-line" :show-border="true"><text class="span field-name">商品重量</text>
					<view class="div field-line-right" slot="right"><input class="field-input" :readonly="ifSpec"
							v-model="goods.goods_weight" /></view>
				</flex-line>
				<flex-line v-if="goods.is_virtual==0 || goods.virtual_type==0" class="field-line" :show-border="true">
					<text class="span field-name">商品库存</text>
					<view class="div field-line-right" slot="right"><input class="field-input" :readonly="ifSpec"
							v-model="goods.goods_storage" /></view>
				</flex-line>
				<flex-line class="field-line" :show-border="true"><text class="span field-name">库存预警值</text>
					<view class="div field-line-right" slot="right"><input class="field-input" :readonly="ifSpec"
							v-model="goods.goods_storage_alarm" /></view>
				</flex-line>
				<flex-line class="field-line" :show-border="true"><text class="span field-name">商家货号</text>
					<view class="div field-line-right" slot="right"><input class="field-input" :readonly="ifSpec"
							v-model="goods.goods_serial" /></view>
				</flex-line>
				<view class="div" v-if="mulSpec" @click="showPopup('showSpecName')">
					<flex-line :is-link="true" :show-border="true"><text class="span line-name">设置规格名</text></flex-line>
				</view>
				<view class="div" v-if="mulSpec" @click="showPopup('showSpecValue')">
					<flex-line :is-link="true" :show-border="true"><text class="span line-name">设置规格值</text></flex-line>
				</view>
				<flex-line class="mt-5" :show-border="true">
					<text class="span">商品图片</text>
					<view class="div" slot="right">
						<view class="div user-avatar-wrapper">
							<view class="div user-avatar">
								<uni-file-picker class="common-avatar" v-model="imageValue['goods_image']"
									fileMediatype="image" mode="grid" :limit="1" :auto-upload="false"
									@select="uploadImage('goods_image',$event)" :image-styles="{
                        width:'160px',
                        height:'160px',
                        }"></uni-file-picker>
							</view>
						</view>
					</view>
				</flex-line>
				<flex-line class="mt-5" :show-border="true">
					<text class="span">商品视频</text>
					<view class="div" slot="right">
						<view class="div user-avatar-wrapper">
							<view class="div user-avatar">
								<uni-file-picker class="common-avatar" style="text-align: right;"
									v-model="imageValue['goods_video']" fileMediatype="video" mode="grid" :limit="1"
									:auto-upload="false" @select="uploadVideo"></uni-file-picker>
							</view>
						</view>
					</view>
				</flex-line>
			</view>
			<view class="div label">商品详情描述</view>
			<view class="div main-content">
				<view class="div" v-if="ifAttr" @click="showPopup('showAttr')">
					<flex-line :is-link="true" :show-border="true"><text class="span line-name">商品属性</text></flex-line>
				</view>
				<view class="div" @click="showPopup('showDesc')">
					<flex-line :is-link="true" :show-border="true"><text class="span line-name">商品描述</text></flex-line>
				</view>
				<view class="div" @click="showPopup('showBrand')">
					<flex-line :is-link="true" :show-border="true"><text class="span line-name">商品品牌</text><text
							class="span" slot="right">{{goods.brand_name}}</text></flex-line>
				</view>
			</view>

			<view class="div label">商品物流信息</view>
			<view class="div main-content">
				<view class="div" @click="onRegion">
					<flex-line :is-link="true" :show-border="true"><text class="span line-name">地区</text><text
							class="span" slot="right">{{area_info}}</text></flex-line>
				</view>
				<flex-line :show-border="true"><text class="span line-name">固定运费</text>
					<view class="div" slot="right">
						<switch @change="switchChange(4,$event)" :checked="!!ifFixedFreight"></switch>
					</view>
				</flex-line>
				<flex-line v-if="ifFixedFreight" class="field-line" :show-border="true"><text
						class="span field-name">运费</text>
					<view class="div field-line-right" slot="right"><input class="field-input"
							v-model="goods.goods_freight" /></view>
				</flex-line>
				<view class="div" v-if="!ifFixedFreight" @click="showTransportList">
					<flex-line :is-link="true" :show-border="true"><text class="span line-name">售卖区域</text><text
							class="span" slot="right">{{goods.transport_title}}</text></flex-line>
				</view>
			</view>
			<view class="div label">发票信息</view>
			<view class="div main-content">
				<flex-line :show-border="true"><text class="span line-name">开增值税发票</text>
					<view class="div" slot="right">
						<switch @change="switchChange(5,$event)" :checked="!!goods.goods_vat"></switch>
					</view>
				</flex-line>
			</view>
			<view class="div label">其他信息</view>
			<view class="div main-content">
				<view class="div" @click="showPopup('showClass')">
					<flex-line :is-link="true" :show-border="true"><text class="span line-name">本店分类</text></flex-line>
				</view>
				<flex-line :show-border="true"><text class="span line-name">立即发布</text>
					<view class="div" slot="right">
						<switch @change="switchChange(6,$event)" :checked="!!goods.goods_state"></switch>
					</view>
				</flex-line>
				<view class="div" v-if="!goods.goods_state">
					<flex-line :is-link="true" :show-border="true">
						<text class="span line-name">发布时间</text>
						<view class="span" slot="right">
							<uni-datetime-picker class="common-datetime-picker" type="datetime"
								v-model="goods.goods_shelftime" :start="$moment().format('YYYY-MM-DD HH:mm')">
							</uni-datetime-picker>
						</view>
					</flex-line>
				</view>
				<flex-line :show-border="true"><text class="span line-name">预约</text>
					<view class="div" slot="right">
						<switch @change="switchChange(7,$event)" :checked="!!goods.is_appoint"></switch>
					</view>
				</flex-line>
				<view class="div" v-if="goods.is_appoint">
					<flex-line :is-link="true" :show-border="true">
						<text class="span line-name">发售日期</text>
						<view class="span" slot="right">
							<uni-datetime-picker class="common-datetime-picker" type="date"
								v-model="goods.appoint_satedate" :start="$moment().format('YYYY-MM-DD')">
							</uni-datetime-picker>
						</view>
					</flex-line>
				</view>
				<flex-line :show-border="true"><text class="span line-name">商品推荐</text>
					<view class="div" slot="right">
						<switch @change="switchChange(8,$event)" :checked="!!goods.goods_commend"></switch>
					</view>
				</flex-line>
				<view class="div pt-10 pb-10">
					<view class="div common-btn ds-button-large" @click="nextStep">{{commonid?'保存':'下一步'}}</view>
				</view>
			</view>
			<view class="div">
				<uni-popup background-color="#fff" ref="isshow" class="popup">
					<image mode="aspectFit" class="img" :src="showimage" :style="getBannerStyle"
						@click="hidePopup('isshow')">
				</uni-popup>
				<uni-popup background-color="#fff" ref="isVideo" class="popup">
					<view class="div iconfont close-btn" @click="hidePopup('isVideo')">&#xe69a;</view>
					<video autoplay="autoplay" controls="controls" :src="showVideo" :style="getBannerStyle"
						@click="hidePopup('isVideo')" />
				</uni-popup>
			</view>
			<view class="div">
				<uni-popup background-color="#fff" ref="showBrand" type="right">
					<view :style="'width:'+screenWidth+'px'" class="common-popup-wrapper">
						<view class="div common-header-wrap">
							<view :style="'height:'+navHeight+'px'"></view>
							<view class="common-header-holder"></view>
							<view class="common-header-fixed">
								<title-header />
								<uni-nav-bar title="品牌" class="common-header" left-icon="back"
									@clickLeft="hidePopup('showBrand')">
									<view class="div common-btn btn" slot="right"
										@click="hidePopup('showBrand');goods.brand_id=0;goods.brand_name=''">取消</view>
								</uni-nav-bar>
							</view>
						</view>
						<view class="div common-popup-content">
							<scroll-view style="position: absolute;top:0;right:0;left:0;bottom:0" scroll-y="true">
								<view class="div brand-list">
									<view class="div" v-for="(bclass,index) in brand_list" :key="index">
										<text class="h2">{{index}}</text>
										<view class="ul">
											<view class="li" v-for="item in bclass" v-bind:key="item.brand_id"
												@click="selectBrand(item.brand_id,item.brand_name)">
												<view class="div p-img"
													:style="'background-image:url('+item.brand_pic+')'"></view>
											</view>
										</view>
									</view>
								</view>
							</scroll-view>
						</view>
					</view>
				</uni-popup>

				<uni-popup background-color="#fff" ref="showTransportList" type="right">
					<view :style="'width:'+screenWidth+'px'" class="common-popup-wrapper">
						<transport-list ref="transportList" :ifComponent='true' :startLoading="true"
							@useTransport="useTransport" @editTransport="editTransport"
							@addTransport="transparentQuery={action:'add',transport_id:0};showPopup('showTransportForm')"
							@closeTransortList="hidePopup('showTransportList')" />
					</view>
				</uni-popup>
				<uni-popup background-color="#fff" ref="showTransportForm" type="right">
					<view :style="'width:'+screenWidth+'px'" class="common-popup-wrapper">
						<transport-form :query="transparentQuery" :ifComponent='true' @saveTransport="saveTransport"
							@closeTransortForm="hidePopup('showTransportForm')" />
					</view>
				</uni-popup>
				<uni-popup background-color="#fff" ref="showClass" type="right">
					<view :style="'width:'+screenWidth+'px'" class="common-popup-wrapper">
						<view class="div common-header-wrap">
							<view :style="'height:'+navHeight+'px'"></view>
							<view class="common-header-holder"></view>
							<view class="common-header-fixed">
								<title-header />
								<uni-nav-bar title="店铺分类" class="common-header" left-icon="back"
									@clickLeft="hidePopup('showClass')">
								</uni-nav-bar>
							</view>
						</view>
						<view class="div common-popup-content">
							<scroll-view class='pb-30' style="position: absolute;top:0;right:0;left:0;bottom:0"
								scroll-y="true">
								<view class="block-wrapper">
									<view class="div" v-for="(item,index) in sgcate_id" :key="index"
										@click="showPopup('showClassPicker');sgcate_index=index">
										<flex-line :is-link="true" :show-border="true"><text
												class="span line-name">选择分类</text><text class="span"
												slot="right">{{sgcate_name[index]}}</text></flex-line>
									</view>
								</view>
							</scroll-view>
							<view class='common-add-btn-wrapper'>
								<view class="div common-btn common-add-btn" @click="addStoreClass">新增</view>
							</view>
						</view>
					</view>
					<uni-popup background-color="#fff" ref="showClassPicker" type="bottom">
						<view>
							<view class="div toolbar">
								<text class="button toolbar-item cancel-item" @click="cancelClass">取消</text>
								<view class="div picker-header">选择分类</view>
								<text class="button toolbar-item confirm-item" @click="confirmClass">确定</text>
							</view>
							<picker-view class="popup-content" indicator-style="height:80rpx" @change="onClassChange"
								:value="gcPicker">
								<picker-view-column v-for="(item,index) in buildItems" :key="index">
									<view class="popup-item-wrapper" v-for="(v,i) in item.values" :key="i"><text
											class="popup-item">{{v.value}}</text></view>
								</picker-view-column>
							</picker-view>
						</view>
					</uni-popup>
				</uni-popup>
				<uni-popup background-color="#fff" ref="showSpecValue" type="right">
					<view :style="'width:'+screenWidth+'px'" class="common-popup-wrapper">
						<view class="div common-header-wrap">
							<view :style="'height:'+navHeight+'px'"></view>
							<view class="common-header-holder"></view>
							<view class="common-header-fixed">
								<title-header />
								<uni-nav-bar title="设置规格值" class="common-header" left-icon="back"
									@clickLeft="calcSpec()">
								</uni-nav-bar>
							</view>
						</view>
						<view class="div common-popup-content">
							<scroll-view style="position: absolute;top:0;right:0;left:0;bottom:0" scroll-y="true">
								<view class="div" v-for="(spvalue_key,k) in specArray.spvalue_key" :key="k">
									<view class="div label">{{spec[spvalue_key].label}}</view>
									<view class="block-wrapper">
										<flex-line class="field-line" :show-border="true"><text
												class="span field-name">商品价格</text>
											<view class="div field-line-right" slot="right"><input class="field-input"
													v-model="spec[spvalue_key].goods_price" /></view>
										</flex-line>
										<flex-line class="field-line" :show-border="true"><text
												class="span field-name">市场价</text>
											<view class="div field-line-right" slot="right"><input class="field-input"
													v-model="spec[spvalue_key].goods_marketprice" /></view>
										</flex-line>
										<flex-line class="field-line" :show-border="true"><text
												class="span field-name">商品重量</text>
											<view class="div field-line-right" slot="right"><input class="field-input"
													v-model="spec[spvalue_key].goods_weight" /></view>
										</flex-line>
										<flex-line v-if="goods.is_virtual==0 || goods.virtual_type==0"
											class="field-line" :show-border="true"><text
												class="span field-name">商品库存</text>
											<view class="div field-line-right" slot="right"><input class="field-input"
													v-model="spec[spvalue_key].goods_storage" /></view>
										</flex-line>
										<view v-if="goods.is_virtual==1 && goods.virtual_type==1"
											@click="showCard(spvalue_key)">
											<flex-line :is-link="true" :show-border="true"><text
													class="line-name">卡券管理</text>
												<view slot="right">
													添加卡券【{{spec[spvalue_key].card_num?spec[spvalue_key].card_num:0}}】
												</view>
											</flex-line>
										</view>
										<flex-line v-if="goods.is_virtual==1 && goods.virtual_type==2"
											class="field-line" :show-border="true"><text class="field-name">网盘信息</text>
											<view class="field-line-right" slot="right"><input class="field-input"
													v-model="spec[spvalue_key].vc_pan" /></view>
										</flex-line>
										<flex-line v-if="goods.is_virtual==1 && goods.virtual_type==3" :show-border="true">
											<text>商品资源</text>
											<view slot="right">
												<uni-file-picker style="text-align: right;"
													v-model="vc_file[spvalue_key]" file-extname="zip" file-mediatype="all" :limit="1"
													:auto-upload="false" @select="uploadResource($event,spvalue_key)"></uni-file-picker>
											</view>
										</flex-line>
										<flex-line class="field-line" :show-border="true"><text
												class="span field-name">库存预警值</text>
											<view class="div field-line-right" slot="right"><input class="field-input"
													v-model="spec[spvalue_key].goods_storage_alarm" /></view>
										</flex-line>
										<flex-line class="field-line" :show-border="true"><text
												class="span field-name">商家货号</text>
											<view class="div field-line-right" slot="right"><input class="field-input"
													v-model="spec[spvalue_key].goods_serial" /></view>
										</flex-line>

									</view>
								</view>
							</scroll-view>
						</view>
					</view>
				</uni-popup>
				<uni-popup background-color="#fff" ref="showDesc" type="right">
					<view :style="'width:'+screenWidth+'px'" class="common-popup-wrapper">
						<view class="div common-header-wrap">
							<view :style="'height:'+navHeight+'px'"></view>
							<view class="common-header-holder"></view>
							<view class="common-header-fixed">
								<title-header />
								<uni-nav-bar title="商品描述" class="common-header" left-icon="back"
									@clickLeft="hidePopup('showDesc')">
								</uni-nav-bar>
							</view>
						</view>
						<view class="div common-popup-content">
							<scroll-view style="position: absolute;top:0;right:0;left:0;bottom:0" scroll-y="true">
								<view class="div body-list">
									<view class="div body-item" v-for="(item,index) in bodyList" :key='index'>
										<view class="div" v-if="item.type=='text'">{{item.value?item.value:'请输入内容'}}
										</view>
										<view class="div" v-if="item.type=='image'">
											<image mode="aspectFit"
												:style="'width:'+windowWidth+'px;height:'+windowWidth+'px'" class="img"
												v-if="item.value" :src="item.value_url"><text class="span"
													v-else>请上传图片</text>
										</view>
										<view class="div btn-list">
											<!--上移-->
											<text class="i iconfont" v-show="index!=0"
												@click="bodyMove(index,'up')">&#xe648;</text>
											<!--下移-->
											<text class="i iconfont" v-show="index!=(bodyList.length-1)"
												@click="bodyMove(index,'down')">&#xe643;</text>
											<!--插入-->
											<text class="i iconfont" @click="bodyAdd(index)">&#xe69c;</text>
											<!--编辑-->
											<text class="i iconfont" @click="bodyEdit(index,item)">&#xe658;</text>
											<!--删除-->
											<text class="i iconfont" v-show="index!=(bodyList.length-1)"
												@click="bodyDel(index)">&#xe641;</text>
										</view>
									</view>
								</view>
							</scroll-view>
						</view>
					</view>
					<uni-popup background-color="#fff" class="middle-popup" ref="bodyEditVisible">
						<view style="padding:1rem">
							<flex-line v-if="bodyItem.type=='text'" class="field-line" :show-border="true"><textarea
									class="field-input" placeholder="请输入内容" v-model="bodyItem.value"></textarea>
							</flex-line>

							<view v-if="bodyItem.type=='image'" class="div user-avatar">
								<uni-file-picker class="common-avatar" v-model="imageValue['goods_body']"
									fileMediatype="image" mode="grid" :limit="1" :auto-upload="false"
									@select="uploadImage('goods_body',$event)" :image-styles="{
                        width:'100px',
                        height:'100px',
                        }"></uni-file-picker>
							</view>
						</view>
					</uni-popup>
					<uni-popup background-color="#fff" class="middle-popup" ref="bodyAddVisible">
						<view style="padding:1rem">
							<flex-line :show-border="true">
								<text class="span">类型</text>
								<view class="div" slot="right">
									<radio-group @change="radioChange">
										<label v-for="(item, index) in bodyTypeOptions" :key="index">
											<radio :value="item.value" :checked="bodyType==item.value" />
											<text>{{item.label}}</text>
										</label>
									</radio-group>
								</view>
							</flex-line>
							<view class="div btn-wrapper">

								<view class="div common-btn ds-button-large default btn"
									@click="hidePopup('bodyAddVisible')">取消</view>
								<view class="div common-btn ds-button-large btn" @click='confirmBodyAdd'>确定</view>
							</view>
						</view>
					</uni-popup>
				</uni-popup>
				<uni-popup background-color="#fff" ref="showAttr" type="right">
					<view :style="'width:'+screenWidth+'px'" class="common-popup-wrapper">
						<view class="div common-header-wrap">
							<view :style="'height:'+navHeight+'px'"></view>
							<view class="common-header-holder"></view>
							<view class="common-header-fixed">
								<title-header />
								<uni-nav-bar title="商品属性" class="common-header" left-icon="back"
									@clickLeft="hidePopup('showAttr')">
								</uni-nav-bar>
							</view>
						</view>
						<view class="div common-popup-content" v-if="attr_list">
							<scroll-view style="position: absolute;top:0;right:0;left:0;bottom:0" scroll-y="true">
								<view class="block-wrapper">
									<view class="div" v-for="(item,index) in attr_list" :key="index"
										@click="popAttr(index)">
										<flex-line :is-link="true" :show-border="true"><text
												class="span line-name">{{item.attr_name}}</text><text class="span"
												slot="right">{{attrValue[index]}}</text></flex-line>
									</view>
								</view>
							</scroll-view>
						</view>
					</view>
					<uni-popup background-color="#fff" v-for="(item,index) in attrList" :key="index"
						:ref="'showAttrValue_'+index" type="bottom">
						<view>
							<view class="div toolbar">
								<text class="button toolbar-item cancel-item" @click="cancelAttr(index)">取消</text>
								<view class="div picker-header">选择属性</view>
								<text class="button toolbar-item confirm-item" @click="confirmAttr(index)">确定</text>
							</view>
						</view>
						<picker-view class="popup-content" indicator-style="height:80rpx" :value="gaPicker[index]"
							@change="onAttrChange($event,index)">
							<picker-view-column v-for="(item,index) in attrList[index]" :key="index">
								<view class="popup-item-wrapper" v-for="(v,i) in item.values" :key="i"><text
										class="popup-item">{{v.attrvalue_name}}</text></view>
							</picker-view-column>
						</picker-view>
					</uni-popup>
				</uni-popup>
				<uni-popup background-color="#fff" ref="showSpecName" type="right">
					<view :style="'width:'+screenWidth+'px'" class="common-popup-wrapper">
						<view class="div common-header-wrap">
							<view :style="'height:'+navHeight+'px'"></view>
							<view class="common-header-holder"></view>
							<view class="common-header-fixed">
								<title-header />
								<uni-nav-bar title="设置规格名" class="common-header" left-icon="back"
									@clickLeft="hideSpecName()">
								</uni-nav-bar>
							</view>
						</view>
						<view class="div common-popup-content" v-if="spec_list">
							<scroll-view style="position: absolute;top:0;right:0;left:0;bottom:0" scroll-y="true">
								<view class="block-wrapper">
									<view class="div" v-for="(val,k) in spec_list" :key="k">
										<flex-line class="field-line" :show-border="true">
											<view class="div field-line-right" slot="right"><input class="field-input"
													style="text-align: left;" v-model="sp_name[k]" /></view>
										</flex-line>
										<checkbox-group @change="checkboxChange(k,$event)">
											<label v-for="(item,i) in sp_option[k]" :key="i">
												<checkbox :checked="sp_val[k].indexOf(item.value+'')>-1"
													:value="item.value+''">
												</checkbox>
												{{item.label}}
											</label>
										</checkbox-group>
										<view class="div common-btn ds-button-large mt-10"
											@click="sp_id=k;showPopup('showSpecAdd')">添加规格值</view>
									</view>
								</view>
							</scroll-view>
						</view>
					</view>
					<uni-popup background-color="#fff" ref="showSpecAdd">
						<view style="padding:1rem">
							<flex-line class="field-line" :show-border="true">
								<view class="div field-line-right" slot="right"><input class="field-input"
										style="text-align: left;" v-model="spec_add_value" placeholder="请输入规格值" />
								</view>
							</flex-line>
							<view class="div common-btn ds-button-large mt-10" @click="goodsSpecAdd()">确定</view>
						</view>
					</uni-popup>
				</uni-popup>
			</view>
			<view class="div">
				<region-picker ref="picker" @onConfirm="onPickerConfirm" @onCancel="area_info=''"></region-picker>
			</view>
			<tui-picture-cropper v-if="cropperOption.imgUrl" :width="cropperOption.autoCropWidth"
				:height="cropperOption.autoCropHeight" :imageUrl="cropperOption.img" @ready="cropReady"
				@cropper="useCrop" @back="cropBack"></tui-picture-cropper>
			<uni-popup background-color="#fff" ref="showVirtualPicker" type="bottom">
				<view>
					<view class="toolbar">
						<text class="button toolbar-item cancel-item" @click="hidePopup('showVirtualPicker')">取消</text>
						<view class="picker-header">选择虚拟商品类型</view>
						<text class="button toolbar-item confirm-item" @click="confirmVirtual">确定</text>
					</view>
					<picker-view class="popup-content" indicator-style="height:80rpx" @change="onVirtualChange"
						:value="virtualPicker">
						<picker-view-column v-for="(item,index) in virtualItems" :key="index">
							<view class="popup-item-wrapper" v-for="(v,i) in item.values" :key="i"><text
									class="popup-item">{{v.name}}</text></view>
						</picker-view-column>
					</picker-view>
				</view>
			</uni-popup>
			<uni-popup background-color="#fff" class="middle-popup" ref="cardPopup">
				<view class="card-wrapper">
					<view class="card-notice">添加卡密格式为卡号+空格+密码，一行一组，如AAAAA BBBBB</view>
					<textarea class="card-textarea" v-model="cardContent"></textarea>
					<view class="common-btn ds-button-large mt-10" @click="addCard()">确定</view>
				</view>
			</uni-popup>
		</view>
	</seller-base>
</template>

<script>
	import TitleHeader from '../../TitleHeader'
	import {
		urlencode,
		getFontSize
	} from '@/util/common'

	import SellerBase from '../SellerBase'
	import tuiPictureCropper from "@/components/thorui/tui-picture-cropper/tui-picture-cropper"
	import Step from '../../Step'
	import transportList from '../transport/transportList'
	import transportForm from '../transport/transportForm'
	import RegionPicker from '../../RegionPicker'
	import {
		getBrandList
	} from '../../../api/homesearch'
	import {
		getCommonData,
		goodsEdit,
		goodsSpecAdd,
		uploadInfoFile,
		uploadVideo,
		goodsSave,
		uploadResource,
		delResource
	} from '../../../api/sellerGoods'
	import {
		getGoodsClassTree
	} from '../../../api/sellerGoodsClass'
	import flexLine from '../../flexLine'
	export default {
		data() {
			return {
				spvalue_key: '',
				cardContent: '',
				virtualItems: [{
					flex: 1,
					values: [{
						id: 0,
						name: '核销商品'
					}, {
						id: 1,
						name: '卡券商品'
					}, {
						id: 2,
						name: '网盘商品'
					}, {
						id: 3,
						name: '下载商品'
					}],
					textAlign: 'center'
				}],
				navHeight: 0,
				gaPicker: {},
				virtualPicker: [0],
				gcPicker: [0, 0],
				imageValue: {},
				vc_file: {},
				screenWidth: 0,
				cropType: '',
				cropperOption: {
					img: '',
					canMove: false,
					autoCrop: true,
					autoCropWidth: 100,
					autoCropHeight: 100,
					maxImgSize: 500,
					outputType: 'png'
				},
				controller: 'Sellergoodsonline',
				options: [{
					title: '选择商品分类'
				}, {
					title: '填写商品详情'
				}, {
					title: '上传商品图片'
				}],
				ifLoad: 0,
				class_id: 0,
				commonid: 0,
				action: '',
				goods: {
					goods_state: true,
					virtual_type: 0,
					virtual_type_text: '核销商品'
				},
				selectAttr: {},
				ifAttr: false,
				attrValue: {},
				attrList: {},
				ifSpec: false,
				mulSpec: false,
				showimage: '',
				showVideo: '',
				sp_val: {},
				sp_name: {},
				sp_option: {},
				spec_list: false,
				spec_json: false,
				attr_list: false,
				sp_id: 0,
				spec_add_value: '',
				specArray: false,
				spec: {},
				bodyVisible: false,
				bodyIndex: 0,
				bodyList: [{
					type: 'text',
					value: ''
				}],
				bodyItem: false,
				bodyTypeOptions: [{
						label: '文字',
						value: 'text'
					},
					{
						label: '图片',
						value: 'image'
					}
				],
				bodyType: 'text',
				area_info: '',
				ifFixedFreight: true,
				brand_list: {},
				g_fccount: '',
				g_fcprefix: '',
				transparentQuery: {
					action: 'add',
					transport_id: 0
				},
				items: false,
				sgcate_id: [0],
				sgcate_name: [''],
				sgcate_index: 0,
				goods_class: {},
				attr_checked: false,
				spec_checked: false
			}
		},

		onLoad: function(option) {
			this.class_id = option.class_id ? option.class_id : ''
			this.commonid = option.commonid ? option.commonid : ''
			this.action = option.commonid ? 'add' : 'edit'
			getGoodsClassTree().then(res => {
				this.items = res.result.class_list
			}).catch(error => {
				uni.showToast({
					icon: 'none',
					title: error.message
				})
			})

			getBrandList(0).then(res => {
				this.brand_list = res.result.brand_l
			}).catch(function(error) {
				uni.showToast({
					icon: 'none',
					title: error.message
				})
			})
			getCommonData(this.controller, this.class_id).then(res => {
				var spec_list = res.result.spec_list
				var attr_list = res.result.attr_list
				if (attr_list && Object.keys(attr_list).length) {
					this.ifAttr = true
					this.attr_list = attr_list
					for (var i in attr_list) {
						this.attrList[i] = [{
							flex: 1,
							values: attr_list[i].value,
							textAlign: 'center'

						}]
						this.gaPicker[i] = [0]
					}
				}
				var sp_option = {}

				if (spec_list && Object.keys(spec_list).length) {
					this.mulSpec = true
					for (var k in spec_list) {
						var val = spec_list[k]
						sp_option[k] = []
						this.sp_val[k] = []
						if (typeof(this.sp_name[k]) === 'undefined') {
							this.sp_name[k] = val.sp_name
						}
						for (var j in val.value) {
							sp_option[k].push({
								label: val.value[j].spvalue_name,
								value: val.value[j].spvalue_id
							})
						}
					}
				}
				this.goods_class = res.result.goods_class
				this.spec_json = res.result.spec_json
				this.sp_option = sp_option
				this.spec_list = spec_list

				if (!this.goods_class.gc_id) {
					uni.showToast({
						icon: 'none',
						title: '请重新选择分类'
					})
					uni.navigateTo({
						url: '/pages/seller/goods/GoodsForm1' + '?' + urlencode({
							commonid: this.commonid
						})
					})
				}
				this.ifLoad++
			}).catch(error => {
				uni.showToast({
					icon: 'none',
					title: error.message
				})
			})
			if (this.commonid) {
				goodsEdit(this.controller, this.commonid).then(res => {
					var spec_checked = res.result.spec_checked
					this.attr_checked = res.result.attr_checked
					var goods = res.result.goods

					goods.is_virtual = !!goods.is_virtual
					goods.is_goodsfcode = !!goods.is_goodsfcode
					goods.goods_vat = !!goods.goods_vat
					goods.goods_state = !!goods.goods_state
					goods.is_appoint = !!goods.is_appoint
					goods.goods_commend = !!goods.goods_commend
					goods.virtual_invalid_refund = !!goods.virtual_invalid_refund
					if (goods.vc_file) {
						this.vc_file[0] = [{
							name: 'vc_file',
							extname: 'zip',
							url: goods.vc_file
						}]
					}
					if (goods.mb_body) {
						this.bodyList = goods.mb_body
					}
					this.ifFixedFreight = !goods.transport_id
					this.goods = goods

					if (this.goods.goods_image) {
						this.imageValue['goods_image'] = [{
							name: 'goods_image',
							extname: 'jpg',
							url: this.goods.goods_image_url
						}]
					}
					if (this.goods.goodsvideo_url) {
						this.imageValue['goods_video'] = [{
							name: 'goods_image',
							extname: 'mp4',
							url: this.goods.goodsvideo_url
						}]
					}

					if (goods.spec_name) {
						for (var k in goods.spec_name) {
							this.sp_name[k] = goods.spec_name[k]
						}
					}

					this.area_info = res.result.area ? res.result.area.area_name : ''
					var sp_value = res.result.sp_value
					for (var i in sp_value) {
						this.spec[i] = {
							goods_id: sp_value[i]['id'],
							label: sp_value[i]['label'],
							color: sp_value[i]['color'],
							sp_value: sp_value[i]['sp_value'],
							goods_marketprice: sp_value[i]['marketprice'],
							goods_price: sp_value[i]['price'],
							goods_storage_alarm: sp_value[i]['alarm'],
							goods_serial: sp_value[i]['sku'],
							goods_storage: sp_value[i]['stock'],
							goods_weight: sp_value[i]['goods_weight'],
							vc_card: sp_value[i]['vc_card'],
							vc_pan: sp_value[i]['vc_pan'],
							vc_file: sp_value[i]['vc_file']
						}
					}

					this.spec_checked = spec_checked
					this.sgcate_id = res.result.store_class_goods
					let store_goods_class = res.result.store_goods_class
					for (var i in this.sgcate_id) {
						if (store_goods_class[this.sgcate_id[i]]) {
							this.sgcate_name[i] = store_goods_class[this.sgcate_id[i]].storegc_name
						}
					}
					this.ifLoad++
				}).catch(error => {
					uni.showToast({
						icon: 'none',
						title: error.message
					})
				})
			}
		},
		computed: {
			fontSize() {
				return getFontSize()
			},
			getBannerStyle: function() {
				const res = uni.getSystemInfoSync()
				var width = res.windowWidth
				var height = res.windowHeight
				let itemWidth = width
				let itemHeight = height
				return "max-width:" + itemWidth + "px;max-height:" + itemHeight + "px"
			},
			windowWidth: function() {
				const res = uni.getSystemInfoSync()
				var width = res.windowWidth
				var size = getFontSize()
				return width - 2 * size
			},
			buildItems: function() {
				if (!this.items || !this.items[0]) {
					return []
				}
				let items = new Array()

				this.getDefaultItems(this.items, items)
				return items
			}
		},
		components: {
			TitleHeader,
			SellerBase,
			flexLine,
			tuiPictureCropper,
			Step,
			RegionPicker,
			transportForm,
			transportList
		},
		watch: {
			ifLoad: function() {
				if (this.attr_checked && this.attr_list && Object.keys(this.attr_checked).length && Object.keys(this
						.attr_list).length) {
					for (var i in this.attr_list) {
						for (var j in this.attr_list[i].value) {
							if (this.attr_checked.indexOf(this.attr_list[i].value[j].attrvalue_id) > -1) {
								this.attrValue[i] = this.attr_list[i].value[j].attrvalue_name
							}
						}
					}
				}
				if (this.spec_checked && Object.keys(this.spec_checked).length && this.spec_json && Object.keys(this
						.spec_json).length) {
					this.ifSpec = true
					var spvalue_ids = Object.keys(this.spec_checked)
					for (var i in this.spec_json) {
						var temp = Object.keys(this.spec_json[i])
						var arr = temp.filter(function(v) {
							return spvalue_ids.indexOf(v) !== -1 // 利用filter方法来遍历是否有相同的元素
						})
						if (arr.length) {
							this.sp_val[i] = arr
						}
					}
					this.getSpecArray()
				}
				this.$forceUpdate()
			}
		},
		mounted() {
			// #ifdef  MP-WEIXIN
			this.navHeight = uni.getMenuButtonBoundingClientRect().height
			// #endif
			this.screenWidth = uni.getSystemInfoSync().screenWidth
		},
		methods: {
			uploadResource(event, spvalue_key) {
				let files = event.tempFiles[0]
				if (typeof(files) === 'undefined') {
					return
				}
				var formdata = {
					filePath: files.path,
					name: 'file',
					id: 'file'
				}
				uni.showLoading({
					title: '加载中'
				})
				uploadResource(formdata).then(res => {
					if (spvalue_key) {
						this.spec[spvalue_key].vc_file = res.result.name
					} else {
						this.goods.vc_file = res.result.name
					}
					this.vc_file[spvalue_key?spvalue_key:0] = [{
						name: 'vc_file',
						extname: 'zip',
						url: res.result.name
					}]
					this.$forceUpdate()
					uni.hideLoading()
				}).catch(function(error) {
					uni.showToast({
						icon: 'none',
						title: error.message
					})
					uni.hideLoading()
				})
			},
			showCard(spvalue_key) {
				this.spvalue_key = spvalue_key
				if (spvalue_key) {
					this.cardContent = this.spec[spvalue_key].vc_card
				} else {
					this.cardContent = this.goods.vc_card
				}
				this.showPopup('cardPopup')
			},
			addCard() {
				var snsArr = this.cardContent.split(/[(\r\n)\r\n]+/)
				if (snsArr.length > 1000) {
					uni.showToast({
						icon: 'none',
						title: '最多可添加100对卡密'
					})
					return
				}
				snsArr.forEach((item, index) => {
					if (!item) {
						snsArr.splice(index, 1); //删除空项
					}
				})
				if (snsArr.length > 100) {
					uni.showToast({
						icon: 'none',
						title: '最多可添加100对卡密'
					})
					return
				}
				if (this.spvalue_key) {
					this.spec[this.spvalue_key].vc_card = this.cardContent
					this.spec[this.spvalue_key].card_num = snsArr.length
				} else {
					this.goods.vc_card = this.cardContent
					this.goods.card_num = snsArr.length
				}
				this.hidePopup('cardPopup')
				this.$forceUpdate()
			},
			onVirtualChange(e) {
				this.virtualPicker = e.detail.value
				this.$forceUpdate()
			},
			confirmVirtual() {
				let values = []
				for (var i in this.virtualPicker) {
					values[i] = this.virtualItems[i]['values'][this.virtualPicker[i]]
					if (!values[i]) {
						values[i] = {
							id: 0,
							name: ''
						}
					}
				}
				var temp = values[0]
				this.goods.virtual_type = temp.id
				this.goods.virtual_type_text = temp.name
				this.hidePopup('showVirtualPicker')
				this.$forceUpdate()
			},
			checkboxChange(k, event) {
				this.sp_val[k] = event.detail.value
				this.$forceUpdate()
			},
			switchChange(i, e) {
				switch (i) {
					case 1:
						this.goods.is_virtual = e.detail.value
						break
					case 2:
						this.goods.virtual_invalid_refund = e.detail.value
						break
					case 3:
						this.goods.is_goodsfcode = e.detail.value
						break
					case 4:
						this.ifFixedFreight = e.detail.value
						break
					case 5:
						this.goods.goods_vat = e.detail.value
						break
					case 6:
						this.goods.goods_state = e.detail.value
						break
					case 7:
						this.goods.is_appoint = e.detail.value
						break
					case 8:
						this.goods.goods_commend = e.detail.value
						break
				}
				this.$forceUpdate()
			},
			radioChange(e) {
				this.bodyType = e.detail.value
			},
			showPopup(id) {
				this.$refs[id].open()
			},
			hidePopup(id) {
				this.$refs[id].close()
			},
			goBack() {
				uni.navigateBack({
					delta: 1
				})
			},
			hideSpecName() {
				this.hidePopup('showSpecName')
				this.checkSpec()
				this.calcSpec()
			},
			goClass() {
				uni.navigateTo({
					url: '/pages/seller/goods/GoodsForm1' + '?' + urlencode({
						commonid: this.commonid
					})
				})
			},
			popAttr(index) {
				this.$refs['showAttrValue_' + index][0].open()
				this.$forceUpdate()
			},
			selectBrand(brand_id, brand_name) {
				this.goods.brand_name = brand_name
				this.goods.brand_id = brand_id
				this.hidePopup('showBrand')
			},
			calcSpec() {
				let min_price
				let min_marketprice
				let total_storage = 0
				let goods_storage_alarm = 0
				let goods_serial
				var goods_weight = 0
				for (var j in this.specArray.spvalue_key) {
					var i = this.specArray.spvalue_key[j]
					if (isNaN(this.spec[i].goods_storage)) {
						this.spec[i].goods_storage = 0
					}
					if (isNaN(this.spec[i].goods_storage_alarm)) {
						this.spec[i].goods_storage_alarm = 0
					}
					if (!goods_weight) {
						goods_weight = this.spec[i].goods_weight
					}
					var temp = parseFloat(this.spec[i].goods_price)
					if (!isNaN(temp) && (typeof(min_price) === 'undefined' || min_price > temp)) {
						min_price = temp
						min_marketprice = this.spec[i].goods_marketprice
						goods_storage_alarm = this.spec[i].goods_storage_alarm
						goods_serial = this.spec[i].goods_serial
					}
					if (this.spec[i].goods_storage > 0) {
						total_storage += parseInt(this.spec[i].goods_storage)
					}
				}
				this.goods.goods_serial = goods_serial
				this.goods.goods_price = min_price
				this.goods.goods_marketprice = min_marketprice
				this.goods.goods_storage_alarm = goods_storage_alarm
				this.goods.goods_storage = total_storage
				this.goods.goods_weight = goods_weight
				this.hidePopup('showSpecValue')
			},
			checkSpec() {
				this.ifSpec = false
				for (var k in this.sp_val) {
					if (this.sp_val[k].length) {
						this.ifSpec = true
						break
					}
				}

				this.getSpecArray()
			},
			addStoreClass() {
				this.sgcate_id.push(0)
				this.sgcate_name.push('')
			},
			getDefaultItems(_item, defaultItems) {
				defaultItems.push({
					flex: 1,
					values: _item,
					textAlign: 'center'

				})
				defaultItems.push({
					flex: 1,
					values: _item[0].children,
					textAlign: 'center'

				})
			},

			cancelClass() {
				this.hidePopup('showClassPicker')
			},
			confirmClass() {
				let values = []
				for (var i in this.gcPicker) {
					values[i] = this.buildItems[i]['values'][this.gcPicker[i]]
					if (!values[i]) {
						values[i] = {
							id: 0,
							value: ''
						}
					}
				}
				var temp = values[1]
				if (!temp.id) {
					temp = values[0]
				}
				this.sgcate_name.splice(this.sgcate_index, 1, temp.value)
				this.sgcate_id[this.sgcate_index] = temp.id

				this.hidePopup('showClassPicker')
			},
			onClassChange(e) {
				let value = e.detail.value
				let gcPicker = this.gcPicker
				for (var i in value) {
					gcPicker[i] = value[i]
					i = parseInt(i)
					if (i < (value.length - 1)) {
						if (!this.buildItems[i]['values'].length || !this.buildItems[i]['values'][value[i]]['children'] ||
							!this.buildItems[i]['values'][value[i]]['children'].length) {
							this.buildItems[i + 1]['values'] = []
							gcPicker[i + 1] = 0
						} else if (!this.buildItems[i + 1]['values'].length || this.buildItems[i]['values'][value[i]][
								'children'
							][0]['id'] != this.buildItems[i + 1]['values'][0]['id']) {
							this.buildItems[i + 1]['values'] = this.buildItems[i]['values'][value[i]]['children']
							gcPicker[i + 1] = 0
						}
					}
				}
				this.gcPicker = gcPicker
				this.$forceUpdate()
			},
			cancelAttr(index) {
				this.$refs['showAttrValue_' + index][0].close()
				this.$forceUpdate()
			},
			confirmAttr(index) {
				let values = []
				for (var i in this.gaPicker[index]) {
					values[i] = this.attrList[index][i]['values'][this.gaPicker[index][i]]
					if (!values[i]) {
						values[i] = {
							attrvalue_id: 0,
							attrvalue_name: ''
						}
					}
				}

				if (typeof(this.selectAttr[index]) === 'undefined') {
					this.selectAttr[index] = {
						name: this.attr_list[index].attr_name
					}
					this.selectAttr[index][values[0].attrvalue_id] = values[0].attrvalue_name
				}
				this.cancelAttr(index)
				this.attrValue[index] = values[0].attrvalue_name
				this.$forceUpdate()
			},
			onAttrChange(e, index) {
				this.gaPicker[index] = e.detail.value
			},
			showTransportList() {
				this.showPopup('showTransportList')
				this.$nextTick(function() {
					this.$refs.transportList.reload()
				})

			},
			saveTransport() {
				this.$refs.transportList.reload()
				this.hidePopup('showTransportForm')
			},
			useTransport(transport_id, transport_title) {
				this.goods.transport_id = transport_id
				this.goods.transport_title = transport_title
				this.hidePopup('showTransportList')
			},
			editTransport(transport_id) {
				this.transparentQuery = {
					action: 'edit',
					transport_id: transport_id
				}
				this.showPopup('showTransportForm')
			},
			onRegion(picker, values) {
				this.$refs.picker.show()
			},
			onPickerConfirm(values) {
				this.area_info = this.getRegionStr(values)

				this.goods.areaid_1 = values[0].area_id
				this.goods.areaid_2 = values[1].area_id
			},
			getRegionStr(values) {
				let title = ''
				for (let i = 0; i < values.length; i++) {
					const element = values[i]
					if (i !== 0) {
						title = title + ' ' + element.area_name
					} else {
						title = title + element.area_name
					}
				}
				return title
			},
			bodyDel(index) {
				this.bodyList.splice(index, 1)
			},
			bodyMove(index, mode) {
				if (mode == 'up') {
					this.bodyList.splice(index - 1, 2, this.bodyList[index], this.bodyList[index - 1])
				} else {
					this.bodyList.splice(index, 2, this.bodyList[index + 1], this.bodyList[index])
				}
			},
			confirmBodyAdd() {
				let bodyItem = {
					type: this.bodyType,
					value: ''
				}
				this.bodyList.splice(this.bodyIndex, 0, bodyItem)
				this.hidePopup('bodyAddVisible')
				this.bodyEdit(this.bodyIndex, bodyItem)
			},
			bodyAdd(index) {
				this.showPopup('bodyAddVisible')
				this.bodyIndex = index
			},
			bodyEdit(index, item) {
				this.showPopup('bodyEditVisible')
				this.bodyItem = item
				if (this.bodyItem.value_url) {
					this.imageValue['goods_body'] = [{
						name: 'goods_body',
						extname: 'jpg',
						url: this.bodyItem.value_url
					}]
				}
			},
			getSpecArray() {
				let sp_val = this.sp_val

				this.specArray = this.doExchange(sp_val)
				this.$forceUpdate()
			},
			doExchange(arr) {
				var len = Object.keys(arr).length
				// 当数组大于等于2个的时候
				if (len >= 2 || typeof(arr[0]) === 'undefined') {
					var j = 0
					var myArr = []
					// 将新组合的数组并到原数组中
					var newArr = {}
					for (var i in arr) {
						if (myArr.length > 1) {
							if (arr[i].length) {
								newArr[i] = arr[i]
							}
						} else {
							if (i == 0 || arr[i].length) {
								myArr.push({
									sp_id: i,
									spvalue_id: arr[i]
								})
							}
						}
						j++
					}

					if (myArr.length > 0) {
						var temp
						if (typeof(arr[0]) === 'undefined') {
							temp = {
								spvalue_id: [],
								spvalue_name: []
							}
							for (var i in myArr[0].spvalue_id) {
								temp.spvalue_id[i] = [myArr[0].spvalue_id[i]]
								temp.spvalue_name[i] = [this.spec_json[myArr[0].sp_id][myArr[0].spvalue_id[i]]
									.spvalue_name]
							}
						} else {
							temp = arr[0]
						}

						if (myArr.length > 1) {
							newArr[0] = {
								spvalue_id: [],
								spvalue_name: []
							}
							var index = 0
							for (var i in temp.spvalue_id) {
								for (var j in myArr[1].spvalue_id) {
									newArr[0].spvalue_id[index] = temp.spvalue_id[i].concat([myArr[1].spvalue_id[j]])
									newArr[0].spvalue_name[index] = temp.spvalue_name[i].concat([this.spec_json[myArr[1]
										.sp_id][myArr[1].spvalue_id[j]].spvalue_name])

									index++
								}
							}
						} else {
							newArr[0] = temp
						}
					} else {
						newArr[0] = []
					}

					// 执行回调
					return this.doExchange(newArr)
				} else {
					arr[0]['spvalue_key'] = []
					for (var i in arr[0].spvalue_id) {
						let color = null
						var spvalue_id_list = arr[0].spvalue_id[i]
						if (this.spec_list[1]) {
							for (var j in this.spec_list[1].value) {
								if (spvalue_id_list.indexOf(this.spec_list[1].value[j].spvalue_id) > -1 || spvalue_id_list
									.indexOf(this.spec_list[1].value[j].spvalue_id.toString()) > -1) {
									color = this.spec_list[1].value[j].spvalue_id
								}
							}
						}
						var spvalue_name = arr[0].spvalue_name[i]
						var spvalue_id = arr[0].spvalue_id[i]
						var sp_value = {}
						for (var k in spvalue_name) {
							sp_value[spvalue_id[k]] = spvalue_name[k]
						}
						var spvalue_id_str = spvalue_id.sort(function(a, b) {
							return a - b
						}).join('')
						arr[0]['spvalue_key'].push(spvalue_id_str)
						if (typeof(this.spec[spvalue_id_str]) === 'undefined') {
							this.spec[spvalue_id_str] = {
								goods_id: 0,
								label: arr[0].spvalue_name[i].join('|'),
								color: color,
								sp_value: sp_value,
								goods_marketprice: this.goods.goods_marketprice,
								goods_price: this.goods.goods_price,
								goods_storage_alarm: this.goods.goods_storage_alarm,
								goods_serial: this.goods.goods_serial,
								goods_storage: this.goods.goods_storage,
								goods_weight: this.goods.goods_weight,
								vc_card: this.goods.vc_card,
								vc_pan: this.goods.vc_pan,
								vc_file: this.goods.vc_file
							}
						} else {
							if (this.spec[spvalue_id_str].vc_file) {
								this.vc_file[spvalue_id_str] = [{
									name: 'vc_file',
									extname: 'zip',
									url: this.spec[spvalue_id_str].vc_file
								}]
							}
						}
					}

					return arr[0]
				}
			},
			goodsSpecAdd() {
				if (!this.spec_add_value) {
					uni.showToast({
						icon: 'none',
						title: '请输入规格值'
					})
					return
				}
				goodsSpecAdd(this.controller, this.spec_add_value, this.class_id, this.sp_id).then(res => {
					this.sp_option[this.sp_id].push({
						label: this.spec_add_value,
						value: res.result.value_id
					})
					if (typeof(this.spec_json[this.sp_id]) === 'undefined') {
						this.spec_json[this.sp_id] = {}
					}
					this.spec_json[this.sp_id][res.result.value_id] = {
						spvalue_name: this.spec_add_value,
						spvalue_id: res.result.value_id,
						spvalue_color: null
					}
					if (this.sp_id == 1) {
						this.spec_list[1].value.push(this.spec_json[this.sp_id][res.result.value_id])
					}
					this.hidePopup('showSpecAdd')
				}).catch(error => {
					uni.showToast({
						icon: 'none',
						title: error.message
					})
				})
			},
			nextStep() {
				if (isNaN(this.goods.goods_price) || this.goods.goods_price <= 0) {
					uni.showToast({
						icon: 'none',
						title: '请检查价格'
					})
					return
				}
				if (parseFloat(this.goods.goods_marketprice) < parseFloat(this.goods.goods_price) && parseFloat(this.goods
						.goods_marketprice) > 0) {
					uni.showToast({
						icon: 'none',
						title: '市场价不能小于价格'
					})
					return
				}
				if (isNaN(this.goods.goods_storage) || this.goods.goods_storage < 0) {
					uni.showToast({
						icon: 'none',
						title: '请检查库存'
					})
					return
				}
				if (this.goods.goods_weight && (isNaN(this.goods.goods_weight) || this.goods.goods_weight < 0)) {
					uni.showToast({
						icon: 'none',
						title: '请检查重量'
					})
					return
				}
				if (this.goods.goods_storage_alarm && (isNaN(this.goods.goods_storage_alarm) || this.goods
						.goods_storage_alarm < 0)) {
					uni.showToast({
						icon: 'none',
						title: '请检查库存预警值'
					})
					return
				}
				this.goods.goods_discount = parseInt(this.goods.goods_price / this.goods.goods_marketprice * 100)
				var sp_val = {}
				for (var i in this.sp_val) {
					sp_val[i] = {}
					for (var j in this.sp_val[i]) {
						sp_val[i][this.sp_val[i][j]] = this.spec_json[i][this.sp_val[i][j]].spvalue_name
					}
				}
				if (this.ifFixedFreight) {
					this.goods.transport_id = 0
				}
				var spec = {}
				if (this.specArray) {
					for (i in this.specArray.spvalue_key) {
						spec[this.specArray.spvalue_key[i]] = this.spec[this.specArray.spvalue_key[i]]
					}
				}
				goodsSave(this.controller, this.class_id, this.commonid, this.goods, this.bodyList, this.sgcate_id, spec,
					this.sp_name, sp_val, this.selectAttr, this.g_fccount, this.g_fcprefix).then(res => {
					if (!this.commonid) {
						uni.redirectTo({
							url: '/pages/seller/goods/GoodsForm3' + '?' + urlencode({
								commonid: res.result.commonid,
								action: this.action
							})
						})
					}
					uni.showToast({
						icon: 'none',
						title: res.message
					})
				}).catch(error => {
					uni.showToast({
						icon: 'none',
						title: error.message
					})
				})
			},
			openVideo(src) {
				this.showVideo = src
				this.showPopup('isVideo')
			},
			uploadVideo(event) {
				let files = event.tempFiles[0]
				if (typeof(files) === 'undefined') {
					return
				}
				var formdata = {
					filePath: files.path,
					name: 'file',
					id: 'file'
				}
				uni.showLoading({
					title: '加载中'
				})
				uploadVideo(this.controller, formdata).then(res => {
					this.goods.goodsvideo_name = res.result.path
					this.goods.goodsvideo_url = res.result.url
					this.$forceUpdate()
					uni.hideLoading()
				}).catch(function(error) {
					uni.showToast({
						icon: 'none',
						title: error.message
					})
					uni.hideLoading()
				})
			},
			openImage(src) {
				this.showimage = src
				this.showPopup('isshow')
			},
			dropImage() {
				this.goods.goods_image = ''
			},
			useCrop(res) {
				let type = this.cropType
				var formdata = {
					filePath: res.url,
					name: 'file',
				}
				uni.showLoading({
					title: '加载中'
				})
				uploadInfoFile(this.controller, formdata).then(res => {
					if (type == 'goods_image') {
						this.goods.goods_image = res.result.path
						this.goods.goods_image_url = res.result.url
					} else {
						this.bodyItem.value = res.result.url
						this.bodyItem.value_url = res.result.url
						this.hidePopup('bodyEditVisible')
					}
					this.imageValue[type] = [{
						name: 'file',
						extname: 'jpg',
						url: res.result.url
					}]
					this.cropperOption.imgUrl = ''
					this.$forceUpdate()
					uni.hideLoading()
				}).catch((error) => {
					uni.showToast({
						icon: 'none',
						title: error.message
					})
					uni.hideLoading()
					this.cropperOption.imgUrl = ''
					this.$forceUpdate()
				})
			},
			cropReady() {
				this.cropperOption.img = this.cropperOption.imgUrl
			},
			cropBack() {
				this.cropperOption.imgUrl = ''
				this.$forceUpdate()
			},
			uploadImage(index, event) {
				let that = this
				this.cropType = index
				let file = event.tempFiles[0]
				that.cropperOption.imgUrl = file.path
				that.cropperOption.autoCropWidth = uni.getSystemInfoSync().windowWidth
				that.cropperOption.autoCropHeight = uni.getSystemInfoSync().windowWidth
				that.cropperOption.maxImgSize = uni.getSystemInfoSync().windowHeight - 40
				that.$forceUpdate()
			},
		}
	}
</script>
<style lang="scss">
	.goods-form-2 {
		input[readonly] {
			color: #999
		}

		.mint-radiolist {
			display: flex;

			.mint-cell {
				flex: 1;

				.mint-radio-input:checked+.mint-radio-core {
					background-color: #ff9900 !important;
					border-color: #ff9900 !important;
				}

				&:after {
					display: none
				}
			}
		}
	}
</style>
<style scoped lang="scss">
	.file-uploader {
		position: relative;

		.file {
			position: absolute;
			top: 0;
			right: 0;
			left: 0;
			bottom: 0;
			opacity: 0
		}
	}

	.file-wrapper {
		display: inline-block;
		padding: .5rem;
		position: relative;
		border: 1px solid #e1e1e1;

		.file-name {
			font-size: $fontSize
		}

		.file-btn {
			font-size: $fontSize;
			position: absolute;
			top: 0;
			right: 0
		}
	}

	.card-wrapper {
		padding: 1rem;

		.card-notice {
			font-size: $fontSize;
			padding-bottom: 1rem;
		}

		.card-textarea {
			width: 100%;
			height: 10rem
		}
	}

	.block-wrapper {
		padding: 0 $pageSpace
	}

	.common-header {
		.btn {
			background: #000;
			color: #fff;
			box-shadow: 0px 2px 4px #d2d2d2;
		}
	}

	.main-content {
		background: #fff;
		padding: 0 $pageSpace
	}

	.close-btn {
		position: absolute;
		top: .5rem;
		right: .5rem;
		z-index: 100
	}

	.container {
		background: #fff;

		.label {
			padding: .5rem $pageSpace;
			font-size: $subFontSize;
			background: #eee;
		}

		.user-avatar-wrapper {
			display: inline-block;
			vertical-align: top;
			margin-right: .5rem;
			margin-bottom: .5rem
		}

		.user-avatar-wrapper .del-btn {
			position: absolute;
			bottom: .2rem;
			right: .2rem
		}

		.btn-wrapper {
			display: flex;

			.btn {
				flex: 1
			}
		}

		.body-list {
			.body-item {
				padding: 1rem;
				position: relative;
				min-height: 2.2rem;
				font-size: $fontSize;

				.img {
					max-width: 100%
				}

				.btn-list {
					text-align: right;
					background: rgba(0, 0, 0, .5);
					position: absolute;
					top: .5rem;
					bottom: .5rem;
					left: .5rem;
					right: .5rem;
					padding: .5rem;
					box-sizing: border-box;

					.i {
						font-size: 1.2rem;
						margin-left: .5rem;
						color: #fff;
					}
				}
			}
		}

		.middle-popup {
			width: 80%
		}

		.brand-list {
			.h2 {
				line-height: 2rem;
				font-size: $subFontSize;
				padding-left: .5rem;
				font-weight: 700;
			}

			.ul {
				overflow: hidden;
				border-top: 1px solid #f6f6f9
			}

			.li {
				box-sizing: border-box;
				text-align: center;
				width: 25%;
				padding-bottom: 20%;
				float: left;
				border-bottom: 1px solid #f6f6f9;
				border-right: 1px solid #f6f6f9;
				position: relative;

				.p-img {
					position: absolute;
					top: .5rem;
					bottom: .5rem;
					right: .5rem;
					left: .5rem;
					background-size: contain;
					background-position: center;
					background-repeat: no-repeat;
				}

			}

			.li:nth-child(4n) {
				border-right: 0;
			}
		}
	}

	.toolbar {
		height: 2rem;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		background-color: #f0f2f5;

		.toolbar-item {
			font-size: $fontSize;
			border: none;
			border-radius: 0;
			background-color: #f0f2f5;
		}

		.cancel-item {
			margin-left: 0.5rem;
			color: #4e545d;
		}

		.confirm-item {
			margin-right: 0.5rem;
			color: red;
		}

		.picker-header {
			color: #4e545d;
			line-height: 2rem;
			font-size: $h2;
		}
	}

	.popup-content {
		padding: 0 40rpx;
		height: 300rpx;
	}

	.popup-item-wrapper {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.popup-item {
		font-size: 30rpx;
		line-height: 80rpx;
		text-align: center;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
</style>