<template>
	<div class="content-height">
		<div class="myorder-content">
			<div class="contain-page">
				<div class="content-top">
					<topCrumbs :firstCrumbs="firstCrumbs" :secondCrumbs="secondCrumbs" :thirdCrumbs="thirdCrumbs" :backIsShow="backIsShow"></topCrumbs>
					<div class="r mb10 mt10">
						<el-dropdown @command="translationClick">
							<el-button type="info">
								一键翻译<i class="el-icon-arrow-down el-icon--right"></i>
							</el-button>
							<el-dropdown-menu slot="dropdown">
								<el-dropdown-item command='1'>中文->英文</el-dropdown-item>
							</el-dropdown-menu>
						</el-dropdown>
						<el-button class="ml10" v-if="currentType!=3&&$_has('delete')" @click="clearUnitRespDTOListClick" type="info">
							清空变种信息
						</el-button>
						<button class="button btn-orange ml10" type="button" @click="saveAllClick" v-if="currentType!=3||!id&&$_has('add')">保　存</button>
						<button class="button btn-orange ml10" type="button" @click="handleClick(3)" v-if="currentType==1&&id&&$_has('publishP')">移入待发布</button>
						<el-dropdown v-if="(currentType!=3||!id)&&$_has('publishP')" @command="handleClick">
							<el-button type="success" class="ml10">
								发  布<i class="el-icon-arrow-down el-icon--right"></i>
							</el-button>
							<el-dropdown-menu slot="dropdown">
								<el-dropdown-item command='1'>立即发布</el-dropdown-item>
								<el-dropdown-item command=2>定时发布</el-dropdown-item>
							</el-dropdown-menu>
						</el-dropdown>
						<el-button class="ml10" type="success" v-if="currentType==3&&id&&$_has('publishP')" @click="saveAllClick">
							更新至Wish
						</el-button>
					</div>
					<div class="product-info-module mb20">
						<div class="product-info-module-tab">基本信息
						</div>
						<div class="product-info-module-content onlineProductInfo">
							<table class="source-tab">
								<tbody>
										<tr v-if="!id">
											<td class="firstTd"><span class="f-red">*</span>店铺：</td>
											<td class="no-flex">
												<el-checkbox v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
													<el-checkbox-group v-model="checkedCities" @change="handleShopChange" style="margin-top:8px;display:inline-block;margin-left:5px">
														<el-checkbox v-for="shop in shopAccount" :label="shop.id" :key="shop.id">
															<span style="width:160px;display: inline-block;overflow:auto;vertical-align: bottom;">{{shop.name}}</span>
														</el-checkbox>
												</el-checkbox-group>
											</td>
										</tr>
										<tr>
											<td class="firstTd"><span class="f-red">*</span>SPU：</td>
											<td class="no-flex">
												 <el-input placeholder="可接受:BG00003GG" size="small" v-model="spu"></el-input>
											</td>
										</tr>
										<tr>
											<td class="firstTd">产品标题：</td>
											<td class="no-flex">
												 <el-input placeholder="可接受:Nikon D5100 DSLR Camera (Body Only) USA MODEL" size="small" v-model="title" @input="titleToUpperCase"></el-input>
											</td>
										</tr>
										<tr>
											<td class="firstTd">产品描述：</td>
											<td class="no-flex">
												<el-input type="textarea" :rows="8" placeholder="可接受:Nikon D5100 DSLR Camera (Body Only) USA MODEL" v-model="description"></el-input>
											</td>
										</tr>
										<tr>
											<td class="firstTd">产品标签：</td>
											<td class="no-flex">
												<div class="label-show">
													<div class="label-tags" v-for="(item,index) in tags" :key="index">
														<span>{{item}}</span>
														<i class="el-icon-close poi" @click="deleteLabel(index)"/>
													</div>
												 <input placeholder="请输入标签名，输入回车完成添加,标签数不能少于两个" class="label-input" @keyup.enter="addLabel" v-model="labelValue"/>
												</div>
											</td>
										</tr>
										<tr>
											<td class="firstTd"></td>
											<td class="no-flex">
												<el-dropdown @command="translationClick">
													<el-button type="primary">
														一键翻译<i class="el-icon-arrow-down el-icon--right"></i>
													</el-button>
													<el-dropdown-menu slot="dropdown">
														<el-dropdown-item command='1'>中文->英文</el-dropdown-item>
													</el-dropdown-menu>
												</el-dropdown>
												<!-- <el-button type="primary">仿品检测</el-button> -->
											</td>
										</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="product-info-module mb20">
						<div class="product-info-module-tab">{{jieziman?'智链互联':'红茄'}}信息<span class="gray-nine ml10">(注：下列信息，仅在此系统生效)</span>
						</div>
						<div class="product-info-module-content onlineProductInfo" style='overflow: inherit;'>
							<table class="source-tab">
								<tbody>
										<tr>
											<td class="firstTd">{{jieziman?'智链互联':'红茄'}}分类</td>
											<td class="secondTd">
												<div style="position:relative">
													<div class="tree-select poi" @click="treeShow=!treeShow">{{classificationType?classificationType:'请选择分类'}}</div>
													<div class="tree-data" v-if="treeShow">
														<el-tree
															:data="treeData"
															node-key="id"
															ref="tree"
															highlight-current
															@current-change="SwitchNode"
														>
														</el-tree>
													</div>
												</div>
												<!-- <i class="fa fa-plus fa-lg ml10 icon-color poi" @click="dialogVisible=true"></i>
												<span class="icon-color ml5 poi f14" @click="dialogVisible=true">管理分类</span> -->
											</td>
										</tr>
										<tr v-for="(item,index) in productFromUrl" :key="index">
											<td class="firstTd">{{index==0?"来源URL：":''}}</td>
											<td class="secondTd">
												<el-input placeholder="用于记录供货渠道URL，方便采购。仅在此系统显示，不会同步到wish平台！" v-model="productFromUrl[index]" size="small">
													<template slot="prepend">{{index+1}}</template>
													<template slot="append">
														<span class="opera-span" @click="visitUrlClick(productFromUrl[index])">访问</span>
													</template>
												</el-input>
												<i class="fa fa-plus fa-lg ml10 icon-color poi" @click="addSource" v-if="index==0"></i>
												<i class="fa fa-remove fa-lg ml10 poi" v-if="index!=0" @click="removeSource(index)"></i>
											</td>
										</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="product-info-module mb20" v-if="!id && checkedCities.length === 0">
						<div class="product-info-module-tab">运费设置
						</div>
						<div class="product-info-module-tab2">未选择店铺，无法进行运输设置
						</div>
					</div>
					<div class="product-info-module mb20" v-if="(currentType != 3 && templateTableData[0].shop) || (!id && checkedCities.length > 0)">
						<div class="product-info-module-tab">运费设置
						</div>
						<div class="product-info-module-content onlineProductInfo" style='overflow: inherit;'>
							<table class="source-tab">
								<tbody>
										<tr>
											<el-select v-model="templateValue" placeholder="选择模板" size="small" class="mb10" @change="templateSelect" :disabled="shopChoose.length>0?false:true">
												<el-option
													v-for="item in templateOptions"
													:key="item.value"
													:label="item.label"
													:value="item.value">
												</el-option>
											</el-select>
											<el-table
												ref="multipleTableTemplate"
												:data="templateTableData"
												tooltip-effect="dark"
												border
												style="width: 100%"
												@selection-change="handleShopChangeClick">
												<el-table-column
													type="selection"
													width="55">
												</el-table-column>
												<el-table-column
													label="店铺"
													prop="shop"
												>
												</el-table-column>
												<el-table-column
													prop="countrys"
													label="设置情况"
												>
												</el-table-column>
												<el-table-column
													prop="address"
													label="操作"
												>
													<template slot-scope="scope">
														<div class="el-dropdown-link" @click="setTemplateClick">设置</div>
														<div>
														<el-dropdown>
															<span class="el-dropdown-link">
																更多<i class="el-icon-arrow-down el-icon--right"></i>
															</span>
															<el-dropdown-menu slot="dropdown">
																<el-dropdown-item @click.native="clearSetClick">清空设置</el-dropdown-item>
															</el-dropdown-menu>
														</el-dropdown>
													</div>
													</template>
												</el-table-column>
											</el-table>
										</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="product-info-module mb20" v-if="currentType!=3||!id">
						<div class="product-info-module-tab">价格和运送
							<el-popover
								v-model="visibleParities"
								placement="bottom"
								width="100"
								trigger="hover">
								<div class="parities-change">
									<div class="poi" @click="priceChangeClick(3)">USD转换CNY</div>
									<div class="poi" @click="priceChangeClick(4)">CNY转换USD</div>
									<div style="background:#eee">汇率:<el-input placeholder="5-7" size="mini" v-model="paritiesVal" style="width:80px"/></div>
								</div>
								<span slot="reference" class="icon-color r poi">价格转换<i class="el-icon-arrow-down el-icon--right"/></span>
							</el-popover>
						</div>
						<div class="product-info-module-content onlineProductInfo">
							<table class="source-tab">
								<tbody>
										<tr>
											<td class="firstTd">价格(USD)：</td>
											<td class="no-flex">
												<el-input-number controls-position="right" type="number" :min="0" placeholder="可接受:90.99，货币单位为「美元」" v-model="sellPriceUs" size="small" class="sku-length mr10">
												</el-input-number>
												<el-tooltip content="将在 Wish.com 上显示的产品价格，不包含其它文字。这是顾客为产品支付的金额。" placement="top" effect="light">
													<i class="el-icon-question"/>
												</el-tooltip>
												<span class="cny-price">本地价格(CNY)：</span>
												<el-input-number controls-position="right" type="number" :min="0"  placeholder="可接受:4.00" v-model="sellPriceCn" size="small" class="sku-length mr10">
												</el-input-number>
												<el-tooltip content="以本币核算的产品价格。用户按照您的本币核算金额为这个产品支付货款。当地货币请参照您的当地货币代码，可在货币设置中找到。" placement="top" effect="light">
													<i class="el-icon-question"/>
												</el-tooltip>
											</td>
										</tr>
										<tr>
											<td class="firstTd">运费：</td>
											<td class="no-flex">
												<el-input-number controls-position="right" type="number" :min="0"  placeholder="可接受:4.00，货币单位为「美元」" v-model="freightPriceUs" size="small" class="sku-length mr27">
												</el-input-number>
												<span class="cny-price">本地运费(CNY)：</span>
												<el-input-number controls-position="right" type="number" :min="0" placeholder="可接受:90.99" v-model="freightPriceCn" size="small" class="sku-length mr10">
												</el-input-number>
												<el-tooltip content="用当地货币核算的预估组运费。当地货币请参照您的当地货币代码，可在货币设置中找到。" placement="top" effect="light">
													<i class="el-icon-question"/>
												</el-tooltip>
											</td>
										</tr>
										<tr>
											<td class="firstTd">库存：</td>
											<td class="no-flex">
												<el-input-number controls-position="right" type="number" :min="1" placeholder="可接受:10" v-model="stock" size="small" class="sku-length mr27">
												</el-input-number>
												<span class="cny-price">运送时间：</span>
												<el-popover
												 	v-model="visible"
													placement="bottom"
													width="450"
													trigger="click">
													<div class="choose-send-time">选择运送时间</div>
													<el-button class="date-button" type="primary" size="small" v-for="(item,index) in dateArry" :key="index" @click="getCurrentDate(item)">{{item}}</el-button>
													<el-radio v-model="radioVal" label="1" class="ml10" @change="chooseDataClick">其它</el-radio>
													<el-input-number controls-position="right" type="number" :min="1" v-model="deliveryMin" :disabled="radioVal? false:true" style="width:90px" size="small"/>
													-
													<el-input-number controls-position="right" type="number" :min="1" v-model="deliveryMax" :disabled="radioVal? false:true" style="width:90px" size="small"/>
													<div style="text-align: right; margin: 0">
														<el-button size="mini" @click="visible = false">取消</el-button>
														<el-button type="primary" size="mini" @click="sureDateClick">确定</el-button>
													</div>
													<el-button slot="reference" class="choose-data">{{deliveryTime}}<i class="fa fa-sort-desc icon-edit"/></el-button>
												</el-popover>
											</td>
										</tr>
										<tr>
											<td class="firstTd">MSRP：</td>
											<td class="no-flex">
												<el-input-number controls-position="right" type="number" :min="0"  placeholder="可接受:100.99， 货币单位为「美元」" v-model="msrpPrice" size="small" class="sku-length mr10">
												</el-input-number>
												<el-tooltip content="制造商的建议零售价。建议填写此字段，因为它将在 Wish 的产品销售价格上方显示为带删除线的价格。" placement="top" effect="light">
													<i class="el-icon-question"/>
												</el-tooltip>
											</td>
										</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="product-info-module mb20">
						<div class="product-info-module-tab">图片信息</div>
						<div class="product-info-module-content onlineProductInfo">
							<table class="source-tab">
								<tbody>
										<tr>
											<td class="firstTd" style="max-width:300px;vertical-align: top;">
												<div style="border:1px solid #cccccc">
												<div :class="(mainImageUrl&&mainImageUrl.hd)? 'background-mainPhoto clean':'background-mainPhoto'">
													<img :src="mainImageUrl&&mainImageUrl.url" class="imgCss"/>
												</div>
												<div class="tl pl5">
													<span class="f-blue poi" @click="setHDClick(100)">HD</span>
												</div>
												</div>
											</td>
											<td>
												<div class="icon-color poi picture-show">
													<div class="l">
														<el-upload
															:limit="id?20-variantImageUrlsData:21-variantImageUrlsData"
															:on-exceed="handleExceed"
															:http-request="(file)=>{return uploadFile(file,1,1)}"
															:data="dataObj"
															class="avatar-uploader"
															multiple
															:show-file-list="false"
                              :before-upload="beforeAvatarUpload"
														>
															<el-button class="button btn-primary ml10">
																选择本地图片
															</el-button>
														</el-upload>
													</div>
													<div class="r poi" @click="downZipClick">
														<i class="fa fa-download fa-lg icon-color mr5"></i>导出全部图片
													</div>
													<div style="clear:both">
														<span class="img-remark">说明！</span>
														<span class="gray-nine ml10">「附图和变种图最多选用<span class="f-red">20</span>张， 附图选用了<span class="g19">0</span>张，变种图选用了<span class="g19">0</span>张」</span>
													</div>
													<div class="img-show">
														<div class="imgDivOut" v-for="(item,index) in variantImageUrls" :key="index">
															<div :class="item.hd?'img-border clean':'img-border'">
																<img :src="item.url" class="imgDivIn"/>
																<div class="imgSize">{{item.width}} X {{item.height}}</div>
															</div>
															<div class="imgDivDown">
																<i class="el-icon-s-home poi" @click="setMainPhotoClick(index)"/>
																<span class="f-blue poi" @click="setHDClick(index)">HD</span>
																<i class="el-icon-delete poi" @click="removeImgClick(index)"/>
															</div>
														</div>
													</div>
												</div>
											</td>
										</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="product-info-module mb20">
						<div class="product-info-module-tab">颜色信息</div>
						<div class="product-info-module-content onlineProductInfo">
							<table class="source-tab">
								<tbody>
									<tr>
										<div class="pt20 pb20">
											<el-checkbox-group v-model="colorCode" @change="handleCheckedCitiesChange">
													<el-checkbox v-for="(item,index) in colorArry" :key="index" :label="item.code" >
														<div :class="item.code=='White'||item.code=='Cream'||item.code=='Khaki'||item.code=='Beige'||item.code=='Yellow'?'checkbox-color g0':'checkbox-color color-ful'" :style="{'background': item.value}" v-if="!item.customColors">{{item.name}}</div>
														<div class="mb5 checkbox-width" v-else>
															<el-input style="width:100px" size="small" v-model="item.name"></el-input>
															<i class="fa fa-floppy-o" @click.stop.prevent="customEditClick(index,1)" v-if="item.isEdit"></i>
															<i class="el-icon-close" v-if="item.isEdit" @click.stop.prevent="customDelClick(index,1)"></i>
															<i class="el-icon-edit" @click.stop.prevent="customEditClick(index,1)" v-else></i>
														</div>
													</el-checkbox>
											</el-checkbox-group>
											<div class="mt10">
												<el-input v-model="sizeInput" placeholder="可接受:其它颜色的英文单词" style="width:200px" size="small"></el-input>
													<el-button type="primary" size="small" @click="addClick(1)">添加</el-button>
												<span class="img-remark">说明！</span>
												<span class="gray-nine">请务必按要求添加！双色支持格式：black&white；单色请参考：<a href="http://merchant.wish.com/documentation/colors" target="_blank" class="icon-color">wish官方颜色列表&gt;&gt;</a></span>
											</div>
											<div class="mt10" v-if="isColorClick">
												<span class="gray-nine"><span class="gf5">颜色无效！</span>单色请参考：<a href="http://merchant.wish.com/documentation/colors" target="_blank" class="icon-color">wish官方颜色列表&gt;&gt;</a>; 双色支持格式：black&white；</span>
											</div>
										</div>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="product-info-module mb20">
						<div class="product-info-module-tab">尺寸信息</div>
						<div class="product-info-module-content onlineProductInfo">
							<table class="source-tab">
								<tbody>
										<tr>
											<div class="pt20 pb20">
													<div :class="typeCode==item.code?'btn-size':'noCss'" v-for="(item,index) in typeArry" :key="index" @click="chooseSize(item.code)">{{item.name}}</div>
											</div>
											<dynamicTable :table-data="mulTableData" :table-header="tableConfig" :sizeCode="sizeCode" @getCurrentSize="handleSelectionChange" v-if="mulTableData&&mulTableData.length>0" :tableShow="tableShow"></dynamicTable>
											<div v-if="!tableShow">
												<el-checkbox-group v-model="otherSizeCodeNew" @change="handleSizeChange" class="checkbox-flex" >
													<el-checkbox v-for="(item,index) in otherSizeCode" :key="index" :label="item.name">
														<div class="checkbox-width" v-if="typeCode!='custom'">{{item.name}}</div>
														<div class="mb5 checkbox-width" v-else>
															<el-input style="width:100px" size="small" v-model="item.name"></el-input>
															<i class="fa fa-floppy-o" @click.stop.prevent="customEditClick(index,2)" v-if="item.isEdit"></i>
															<i class="el-icon-close" v-if="item.isEdit" @click.stop.prevent="customDelClick(index,2)"></i>
															<i class="el-icon-edit" @click.stop.prevent="customEditClick(index,2)" v-else></i>
														</div>
													</el-checkbox>
												</el-checkbox-group>
											</div>
											<div v-if="typeCode=='custom'">
												<div class="mb10">例子：Hardcover，Cookies & Cream，12-Pack (max 50 characters)</div>
												其它：
												<el-input v-model="customInput" style="width:200px" size="small"></el-input>
												<el-button type="primary" size="small" @click="addClick(2)">添加</el-button>
											</div>
										</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="product-info-module mb20">
						<div class="product-info-module-tab">变种信息
							<el-popover
								v-model="visibleParities"
								placement="bottom"
								width="100"
								trigger="hover">
								<div class="parities-change">
									<div class="poi" @click="priceChangeClick(1)" v-if="$_has('edit')">USD转换CNY</div>
									<div class="poi" @click="priceChangeClick(2)" v-if="$_has('edit')">CNY转换USD</div>
									<div style="background:#eee">汇率:<el-input placeholder="5-7" size="mini" v-model="paritiesVal" style="width:80px"/></div>
								</div>
								<span slot="reference" class="icon-color r poi">价格转换<i class="el-icon-arrow-down el-icon--right"/></span>
							</el-popover>
						</div>
						<div class="r mt10 mb10 mr10">
							<el-tooltip content="变种图片为非必填，没有特殊需求不建议设置变种图片。" placement="bottom" effect="light">
								<el-checkbox v-model="checkedImg">显示变种图片</el-checkbox>
							</el-tooltip>
						</div>
						<div class="product-info-module-content onlineProductInfo">
							<table class="source-tab">
								<tbody>
									<tr>
										<el-table
											border
											:data="unitRespDTOList"
											style="width: 100%">
											<el-table-column
												v-if="currentType==3"
												align="center"
												label="状态"
												width="35">
												<template slot-scope="scope">
													<div :class="scope.row.publishStatus?'g19':'f-red'">{{scope.row.publishStatus?'成功':scope.row.publishStatus==false?'失败':''}}</div>
												</template>
											</el-table-column>
											<el-table-column
												v-if="checkedImg"
												align="center">
												<template slot="header" slot-scope="scope">
													<div>图片</div>
													<div class="icon-color poi" @click="deleteImgAllClick">(清空)</div>
												</template>
												<template slot-scope="scope">
													<el-upload
														:http-request="(file)=>{return uploadFile(file,scope.$index,2)}"
														:data="dataObj"
														class="avatar-uploader"
														:show-file-list="false"
													>
														<div class="rel">
															<img :src="scope.row.mainImageUrl" v-if="scope.row.mainImageUrl" class="mainImage-Url"/>
															<i class="el-icon-plus" v-else></i>
															<i class="el-icon-error abs" @click.stop="deleteImgClick(scope.$index)" v-if="scope.row.mainImageUrl"></i>
														</div>
													</el-upload>
												</template>
											</el-table-column>
											<el-table-column
												align="center">
												<template slot="header" slot-scope="scope">
													<div>sku</div>
													<div class="icon-color poi" @click="generationClick">(一键生成)</div>
												</template>
												<template slot-scope="scope">
														<el-input size="small" v-model="scope.row.sku"/>
												</template>
											</el-table-column>
											<el-table-column
												align="center"
												:label="!sourceType?'尺寸':'平台尺寸'"
											>
												<template slot-scope="scope">
													<span v-if="!sourceType">{{scope.row.sizeCode}}</span>
													<el-input v-model="scope.row.sizeCode" size="small" v-else></el-input>
												</template>
											</el-table-column>
											<el-table-column
												align="center"
												:label="!sourceType?'颜色':'平台颜色'"
											>
												<template slot-scope="scope">
													<span v-if="!sourceType">{{scope.row.colorCode}}</span>
													<el-input v-model="scope.row.colorCode" size="small" v-else @change="(value)=>{return checkColorClick(value,scope.$index)}"></el-input>
												</template>
											</el-table-column>
											<el-table-column
												v-if="sourceType==1"
												align="center"
												label="系统尺寸"
												prop="sysSize"
											>
											</el-table-column>
											<el-table-column
												v-if="sourceType==1"
												align="center"
												label="系统颜色"
												prop="sysColor"
											>
											</el-table-column>
											<el-table-column
											width="135"
											align="center">
												<template slot="header" slot-scope="scope">
													<div>MSRP（$）</div>
													<div class="icon-color poi" @click="updateDataClick('msrpPrice')" v-if="$_has('edit')">{{currentType!=3?'(更新)':'(修改)'}}</div>
												</template>
												<template slot-scope="scope">
														<!-- <el-input placeholder="" size="small" v-model="scope.row.msrpPrice"/> -->
														<el-input-number controls-position="right" type="number" :min="0" v-model="scope.row.msrpPrice" size="small">
														</el-input-number>
												</template>
											</el-table-column>
											<el-table-column
												width="135"
												align="center"
											>
												<template slot="header" slot-scope="scope">
												<div>价格（USD）</div>
												<div class="icon-color poi" @click="updateDataClick('sellPriceUs')" v-if="$_has('edit')">{{currentType!=3?'(更新)':'(修改)'}}</div>
												</template>
												<template slot-scope="scope">
														<!-- <el-input placeholder="" size="small" v-model="scope.row.sellPriceUs"/> -->
														<el-input-number controls-position="right" type="number" :min="0" v-model="scope.row.sellPriceUs" size="small">
														</el-input-number>
												</template>
											</el-table-column>
											<el-table-column
												align="center"
												width="135"
											>
												<template slot="header" slot-scope="scope">
												<div>本地价格</div>
												<div class="icon-color poi" @click="updateDataClick('sellPriceCn')" v-if="$_has('edit')">{{currentType!=3?'(更新)':'(修改)'}}</div>
												</template>
												<template slot-scope="scope">
														<!-- <el-input placeholder="" size="small" v-model="scope.row.sellPriceCn"/> -->
														<el-input-number controls-position="right" type="number" :min="0" v-model="scope.row.sellPriceCn" size="small">
														</el-input-number>
												</template>
											</el-table-column>
											<el-table-column
												width="135"
												align="center"
											>
												<template slot="header" slot-scope="scope">
												<div>库存</div>
												<div class="icon-color poi" @click="updateDataClick('stock')" v-if="$_has('edit')">{{currentType!=3?'(更新)':'(修改)'}}</div>
												</template>
												<template slot-scope="scope">
														<!-- <el-input placeholder="" size="small" v-model="scope.row.stock"/> -->
														<el-input-number controls-position="right" type="number" :min="0" v-model="scope.row.stock" size="small">
														</el-input-number>
												</template>
											</el-table-column>
											<el-table-column
												align="center"
												width="180"
											>
												<template slot="header" slot-scope="scope">
												<div>运输时间</div>
												<div class="icon-color poi" @click="updateDataClick('deliveryMin')" v-if="$_has('edit')">{{currentType!=3?'(更新)':'(修改)'}}</div>
												</template>
												<template slot-scope="scope">
														<el-input size="small" style="width:80px;" v-model="scope.row.deliveryMin"/>-<el-input size="small" style="width:80px;" v-model="scope.row.deliveryMax"/>
												</template>
											</el-table-column>
											<el-table-column
											width="60"
											v-if="currentType==3"
											align="center">
												<template slot="header" slot-scope="scope">
													<div>上架</div>
													<el-dropdown @command="handleClickUpDown">
														<span class="el-dropdown-link icon-color">批量<i class="el-icon-arrow-down el-icon--right"></i></span>
														<el-dropdown-menu slot="dropdown">
															<el-dropdown-item command="1">全部上架</el-dropdown-item>
															<el-dropdown-item command="2">全部下架</el-dropdown-item>
														</el-dropdown-menu>
													</el-dropdown>
												</template>
												<template slot-scope="scope">
														<el-checkbox v-model="scope.row.ifShelf"></el-checkbox>
												</template>
											</el-table-column>
											<el-table-column
												align="center"
												label="操作"
												width="80"
											>
												<template slot-scope="scope">
														<el-button class="el-dialog__header" @click="removeClick(scope.$index)" :disabled="currentType!=3||(currentType==3&&scope.row.remove)?false:true" v-if="$_has('delete')">移除</el-button>
												</template>
											</el-table-column>
									</el-table>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="r mb10">
						<el-dropdown @command="translationClick">
							<el-button>
								一键翻译<i class="el-icon-arrow-down el-icon--right"></i>
							</el-button>
							<el-dropdown-menu slot="dropdown">
								<el-dropdown-item command='1'>中文->英文</el-dropdown-item>
							</el-dropdown-menu>
						</el-dropdown>
						<el-button class="ml10" v-if="currentType!=3&&$_has('delete')" @click="clearUnitRespDTOListClick">
							清空变种信息
						</el-button>
						<button class="button btn-orange ml10" type="button" @click="saveAllClick" v-if="currentType!=3||!id&&$_has('add')">保　存</button>
						<button class="button btn-orange ml10" type="button" @click="handleClick(3)" v-if="currentType==1&&id&&$_has('publishP')">移入待发布</button>
						<el-dropdown v-if="currentType!=3||!id&&$_has('publishP')" @command="handleClick">
							<el-button type="success" class="ml10">
								发  布<i class="el-icon-arrow-down el-icon--right"></i>
							</el-button>
							<el-dropdown-menu slot="dropdown">
								<el-dropdown-item command="1">立即发布</el-dropdown-item>
								<el-dropdown-item command="2">定时发布</el-dropdown-item>
							</el-dropdown-menu>
						</el-dropdown>
						<el-button class="ml10" type="success" v-if="currentType==3&&id&&$_has('publishP')" @click="saveAllClick">
							更新至Wish
						</el-button>
					</div>
				</div>
			</div>
			<anchor :stepsArr="stepsArr"></anchor>
		</div>
		<el-dialog
				title="管理分类"
				:visible.sync="dialogVisible"
				width="600px"
				:before-close="handleClose">
				<div class="pl20">
					<div class="block">
						<el-tree
							:data="treeData"
							node-key="id"
							default-expand-all
							@current-change="SwitchNode"
							:expand-on-click-node="false">
							<span class="custom-tree-node" slot-scope="{ node, data }">
								<span v-if="!data.edit">{{ node.label }}</span>
								<span  v-else @click.stop><el-input v-model="data.label" size="mini" style="width:200px"/></span>
								<span v-if="node.label!='未分类'">
									<el-button
										type="text"
										size="mini"
										@click="() => append(data)">
										<i class="el-icon-plus add-type"/>
									</el-button>
									<el-button
									 	v-if="node.label!='所有分类'"
										type="text"
										size="mini"
										@click.stop="() => edit(node,data)">
										<i class="el-icon-edit-outline add-type edit-type"/>
									</el-button>
									<el-button
									 	v-if="node.label!='所有分类'"
										type="text"
										size="mini"
										@click.stop="() => remove(node, data)">
										<i class="el-icon-close add-type delete-type"/>
									</el-button>
								</span>
							</span>
						</el-tree>
					</div>
				</div>
				<span slot="footer" class="dialog-footer">
					<el-button type="primary" @click="sureTypeClick">确 定</el-button>
				</span>
		</el-dialog>
		<el-dialog
			title="发布"
			:visible.sync="dialogVisibleReleased"
			width="50%"
			@close="dialogVisibleReleased = false">
			<div v-if="currentType==1||!id">
				<span>选择Wish店铺：</span>
				<el-checkbox v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
				<el-input
					@input="searchShopClick"
					size="mini"
					style="width:200px;float:right"
					placeholder="请输入店铺名称"
					suffix-icon="el-icon-search"
					v-model="shopName">
				</el-input>
				<el-checkbox-group v-model="checkedCities" @change="handleShopChange" class="shop-list">
					<el-checkbox v-for="shop in shopAccount" :label="shop.id" :key="shop.id" class="current-shop">{{shop.name}}</el-checkbox>
				</el-checkbox-group>
			</div>
			<div class="mt20" v-if="command==2||(!id&&command==2)">
				<span>定时发布时间：</span>
				<el-date-picker
					size="small"
					v-model="publishDate"
					type="datetime"
					:picker-options="pickerOptions"
					placeholder="选择日期时间">
				</el-date-picker>
			</div>
			<el-divider></el-divider>
			<span slot="footer" class="dialog-footer">
				<el-button type="primary" @click="chooseShopClick">确 定</el-button>
				<el-button @click="dialogVisibleReleased = false">取 消</el-button>
			</span>
		</el-dialog>
		<el-dialog
			:title="currentChangeType!='deliveryTime'?'修改价格':'批量修改运送时间'"
			:visible.sync="dialogVisiblePrice"
			width="40%"
			@close="cancelClick">
			<div class="modal-price" v-if="currentChangeType!='deliveryTime'">
				<el-radio v-model="radio" label="1">在原有数量上增加(减少用负数)</el-radio>
				<el-input v-model="editPriceAdd" style="width:35%" type="number"/>
			</div>
			<div class="mt20 modal-price" v-if="currentChangeType!='deliveryTime'">
				<el-radio v-model="radio" label="2">直接修改</el-radio>
				<el-input v-model="editPrice" style="width:35%" type="number"/>
			</div>
			<div class="mt20" v-else>
				<span class="pr5">修改运送时间</span>
				<el-input v-model="editStartTime" style="width:30%" type="number"/> 天 -
				<el-input v-model="editEndTime" style="width:30%" type="number"/> 天
			</div>
			<span slot="footer" class="dialog-footer">
				<el-button @click="cancelClick">取 消</el-button>
				<el-button type="primary" @click="sureChangePrice">确 定</el-button>
			</span>
		</el-dialog>
		<el-dialog
			title="消息提示"
			:visible.sync="dialogVisibleOnline"
			width="40%"
			@close="dialogVisibleOnline=false">
<!--			<div v-if="dialogMessage">-->
<!--				<div>详情:</div>-->
<!--				<div class="ml40">-->
<!--					编辑Wish产品成功-->
<!--				</div>-->
<!--			</div>-->
<!--			<div v-if="!syncFalse&&!dialogMessage">正在更新到Wish...</div>-->
			<div v-if="syncFalse&&!dialogMessage">页面信息填写不正确，请正确填写哦~</div>
			<span slot="footer" class="dialog-footer">
				<el-button type="primary" @click="dialogVisibleOnline=false">关闭</el-button>
			</span>
		</el-dialog>
		<setTemplate :dialogVisibleTemlate="dialogVisibleTemlate" :showInput="false" :tableDataDetail="tableDataDetail" :tableDataAllDetail="tableDataAllDetail" :templateOptions="templateOptions" :id="id" @sureSaveClick="sureSaveClick" @cancelClick="cancelTemplateClick" v-if="currentType==2"></setTemplate>
		<syncPollingTemplate :syncPollingVisible="syncPollingVisible" :batchCode="modifyBatchCode" @closeSync="closeSync" ref="syncFunction" :titleName="titleName"></syncPollingTemplate>
	</div>
</template>

<script>
import topCrumbs from '@/components/business/topCrumbs'
import anchor from '@/components/business/anchor'
import util from "@/common/js/util";
import dynamicTable from '@/components/business/dynamicTable'
import setTemplate from '@/components/business/setTemplate'
import syncPollingTemplate from '@/components/business/syncPollingTemplate'
import { type } from 'os';
  export default {
    data() {
      return {
				id:'',
				currentType:'',
				treeShow:false,
				visible:false,
		  		firstCrumbs:'',
				secondCrumbs:'',
				thirdCrumbs: '',
				spu:'',
				title:'',
				description:'',
				labelValue:'',
				tags:[],
				productFromUrl:[''],
				sellPriceUs: '',
				sellPriceCn: '',
				freightPriceUs: '',
				freightPriceCn: '',
				stock:'',
				radioVal:'',
				deliveryTime:'7-14',
				msrpPrice:'',
				deliveryMin:'',
				deliveryMax:'',
				mainImageUrl:{},
				variantImageUrls:[],
        variantImageUrlsData:0,
				colorArry:[],
				colorCode:[],
				typeCode:'',
				typeSize:'',
				sizeCode:[],
				sizeCodeNew:[],
				otherSizeCode:[],
        customSize:[],
				otherSizeCodeNew:[],
				unitRespDTOList:[],
				onlineUnitRespDTOList:[],
				sourceType:0,
				checkedImg:true,
				formData: new FormData(),
				stepsArr: [
					{ title: '基本信息' },
					{ title: window.location.host.indexOf('printwe.net')>0?'红茄信息':'智链互联信息' },
					{ title: '运费设置' },
					{ title: '价格和运送' },
					{ title: '图片信息' },
					{ title: '颜色信息' },
					{ title: '尺寸信息' },
					{ title: '变种信息' },
				],
				timer: false,
				value: '',
				dateArry:['5-10','7-14','10-15','14-21','21-28'],
				radio:'',
				typeArry:[],
				tableData: [],
				visibleParities:false,
				paritiesVal:7,
				tempUrl: '',
				dataObj: this.$store.state.global.dataObj,
				baseAli: this.$store.state.global.baseAli,
				progress:0,
				tableShow:true,
        // 表数据
      	mulTableData: [],
       // 表头数据
        tableConfig: [],
			 treeData:[],
			 classificationId:'',
			 classificationType:'',
			 dialogVisible:false,
			 ids:[],
			 dialogVisibleReleased:false,
			 allShop:[],
			 shopAccount:[],
			 checkedCities:[],
			 publishDate:'',
			 command:'',
			 checkAll:false,
			 sizeType:true,
			 md5Key:'',
			 currentChangeType:'',
			 dialogVisiblePrice:false,
			 radio:'1',
			 editPriceAdd:'',
			 editPrice:'',
		   editStartTime:'',
			 editEndTime:'',
			 tableType:'',
			 dialogVisibleOnline:false,
			 dialogMessage:false,
			 shopName:'',
			 templateOptions: [],
			 templateValue: '',
			 templateTableData: [{
				shop: '',
				countrys: '未进行运输设置',
			 }],
			 dialogVisibleTemlate:false,
		 	 tableDataDetail:[],
		 	 tableDataAllDetail:[],
		   editId:'',
			 shopChoose:[],
			 saveload:true,
			 customInput:'',
			 isSizeChange:false,
			 syncFalse:false,
		     syncPollingVisible:false,
		     isColorClick:false,
		     modifyBatchCode:'',
			 pickerOptions: {
				disabledDate: (time) => {
						return time.getTime() < new Date(new Date - 1000 * 60 * 60 * 24).getTime()
					},
			 },
			 sizeInput:'',
			 titleName:'更新至Wish',
			 indexHD:'',
			 jieziman:true
			};
		},
		components:{
			anchor,topCrumbs,dynamicTable,setTemplate,syncPollingTemplate
		},
	mounted() {
		if(window.location.host.indexOf('printwe.net')>0){
			this.jieziman=false
		}else{
			this.jieziman=true
		}
		this.getShopList()
		this.id=this.$route.query.id||''
		this.currentType=this.$route.query.currentType||1
		this.firstCrumbs = 'Wish产品';
		this.secondCrumbs = this.currentType == 1 ? '采集箱' : this.currentType == 2 ? '待发布' : this.currentType == 3 ? '在线产品' : '';
		this.thirdCrumbs = this.id ? '编辑' : '创建';
		if(this.id){
			this.getEditData(this.id)
		} else{
			this.getTpye()
			this.getTemplateList()
			this.getTemplateEdit()
		}
		this.getClassify()
		this.getColor()
		if(this.currentType==2){
			this.getTemplateList()
			this.getTemplateEdit()
		}
		if(this.currentType==1){
			this.stepsArr.splice(2,1)
		}
		if(this.currentType==3){
			this.stepsArr.splice(2,2)
		}
	},
  methods: {
		deleteImgAllClick(){
			this.unitRespDTOList.map((item)=>{
				item.mainImageUrl=''
			})
			// this.$set(this.unitRespDTOList[index],'mainImageUrl','')
		},
		deleteImgClick(index){
			this.$set(this.unitRespDTOList[index],'mainImageUrl','')
		},
		titleToUpperCase(str){
				this.title=str.toLowerCase().replace(/( |^)[a-z]/g, (L) => L.toUpperCase());
		},
		clearSetClick(){
			this.templateTableData[0].countrys='未进行运输设置'
			this.tableDataDetail.map((item)=>{
				item.type=1
			})
		},
		handleShopChangeClick(val){
			this.shopChoose=val
		},
		sureSaveClick(val){
			this.dialogVisibleTemlate=false
			let shopArry=[]
			val.forEach((item)=>{
				if(item.type!=1){
					shopArry.push(item.countryName)
				}
			})
			this.templateTableData[0].countrys=shopArry.join(',')||'未进行运输设置'
			this.tableDataDetail=val
		},
		templateSelect(val){
			if(val=='add'){
				let routeData = this.$router.resolve({
					name: "templateList",
				});
				window.open(routeData.href, '_blank');
			}else{
				this.editId=val
				this.axios({
					url: 'assistant/product/freightTemplate/findById',
					data:{
						productReleaseId:this.id,
						id:val
					},
					method: "post"
				}).then(res => {
					if(res.success){
						let shopArry=[]
						res.module.details.forEach((item)=>{
							if(item.type!=1){
								shopArry.push(item.countryName)
							}
						})
						this.templateTableData[0].countrys=shopArry.join(',')
						this.tableDataDetail=res.module.details
						this.tableDataAllDetail=res.module.details
					}
				})
			}
		},
		getTemplateList(){
			this.axios({
					url: 'assistant/product/freightTemplate/query',
					data:{
						currentPage: 1,
						pageSize: 1000,
					},
					method: "post"
				}).then(res => {
					if(res.success){
						this.templateOptions=[]
						res.module.result.map((item)=>{
							if(item.isOpen){
								this.templateOptions.push({value:item.id,label:item.name})
							}
						})
						this.templateOptions.push({value:'add',label:'+添加运费模板'})
					}
			})
		},
		setTemplateClick(){
			this.dialogVisibleTemlate=true
			// this.getTemplateEdit()
		},
		getTemplateEdit(){
			const{editId,id}=this
			this.axios({
				url: 'assistant/product/freightTemplate/findById',
				data:{
					productReleaseId:id,
					id:editId
				},
				method: "post"
			}).then(res => {
				if(res.success){
					this.tableDataDetail=res.module.details
					this.tableDataAllDetail=res.module.details
					let shopArry=[]
					this.tableDataDetail.forEach((item)=>{
						if(item.type!=1){
							shopArry.push(item.countryName)
						}
					})
					this.templateTableData[0].countrys=shopArry.join(',')||'未进行运输设置'
				}
			})
		},
		cancelTemplateClick(){
			this.dialogVisibleTemlate=false
		},
		handleCheckAllChange(val) {
			let newArry=[]
			if(val){
				this.shopAccount.map((item)=>{
					newArry.push(item.id)
				})
			}
			this.checkedCities=newArry
		},
		handleShopChange(value) {
			let checkedCount = value.length;
			this.checkAll = checkedCount === this.shopAccount.length;
		},
		handleClick(command){
			this.command=command
			if(this.id){
				if(this.currentType==1){
					this.dialogVisibleReleased=true
				}else{
					if(command==1){
						this.chooseShopClick()
					}else{
						this.dialogVisibleReleased=true
					}
				}
			}else{
				this.dialogVisibleReleased=true
			}
		},
		chooseShopClick(){
			const {id,checkedCities,currentType,command,spu,title,description,tags,classificationId,deliveryTime,productFromUrl,sellPriceUs,sellPriceCn,freightPriceUs,freightPriceCn,stock,msrpPrice,mainImageUrl,variantImageUrls,colorCode,typeCode,sizeCodeNew,unitRespDTOList,tableDataDetail}=this
			if(!spu){
				this.$message({
					message: 'spu不能为空',
					type: 'error'
				})
				return
			}
			this.publishDate=this.publishDate?(util.formatDate.format(new Date(this.publishDate), "yyyy-MM-dd hh:mm:ss")):''
			let url
			if(id){
				if(currentType==1){
					if(command==1){
						url='assistant/product/collectBox/updateAndPublish'
					}else if(command==2){
						url='assistant/product/collectBox/updateAndTimePublish'
					}
				}else if(currentType==2){
					if(command==1){
						url='assistant/product/release/updateAndPublish'
					}else{
						url='assistant/product/release/updateAndTimePublish'
					}
				}
				if(command==3){
					url='assistant/product/collectBox/updateAndWaitPublish'
				}
			}else{
				if(command==1){
					url='assistant/product/online/createAndPublish'
				}else{
					url='assistant/product/online/createAndTimePublish'
				}
			}
			this.axios({
				url,
				data:{
					id:id,
					shopIds:JSON.stringify(checkedCities),
					publishDate:this.publishDate,
					spu,
					title,
					description,
					classificationId,
					tags:JSON.stringify(tags),
					productFromUrl:JSON.stringify(productFromUrl),
					sellPriceUs,
					sellPriceCn,
					freightPriceUs,
					freightPriceCn,
					stock,
					deliveryTime,
					msrpPrice,
					mainImageUrl:JSON.stringify(mainImageUrl),
					variantImageUrls:JSON.stringify(variantImageUrls),
					colorCode:JSON.stringify(colorCode),
					typeCode:typeCode,
					sizeCode:JSON.stringify(sizeCodeNew),
					unitRespDTOList:JSON.stringify(unitRespDTOList),
					details:JSON.stringify(tableDataDetail),
				},
				method: "post"
			}).then(res => {
				if(res.success){
					this.dialogVisibleReleased=false
					if(command==3){
						this.$message({
							message: '操作成功',
							type: 'success'
						});
						this.$router.push({name:'productList',query:{id:currentType}})
					}else{
						let data=res.module.checkResultRespDTO
						if(data.checkResult){
							this.publishDate=''
							this.checkAll=false
							this.checkedCities=[]
							this.$message({
								message: '操作成功',
								type: 'success'
							});
							this.$router.push({name:'productList',query:{id:currentType}})
						}else{
							this.$message({
								message: data.productInfos[0].errorReason,
								type: 'error'
							});
						}
					}
					this.shopName=''
					this.shopAccount=this.allShop
				}
			})
		},
		getShopList(){
			this.shopAccount=[]
			this.axios({
					url: 'assistant/getShops',
					data:{
						agentName:'wish'
					},
					method: "post"
				}).then(res => {
					if(res.success){
						res.module.map((item)=>{
							this.allShop.push({name:item.authCode,id:item.id})
							this.shopAccount.push({name:item.authCode,id:item.id})
						})
					}
			})
		},
		getClassify(){
			this.axios({
					url: 'assistant/dictionary/getClassificationList',
					data:{},
					method: "post"
			}).then(res => {
				if(res.success){
					this.treeData=res.module.dataTree
				}
			})
		},
		append(data) {
			let id = 1000;
			const newChild = { pid: '', label: '新分类',edit:true, children: [] };
			if (!data.children) {
				this.$set(data, 'children', []);
			}
			data.children.push(newChild);
		},
		edit(node,data){
			const parent = node.parent;
			const children = parent.data.children || parent.data;
			const index = children.findIndex(d => d.id === data.id);
			this.$set(children[index],'edit',true)
		},
		remove(node, data) {
			this.ids.push(data.pid)
			const parent = node.parent;
			const children = parent.data.children || parent.data;
			const index = children.findIndex(d => d.id === data.id);
			children.splice(index, 1);
		},
		SwitchNode(data,node){
			this.classificationId=data.pid
			this.classificationType=data.label
			this.treeShow=false
		},
		sureTypeClick(){
			const{treeData,ids}=this
			this.axios({
					url: 'assistant/dictionary/addClassification',
					data:{
						dataTree:JSON.stringify(treeData),
						ids:JSON.stringify(ids)
					},
					method: "post"
			}).then(res => {
				if(res.success){
					this.getClassify()
					this.ids=[]
					this.dialogVisible=false
				}
			})
		},
		getEditData(id){
			this.axios({
					url: 'assistant/product/edit',
					data:{
						seriesType:this.currentType,
						id,
					},
					method: "post"
				}).then(res => {
					if(res.success){
						let data=res.module
						this.spu=data.spu
						this.title=data.title
						this.description=data.description
						this.tags=data.tags
						this.classificationId=data.classificationId
						this.classificationType=data.classificationType
						this.productFromUrl=data.productFromUrl.length==0?['']:data.productFromUrl
						this.sellPriceUs=data.sellPriceUs
						this.sellPriceCn=data.sellPriceCn
						this.freightPriceUs=data.freightPriceUs
						this.freightPriceCn=data.freightPriceCn
						this.stock=data.stock
						this.deliveryTime=data.deliveryTime
						this.msrpPrice=data.msrpPrice
						this.mainImageUrl=data.mainImageUrl
						this.variantImageUrls=data.variantImageUrls
						this.variantImageUrlsData=data.variantImageUrls.length
						this.colorCode=data.colorCode
						this.typeCode=data.typeCode
						this.sizeCode=data.sizeCode
						this.unitRespDTOList=data.unitRespDTOList
						this.md5Key=data.md5Key
						this.onlineUnitRespDTOList=data.unitRespDTOList
						this.templateTableData[0].shop=data.shopCode
						this.sourceType=data.sourceType
            if (data.sizeCode){
              this.tableShow = false;
              data.sizeCode.forEach(size => {
                this.otherSizeCode.push({name:size,code:size,value:'',isEdit:false})
              });
              this.customSize = this.otherSizeCode;
            }
            this.otherSizeCodeNew=data.sizeCode
            console.log(this.otherSizeCodeNew)
					}
					this.getTpye()
			})
		},
		getColor(){
			this.axios({
					url: 'assistant/info/get/colorList',
					data:{},
					method: "post"
				}).then(res => {
					if(res.success){
						// this.colorArry=res.module
						this.colorArry=res.module.map((item)=>{
							return item= Object.assign({}, item, { isEdit:false})
						})
					}
			})
		},
		getTpye(){
			this.axios({
					url: 'assistant/info/get/typeList',
					data:{},
					method: "post"
				}).then(res => {
					if(res.success){
						this.typeArry=res.module
						this.typeCode=this.typeCode?this.typeCode:res.module[0].code
						this.getSize()
					}
			})
		},
		getSize(){
			const{typeCode,id}=this
      if(typeCode=='custom'){
        this.otherSizeCodeNew = [];
        this.otherSizeCode = this.customSize;
        this.tableShow = false;
        return;
      }
			this.axios({
					url: 'assistant/info/get/sizeList',
					data:{
						parentCode:typeCode,
						id
					},
					method: "post"
				}).then(res => {
					if(res.success){
						let data=res.module
						this.tableShow=data.table
						if(data.table){
							this.mulTableData=data.mulTableData
							this.tableConfig=data.tableConfigs
						}else{
							this.otherSizeCodeNew=[]
							this.otherSizeCodeNew=this.sizeCode
							if(typeCode=='custom'){
								if(data.data){
									this.otherSizeCode=data.data.map((item)=>{
										return item= Object.assign({}, item, { isEdit:false})
									})
								}else{
									this.otherSizeCode=[]
								}
							}else{
								this.otherSizeCode=data.data
							}
						}
					}
			})
		},
		customEditClick(index,type){
			if(type==1){
				this.colorArry.map((item,indexItem)=>{
					if(indexItem==index){
						item.isEdit=!item.isEdit
					}
				})
			}else{
				this.otherSizeCode.map((item,indexItem)=>{
					if(indexItem==index){
						item.isEdit=!item.isEdit
					}
				})
        this.customSize = this.otherSizeCode;
			}
		},
		customDelClick(index,type){
			if(type==1){
				this.colorArry=this.colorArry.filter((item,indexItem)=>{
					return indexItem!=index
				})
			}else{
				this.otherSizeCode=this.otherSizeCode.filter((item,indexItem)=>{
					return indexItem!=index
				})
        this.customSize = this.otherSizeCode;
			}
		},
		addClick(type){
			const{customInput,sizeInput}=this
			if(type==1){
				this.axios({
					url: 'assistant/product/checkColor',
					data:{
						code:this.sizeInput
					},
					method: "post"
				}).then(res => {
					if(res.success&&res.module == true){
						this.colorArry.push({name:sizeInput,code:sizeInput,value:'',isEdit:false,customColors:true});
						this.sizeInput = '';
						this.isColorClick = false;
					}else {
						this.isColorClick = true;
					}
				})
			}else{
				this.otherSizeCode.push({name:customInput,code:customInput,value:'',isEdit:false})
        this.customSize = this.otherSizeCode;
			}
		},
		removeClick(index){
			this.unitRespDTOList.splice(index,1)
		},
		closeSync(val){
			this.syncPollingVisible=val;
			this.modifyBatchCode='';
			// location.reload();
		},
		saveAllClick(){
				const{id,checkedCities,spu,title,description,tags,classificationId,deliveryTime,productFromUrl,sellPriceUs,sellPriceCn,freightPriceUs,freightPriceCn,stock,msrpPrice,mainImageUrl,variantImageUrls,colorCode,typeCode,sizeCodeNew,otherSizeCodeNew,unitRespDTOList,currentType,md5Key,tableDataDetail}=this
				console.log(unitRespDTOList)
				if(!spu){
					this.$message({
						message: 'spu不能为空~',
						type: 'error'
					});
					return
				}
				if(tags.length<2){
					this.$message({
						message: '标签数不能小于2个',
						type: 'error'
					});
					return
				}
				if(!description){
					this.$message({
						message: '描述不能为空',
						type: 'error'
					});
					return
				}
				if(currentType==3){
					// this.dialogVisibleOnline=true
					this.dialogMessage=false
					this.syncFalse=false
				}
				let url
				if(id){
					if(currentType==1){
						url='assistant/product/collectBox/updateAndSave'
					}else if(currentType==2){
						url='assistant/product/release/updateAndSave'
					}else{
						url='assistant/product/online/updateAndModify'
					}
				}else{
					url='assistant/product/online/createAndSave'
				}
				if(this.saveload){
					this.saveload=false
					this.axios({
						url,
						data:{
							id,
							shopIds:JSON.stringify(checkedCities),
							spu,
							title,
							description,
							classificationId,
							tags:JSON.stringify(tags),
							productFromUrl:JSON.stringify(productFromUrl),
							sellPriceUs,
							sellPriceCn,
							freightPriceUs,
							freightPriceCn,
							stock,
							deliveryTime,
							msrpPrice,
							mainImageUrl:JSON.stringify(mainImageUrl),
							variantImageUrls:JSON.stringify(variantImageUrls),
							colorCode:JSON.stringify(colorCode),
							typeCode:typeCode,
							sizeCode:JSON.stringify(sizeCodeNew.length>0?sizeCodeNew:otherSizeCodeNew),
							unitRespDTOList:JSON.stringify(unitRespDTOList),
							MD5Key:md5Key,
							details:JSON.stringify(tableDataDetail),
						},
						method: "post"
					}).then(res => {
						if(res.success){
							if(currentType==3&&id){
								this.dialogMessage=true
								this.modifyBatchCode=res.module.batchCode
								this.syncPollingVisible=true;
								this.$refs.syncFunction.pollingQuery();
							}else{
								this.$message({
									message: '保存成功',
									type: 'success'
								});
								this.$router.push({name:'productList',query:{id:currentType}})
							}
							this.saveload=true
						}else{
							if(currentType==3){
								this.syncFalse=true
							}
							this.saveload=true
						}
					})
				}
		},
		addLabel(){
			this.tags.push(this.labelValue)
			this.labelValue=''
		},
		deleteLabel(index){
			this.tags.splice(index,1)
		},
		addSource(){
			this.productFromUrl.push('')
		},
		removeSource(index){
			this.productFromUrl.splice(index,1)
		},
		chooseDataClick(val){
			this.radioVal=val
		},
		getCurrentDate(val){
			this.deliveryMin=val.match(/(\S*)-/)[1]
			this.deliveryMax=val.match(/-(\S*)/)[1]
			this.deliveryTime=val
			this.visible=false
		},
		sureDateClick(){
			if(this.radioVal&&(!this.deliveryMin||!this.deliveryMax)){
				this.$message({
					message:'运送时间不能为空~',
					type:'error'
				})
				return
			}
			this.deliveryTime=this.deliveryMin+'-'+this.deliveryMax
			this.visible=false
		},
		removeImgClick(index){
			this.variantImageUrls.splice(index,1)
      this.variantImageUrlsData -= 1;
		},
		setHDClick(index){
			this.indexHD=index
			let i=0;
			if(index==100){
				this.$set(this.mainImageUrl,'hd',true)
				for (i = 0; i < this.variantImageUrls.length; i++) {
					this.$set(this.variantImageUrls[i],'hd',false)
				}
			}else{
				for (i = 0; i < this.variantImageUrls.length; i++) {
					if(i == index){
						this.$set(this.variantImageUrls[i],'hd',true)
					}else{
						this.$set(this.variantImageUrls[i],'hd',false)
					}
				}
				this.$set(this.mainImageUrl,'hd',false)
			}
		},
		setMainPhotoClick(index){
			let newPhoto=	this.mainImageUrl
			this.mainImageUrl=this.variantImageUrls[index]
			this.variantImageUrls.splice(index,1,newPhoto)
		},
		beforeAvatarUpload(file) {
			let isUpload=true
			if(this.variantImageUrls.length>=20){
				this.$message.error('图片最多上传20张~')
				isUpload=false
			}
			return isUpload;
		},
		handleExceed(files, fileList) {
			this.$message.error(`图片最多上传20张`);
		},
		uploadFile(file,index,isList) {
			const that = this
			const tmpcnt = file.file.name.lastIndexOf(".")
			const exname = file.file.name.substring(tmpcnt + 1)
			const names = ['jpg', 'jpeg', 'webp', 'png','bmp']
			if(names.indexOf(exname)< 0 ){
				this.$message.error("不支持的格式!")
				return
			}
			async function multipartUpload () {
				const fileName = 'cloudStorage/' + file.file.uid
				util.client(that.dataObj).put(fileName, file.file,
					{
						progress:function (p) {
							that.progress = p*100
						},
					}).then(
						result => {
						// x-oss-process=image/resize,m_lfit,h_100,w_100
						// that.tempUrl = 'http://'+result.bucket+'.'+that.baseAli+ '/' + result.name
						that.tempUrl=result.url
						if(isList==1){
							// let width
							// let height
							// const _URL = window.URL || window.webkitURL;
							// const img = new Image();
							// img.onload = () => {
							// 	width=img.width
							// 	height=img.height
								let objImg={url:that.tempUrl,width:200,height:200,hd:false}
								if(JSON.stringify(that.mainImageUrl) == "{}"){
									that.mainImageUrl=Object.assign({},that.mainImageUrl,objImg)
								}else{
									that.variantImageUrls.push(objImg)
								}
							// };
							// img.src = _URL.createObjectURL(file.file)
						}else{
							that.$set(that.unitRespDTOList[index],'mainImageUrl',that.tempUrl)
						}
					}).catch(err => {
						console.log("err:",err)
				})
			}
			multipartUpload ()
		},
		handleCheckedCitiesChange(value){
			this.colorCode=value
			this.createProduct()
		},
		handleSizeChange(val){
			this.sizeCodeNew=[]
			this.sizeCode=[]
			// if(this.isSizeChange){
			// 	this.otherSizeCodeNew.splice(0,this.otherSizeCodeNew.length-1)
			// 	this.isSizeChange=false
			// }
      console.log(this.otherSizeCodeNew)
			this.createProduct()
		},
		handleSelectionChange(val) {
			if(this.isSizeChange){
				this.sizeCode=[]
			}
			this.sizeCodeNew=val.map((item=>{
				return item.Type
			}))
			setTimeout(() => {
				this.createProduct()
			}, 1000);
			this.otherSizeCodeNew=[]
		},
		createProduct(){
			this.deliveryMin=this.deliveryTime&&this.deliveryTime.match(/(\S*)-/)[1]
			this.deliveryMax=this.deliveryTime&&this.deliveryTime.match(/-(\S*)/)[1]
			const{colorCode,sizeCodeNew,otherSizeCodeNew,spu,msrpPrice,sellPriceUs,sellPriceCn,stock,deliveryMin,deliveryMax,currentType,onlineUnitRespDTOList,isSizeChange}=this
			let onlineLength=onlineUnitRespDTOList.length
			let finallySizeCode=sizeCodeNew.length==0?otherSizeCodeNew:sizeCodeNew
			let newUnitRespDTOListArry=[]
			let colorLength=this.colorCode.length
			let sizeLength=finallySizeCode.length
			if(colorLength>0&&sizeLength>0){
				colorCode.map((item)=>{
					finallySizeCode.map((childItem)=>{
						newUnitRespDTOListArry.push({sku:'',sizeCode:childItem,colorCode:item,sysSize:childItem,sysColor:item,msrpPrice,sellPriceUs,sellPriceCn,stock,deliveryMin,deliveryMax})
					})
				})
				if(!isSizeChange){
					onlineUnitRespDTOList.map((onlineItem)=>{
						newUnitRespDTOListArry.map((newItem,index)=>{
							if(onlineItem.sizeCode==newItem.sizeCode&&onlineItem.colorCode==newItem.colorCode){
								this.$set(newUnitRespDTOListArry,index,onlineItem)
								// console.log(onlineItem)
							}
						})
					})
				}
			}
			if(colorLength>0&&sizeLength==0){
				colorCode.map((item)=>{
					newUnitRespDTOListArry.push({sku:'',sizeCode:'',colorCode:item,sysSize:'',sysColor:item,msrpPrice,sellPriceUs,sellPriceCn,stock,deliveryMin,deliveryMax})
				})
				if(!isSizeChange){
					onlineUnitRespDTOList.map((onlineItem)=>{
						newUnitRespDTOListArry.map((newItem,index)=>{
							if(onlineItem.colorCode==newItem.colorCode){
								this.$set(newUnitRespDTOListArry,index,onlineItem)
							}
						})
					})
				}
			}
			if(colorLength==0&&sizeLength>0){
				finallySizeCode.map((item)=>{
					newUnitRespDTOListArry.push({sku:'',sizeCode:item,colorCode:'',sysSize:item,sysColor:'',msrpPrice,sellPriceUs,sellPriceCn,stock,deliveryMin,deliveryMax})
				})
				if(!isSizeChange){
					onlineUnitRespDTOList.map((onlineItem)=>{
						newUnitRespDTOListArry.map((newItem,index)=>{
							if(onlineItem.sizeCode==newItem.sizeCode){
								this.$set(newUnitRespDTOListArry,index,onlineItem)
							}
						})
					})
				}
			}
			if(currentType==3){
				newUnitRespDTOListArry=newUnitRespDTOListArry.map((item)=>{
					return Object.assign({},item,{msrpPrice:onlineLength>0?onlineUnitRespDTOList[0].msrpPrice:msrpPrice,sellPriceUs:onlineLength>0?onlineUnitRespDTOList[0].sellPriceUs:sellPriceUs,sellPriceCn:onlineLength>0?onlineUnitRespDTOList[0].sellPriceCn:sellPriceCn,stock:onlineLength>0?onlineUnitRespDTOList[0].stock:stock,deliveryMin:onlineLength>0?onlineUnitRespDTOList[0].deliveryMin:deliveryMin,deliveryMax:onlineLength>0?onlineUnitRespDTOList[0].deliveryMax:deliveryMax,remove:true})
				})
				this.unitRespDTOList=onlineUnitRespDTOList.concat(newUnitRespDTOListArry)
			}else{
				this.unitRespDTOList.map((item,index)=>{
					if(index<newUnitRespDTOListArry.length){
						this.$set(newUnitRespDTOListArry[index],'sku',item.sku)
					}
				})
				this.unitRespDTOList=newUnitRespDTOListArry
			}
		},
		updateDataClick(type){
			this.tableType=type
			this.changeCurrentType(type)
		},
		changeCurrentType(type){
			const {unitRespDTOList,radio,editPrice,editPriceAdd,editStartTime,editEndTime,tableType,currentType,msrpPrice,sellPriceUs,sellPriceCn,stock,deliveryMin,deliveryMax}=this
			if(currentType==3){
				this.dialogVisiblePrice=true
			}else{
				this.dialogVisiblePrice=false
			}
			unitRespDTOList.map((item)=>{
				switch (type) {
					case 'msrpPrice':
						if(currentType!=3){
							this.$set(item,type,msrpPrice)
						}else{
							if(radio==1){
								this.$set(item,type,item.msrpPrice+editPriceAdd*1)
							}else{
								this.$set(item,type,editPrice)
							}
						}
						break;
					case 'sellPriceUs':
						if(currentType!=3){
							this.$set(item,type,sellPriceUs)
						}else{
							if(radio==1){
								this.$set(item,type,item.sellPriceUs+editPriceAdd*1)
							}else{
								this.$set(item,type,editPrice)
							}
						}
						break;
					case 'sellPriceCn':
						if(currentType!=3){
							this.$set(item,type,sellPriceCn)
						}else{
							if(radio==1){
								this.$set(item,type,item.sellPriceCn+editPriceAdd*1)
							}else{
								this.$set(item,type,editPrice)
							}
						}
						break;
					case 'stock':
						if(currentType!=3){
							this.$set(item,type,stock)
						}else{
							if(radio==1){
								this.$set(item,type,item.stock+editPriceAdd*1)
							}else{
								this.$set(item,type,editPrice)
							}
						}
						break;
					case 'deliveryMin':
						if(currentType!=3){
							this.$set(item,type,deliveryMin)
							this.$set(item,'deliveryMax',deliveryMax)
						}else{
							this.currentChangeType='deliveryTime'
							this.$set(item,type,editStartTime)
							this.$set(item,'deliveryMax',editEndTime)
						}
						break;
					default:
						break;
				}
			})
			this.editPriceAdd=''
			this.editPrice=''
		},
		sureChangePrice(){
			const {tableType}=this
			this.changeCurrentType(tableType)
			this.currentChangeType=''
			this.dialogVisiblePrice=false
		},
		cancelClick(){
			this.currentChangeType=''
			this.dialogVisiblePrice=false
		},
		generationClick(){
			const {spu,unitRespDTOList} = this
			if(spu==''){
				this.$message.error("错误：SPU为空，无法使用一键生成!")
				return
			}else{
				unitRespDTOList.map((item)=>{
					this.$set(item,'sku',spu+'-'+item.sizeCode+'-'+item.colorCode)
				})
			}
		},
		chooseSize(val){
			if(this.typeCode!=val){
				this.isSizeChange=true
			}else{
				this.isSizeChange=false
			}
			this.typeCode=val
			this.getSize()
		},
		clearUnitRespDTOListClick(){
			this.colorCode=[]
			this.sizeCodeNew=[]
			this.sizeCode=[]
			this.unitRespDTOList=[]
			if(this.tableShow){
				this.tableShow=false
				setTimeout(() => {
					this.tableShow=true
					this.$message({
						message: '清空变种信息成功',
						type: 'success'
					});
				}, 1000);
			}
		},
		downZipClick(){
			this.axios({
				url: 'assistant/product/imageUrlsDownload',
				data:{
					seriesType:this.currentType,
					productSeriesId:this.id
				},
				method: "post"
			}).then(res => {
				if(res.success){
					window.location.href=res.module.zipFileUrl
				}
			})
		},
		visitUrlClick(url){
			window.open(url);
		},
		handleClickUpDown(command){
			if(command==1){
				this.unitRespDTOList.map((item)=>{
					item.ifShelf=true
				})
			}else{
				this.unitRespDTOList.map((item)=>{
					item.ifShelf=false
				})
			}
		},
		searchShopClick(val){
			console.log(val)
			let shopArry=[]
			console.log(this.allShop)
			this.allShop.map((item)=>{
				if(item.name.indexOf(val)>-1){
					shopArry.push(item)
				}
			})
			this.shopAccount=shopArry
		},
		translationClick(val){
			const{id,title,description,tags}=this
			this.axios({
				url: 'assistant/info/get/translate',
				data:{
					id,
					title,
					description,
					tags:JSON.stringify(tags),
				},
				method: "post"
			}).then(res => {
				if(res.success){
						let data=res.module
						this.titleToUpperCase(data.title)
						this.description=data.description
						this.tags=data.tags
				}
			})
		},
		checkColorClick(val,index){
			this.axios({
				url: 'assistant/product/checkColor',
				data:{
					code:val
				},
				method: "post"
			}).then(res => {
				if(res.success&&res.module != true){
					this.$message({
						message: '请务必按要求添加！双色支持格式：black&white；单色请参考：wish官方颜色列表',
						type: 'error'
					});
					this.$set(this.unitRespDTOList[index],'colorCode','')
				}
			})
		},
		priceChangeClick(type){
			const{paritiesVal}=this
			if(type==1){
				this.unitRespDTOList.map((item)=>{
					this.$set(item,'sellPriceCn',this.fomatFloat(item.sellPriceUs*paritiesVal))
				})
			}else if(type==2){
				this.unitRespDTOList.map((item)=>{
					this.$set(item,'sellPriceUs',this.fomatFloat(item.sellPriceCn/paritiesVal))
				})
			}else if(type==3){
				this.sellPriceCn=this.fomatFloat(this.sellPriceUs*paritiesVal)
				this.freightPriceCn=this.fomatFloat(this.freightPriceUs*paritiesVal)
			}else{
				this.sellPriceUs=this.fomatFloat(this.sellPriceCn/paritiesVal)
				this.freightPriceUs=this.fomatFloat(this.freightPriceCn/paritiesVal)
			}
		},
		fomatFloat(src){
      return Math.round(src*Math.pow(10,2))/Math.pow(10,2);
		}
  }
}
</script>
<style scoped lang="less">
.shop-list{
	display:flex;
	margin:20px 5px;
	flex-wrap:wrap;
	justify-content:space-between;
	max-height:300px;
	overflow:auto;
	clear:both;
	.current-shop{
		width:120px;
		overflow:auto
	}
}
.add-type{
	color: #61BD50;
  font-size: 18px;
  font-weight: 1000;
}
.delete-type{
	color:#EC5947
}
.edit-type{
	color:#137ABF
}
.contain-page{
	.label-show{
		border: 1px solid#DCDFE6;
		padding: 3px 10px;
		border-radius: 4px;
		.label-input{
			height: 30px;
			width: 100%;
			border: none;
			margin-top: 5px;
		}
		.label-tags{
			margin-right: 3px;
			margin-bottom: 3px;
			padding: 6px;
			display: block;
			background-color: #5bc0de;
			float: left!important;
			font-weight: 700;
			line-height: 1;
			color: #fff;
			text-align: center;
			white-space: nowrap;
			border-radius: .25em;
		}
	}
	.btn-orange {
    border-color: #f96;
    font-size: 13px;
    color: #fff;
    background-color: #f96;
	}
	.product-info-module{
		clear: both;
		background-color: #fff;
		border: 1px solid #ccc;
		border-radius: 4px;
		.product-info-module-tab{
			padding: 10px;
			border-bottom: 1px solid #eee;
			color: #434649;
			background-color: #eee;
		}
		.product-info-module-tab2{
			padding: 30px;
			border-bottom: 1px solid #eee;
			color: #434649;
			background-color: #eee;
			font-size: 15px;
			font-weight:bold;
			text-align: center;
		}
		.product-info-module-content {
			padding-bottom: 20px;
			padding: 10px;
			width:100%;
			overflow:auto;
			.tree-select{
				width:240px;
				height:34px;
				border:1px solid #ccc;
				border-radius:4px;
				padding: 6px 12px;
			}
			.tree-data{
				position: absolute;
				top: 34px;
				z-index: 2;
				border: 1px solid #eee;
				min-width:240px;
				max-height:350px;
				overflow:auto;
			}
			table{
				width:100%
			}
			table td {
				padding: 10px 0;
				font-size: 13px;
			}
			table td:first-child {
				width: 90px;
				min-width: 90px;
				padding-right: 10px;
				max-width: 100px;
				text-align: right;
				box-sizing: content-box;
			}
			table td:last-child {
				text-align: left;
				width: 750px;
				display: flex;
				align-items: center;
			}
			.mainImage-Url{
				width:54px;
				height:54px;
			}
			.noCss{
				padding: 3px 6px;
				min-width: 90px;
				margin: 0 20px 10px 0;
				border: 1px solid #09f;
				border-radius: 4px;
				text-align: center;
				display:inline-block;
				background-color: #fff;
				color: #367EE2;
				border-color: #fff;
				box-shadow: none;
				cursor:pointer;
			}
			.btn-size{
				padding: 3px 6px;
				min-width: 90px;
				margin: 0 20px 10px 0;
				background-color: #09f;
				border: 1px solid #09f;
				color: #fff;
				border-radius: 4px;
				text-align: center;
				display:inline-block;
				cursor:pointer;
			}
			.cny-price{
				width: 170px;
				text-align: right;
				display: inline-block;
			}
			.choose-data{
				  background-color: #eee;
    			min-width: 120px;
			}
			.icon-edit{
				position: absolute;
				margin: 7px 0 0 5px;
			}
			.no-flex{
				display: block!important;
				width: 900px!important;
			}
			.background-mainPhoto{
				background: url(../../assets/img/masterImg.png) repeat-x;
				position: relative;
				width: 278px;
				height: 278px;
				display: inline-block;
				background-color: white;
				border-bottom: 1px solid #cccccc;
			}
			.main-hd{
				position: absolute;
				bottom: 0;
				width: 100%;
				border:1px solid#cccccc;
				height: 20px;
				left: 0;
				text-align: left;
			}
			.imgCss {
				width: auto;
				height: auto;
				max-width: 100%;
				max-height:100%;
				padding: 1px;
				margin: auto;
				top: 0;
				bottom: 0px;
				left: 0;
				right: 0;
				position: absolute;
			}
			.img-remark{
				background-color: #009999;
				width: 54px;
				color: #fff;
				display: inline-block;
				text-align: center;
				margin-top: 30px;
			}
			.img-td{
				text-align: left!important;
				width: 900px!important;
				display: flex!important;
				align-items: center!important;
				flex-wrap: wrap!important;
			}
			.opera-span{
					color: #367EE2;
					padding: 0 10px;
					cursor: pointer;
			}
			.sku-length{
				width: 300px;
			}
			.img-show{
				display: flex;
				flex-wrap: wrap;
				margin-top: 10px;
			}
			.picture-show{
				// display: flex;
				// justify-content: space-between;
				width: 100%;
				// align-items: center;
			}
			.imgDivOut {
				clear: both;
				position: relative;
				width: 122px;
				height: auto;
				margin-bottom: 0;
				background-color: white;
				margin: 5px 10px 5px 0;
				.img-border{
					position: relative;
					width: 120px;
					height: 120px;
					background-color: white;
					border: 1px solid #cccccc;
					.imgSize {
						position: absolute;
						bottom: 0;
						min-height: 20px;
						width: 119px;
						color: #fff;
						background-color: rgba(0,0,0,.2);
						line-height:20px;
					}
				}
				.imgDivIn {
					width: auto;
					height: auto;
					max-width: 100%;
					max-height: 100%;
					padding: 1px;
					margin: auto;
					top: 0;
					bottom: 0;
					left: 0;
					right: 0;
					position: absolute;
					background-color: white;
				}
				.imgDivDown {
					font-size: 13px;
					color: #4B60A8;
					padding-left: 2px;
					padding-right: 2px;
					width: 120px;
					border: 1px solid #ccc;
					border-top: none;
					padding: 2px;
					text-align:right;
					display:flex;
					justify-content:space-between;
				}
				.remove-img{
					float: right;
					color: #4B60A8;
				}
			}
		}
	}
}
.choose-send-time{
	padding: 10px;
	background-color: #eee;
}
.date-button{
	margin: 20px 7px;
}
.checkbox-color{
	border: 1px solid #ddd;
	padding: 3px 21px;
	color:#fff;
	margin-bottom: 10px;
}
.color-ful{
	background: url(../../assets/img/colorful.png) repeat-y;
}
.g0{
	color:#000;
}
.checkbox-flex{
	display: flex;
	flex-wrap: wrap;
	// justify-content:space-between;
}
.checkbox-width{
	width:250px;
	margin-bottom:10px;
}
.parities-change{
	line-height:30px;
	color:#333;
	margin:auto;
	text-align:center;
}
.modal-price{
	  display: flex;
    justify-content: space-between;
    align-items: center;
}
.el-dropdown-link {
	cursor: pointer;
	color: #367EE2;
	font-size: 13px;
}
</style>


