You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1341 lines
44 KiB
1341 lines
44 KiB
<template>
|
|
<div class="edit_add_page">
|
|
<div class="content">
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
|
<div class="detail_title">{{ $t('common.baseinfo') }}</div>
|
|
|
|
|
|
<el-form-item :label="$t('product.language')">
|
|
<el-select v-model="langType">
|
|
<el-option :label="$t('navbar.chinese')" value="zh" />
|
|
<el-option :label="$t('navbar.english')" value="en" />
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('product.ownedshop')" prop="shopId">
|
|
<el-select v-model="form.shopId" :placeholder="$t('product.ownedshop_hint')" clearable>
|
|
<el-option v-for="(item, index) in shopList" :key="index" :label="item.shopName"
|
|
:value="item.shopId" />
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item :label="$t('product.productname')" v-if="langType == 'zh'" prop="productName_ZH">
|
|
<el-input v-model="form.productName_ZH" class="form-content-item-input" :placeholder="$t('product.productnamehint')" show-word-limit />
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('product.productname_en')" prop="productName_EN" v-if="langType == 'en'">
|
|
<el-input v-model="form.productName_EN" class="form-content-item-input" :placeholder="$t('product.productnamehint_en')" show-word-limit />
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('product.productbrief')" prop="productBrief_ZH" v-if="langType == 'zh'">
|
|
<el-input type="textarea" :rows="2"
|
|
v-model="form.productBrief_ZH" class="form-content-item-input" :placeholder="$t('product.productbriefhint')" show-word-limit />
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('product.productbrief_en')" prop="productBrief_EN" v-if="langType == 'en'">
|
|
<el-input type="textarea" :rows="2"
|
|
v-model="form.productBrief_EN" class="form-content-item-input" :placeholder="$t('product.productbriefhint_en')" show-word-limit />
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('product.platformproductclassify')" prop="classifyId">
|
|
<el-cascader v-model="form.classifyId" :options="classifyList" clearable :props="{
|
|
checkStrictly: false,
|
|
label: 'categoryName',
|
|
value: 'id',
|
|
children: 'childs'
|
|
}" @change="handleChangeCascader" />
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('product.productgroup')" prop="shopGroupId">
|
|
<el-select v-model="form.shopGroupId" :placeholder="$t('product.productgrouphint')" clearable>
|
|
<el-option v-for="(item, index) in groupList" :key="index" :label="item.groupName"
|
|
:value="item.shopGroupId" />
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('product.businessproductclassify')" prop="classifyBusinessId">
|
|
<el-cascader v-model="form.classifyBusinessId" :options="classifyBusinessList" clearable :props="{
|
|
checkStrictly: false,
|
|
label: 'categoryName',
|
|
value: 'id',
|
|
children: 'childs'
|
|
}" @change="handleChangePlatformCascader" />
|
|
</el-form-item>
|
|
|
|
<!-- <el-form-item label="商家商品分组:" prop="shopGroupBusinessId">
|
|
<el-select v-model="form.shopGroupBusinessId" placeholder="请选择商品分组" clearable>
|
|
<el-option v-for="(item, index) in groupBusinessList" :key="index" :label="item.groupName"
|
|
:value="item.shopGroupBusinessId" />
|
|
</el-select>
|
|
</el-form-item> -->
|
|
|
|
<el-form-item :label="$t('product.brand')">
|
|
<el-select v-model="form.brandId" clearable :placeholder="$t('product.brandhint')">
|
|
<el-option v-for="item in brandList" :key="item.id" :label="item.brandName" :value="item.id" />
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item class="form-item-long" :label="$t('product.supplier')">
|
|
<el-input v-model="form.supplierName" maxlength="100" class="form-content-item-input" show-word-limit :placeholder="$t('product.supplierhint')" />
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('product.productimg')">
|
|
<div class="upload-wrap">
|
|
<el-upload list-type="picture-card" :on-preview="handlePictureCardPreview" :on-remove="handleRemove"
|
|
:headers="headers" :data="dataObj" :file-list="form.images" :limit="20" :on-success="handleImageSuccess"
|
|
:action="action">
|
|
<i slot="default" class="el-icon-plus" />
|
|
<div slot="file" slot-scope="{ file }">
|
|
<img class="el-upload-list__item-thumbnail" :src="file.imgPath">
|
|
<span class="el-upload-list__item-actions">
|
|
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
|
|
<i class="el-icon-zoom-in" />
|
|
</span>
|
|
<span class="el-upload-list__item-delete" @click="handleRemove(file)">
|
|
<i class="el-icon-delete" />
|
|
</span>
|
|
</span>
|
|
</div>
|
|
</el-upload>
|
|
</div>
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('product.specification')">
|
|
<el-button class="add-attr-btn" type="primary" @click="showEditSkuAttr">{{ $t('common.edit') }}</el-button>
|
|
</el-form-item>
|
|
|
|
<div class="style-container">
|
|
<div class="multiple-styles">
|
|
<el-button class="add-attr-btn" type="primary" @click="showOneSetting">{{ $t('common.one-click-setting') }}</el-button>
|
|
<el-table :data="form.skus" style="width: 100%"
|
|
:header-cell-style="{ background: '#EEF3FF', color: '#333333' }">
|
|
<el-table-column v-for="(skuAttr, index) in form.names" :key="index" :label="langType=='en' ? skuAttr.skuName_EN : skuAttr.skuName_ZH">
|
|
<template slot-scope="scope">
|
|
{{
|
|
scope.row.skuAttrCodeDTOList && scope.row.skuAttrCodeDTOList[index] | attrValueFilter(form.names, langType)
|
|
}}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column :label="$t('product.price')">
|
|
<template slot-scope="scope">
|
|
<!-- <el-input v-model="scope.row.price" type="number" oninput="value=value.replace(/-/, '')" /> -->
|
|
<el-input-number v-model="scope.row.price" :controls="false" :max="999999999" :min="0" :precision="2"
|
|
:step="0.01" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column :label="$t('product.originalprice')">
|
|
<template slot-scope="scope">
|
|
<!-- <el-input v-model="scope.row.originalPrice" type="number" oninput="value=value.replace(/-/, '')" /> -->
|
|
<el-input-number v-model="scope.row.originalPrice" :controls="false" :max="999999999" :min="0"
|
|
:precision="2" :step="0.01" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column :label="$t('product.rate')">
|
|
<template slot-scope="scope">
|
|
<el-input-number v-model="scope.row.rate" :controls="false" :min="0" :precision="2" :step="0.01" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column :label="$t('logistics.storehouse')">
|
|
<template slot-scope="scope">
|
|
<el-select v-model="scope.row.storehouseId" :placeholder="$t('logistics.storehousehint')" clearable>
|
|
<el-option v-for="(item, index) in storehouseList" :key="index" :label="item.storehouseName"
|
|
:value="item.storehouseId" />
|
|
</el-select>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column :label="$t('product.inventory')">
|
|
<template slot-scope="scope">
|
|
<!-- <el-input v-model="scope.row.stockNumber" type="number" oninput="value=value.replace(/[^\d]/g,'')" /> -->
|
|
<el-input-number v-model="scope.row.stockNumber" :disabled="true" :controls="false" :max="999999999"
|
|
:min="0" :precision="0" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column :label="$t('product.weight')">
|
|
<template slot-scope="scope">
|
|
<!-- <el-input v-model="scope.row.weight" type="number" oninput="value=value.replace(/-/, '')" /> -->
|
|
<el-input-number v-model="scope.row.weight" :controls="false" :max="999" :min="0" :precision="6"
|
|
:step="0.01" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column :label="$t('product.Internationalbarcode')" width="120">
|
|
<template slot-scope="scope">
|
|
<el-input v-model="scope.row.sku" maxlength="20" />
|
|
</template>
|
|
</el-table-column>
|
|
<!-- <el-table-column :label="$t('common.operate')">
|
|
<template slot-scope="scope">
|
|
<el-button type="text" @click="delAttrValue(scope.row,scope.$index,scope.row,scope)">{{ $t('common.delete') }}</el-button>
|
|
</template>
|
|
</el-table-column> -->
|
|
</el-table>
|
|
</div>
|
|
</div>
|
|
|
|
<el-form-item :label="$t('product.productdetail')" v-if="langType == 'zh'" style="margin-bottom: 5px;">
|
|
|
|
</el-form-item>
|
|
<Tinymce v-if="showTinymce && langType == 'zh'" ref="content" v-model="form.productText_ZH" style="width: 99%;" class="tinymce-wrap"
|
|
:height="200" />
|
|
|
|
<el-form-item :label="$t('product.productdetail_en')" v-if="langType == 'en'" style="margin-bottom: 5px;">
|
|
|
|
</el-form-item>
|
|
<Tinymce v-if="showTinymce && langType == 'en'" ref="content" v-model="form.productText_EN" style="width: 99%;" class="tinymce-wrap"
|
|
:height="200" />
|
|
|
|
|
|
<div class="lastitem">
|
|
<div class="hitem">
|
|
<el-form-item :label="$t('product.needlogitics')" prop="ifLogistics">
|
|
<el-radio-group v-model="form.ifLogistics">
|
|
<el-radio :label="1">{{ $t('common.yes') }}</el-radio>
|
|
<el-radio :label="0">{{ $t('common.no') }}</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item :label="$t('product.allowoversold')" prop="ifOversold">
|
|
<el-radio-group v-model="form.ifOversold">
|
|
<el-radio :label="1">{{ $t('common.allow') }}</el-radio>
|
|
<el-radio :label="0">{{ $t('common.notallow') }}</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item :label="$t('product.ifnew_tips')" prop="ifNew">
|
|
<el-radio-group v-model="form.ifNew">
|
|
<el-radio :label="1">{{ $t('common.yes') }}</el-radio>
|
|
<el-radio :label="0">{{ $t('common.no') }}</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item :label="$t('product.iffirst_tips')" prop="ifFirst">
|
|
<el-radio-group v-model="form.ifFirst">
|
|
<el-radio :label="1">{{ $t('common.yes') }}</el-radio>
|
|
<el-radio :label="0">{{ $t('common.no') }}</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</div>
|
|
|
|
<div class="hitem">
|
|
|
|
<el-form-item :label="$t('product.shelvestate')" prop="shelveState">
|
|
<el-radio-group v-model="form.shelveState">
|
|
<el-radio :label="1">{{ $t('product.shelveson') }}</el-radio>
|
|
<el-radio :label="0">{{ $t('product.shelvesoff') }}</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('product.platshelvestate')" prop="platShelveState">
|
|
<el-radio-group v-model="form.platShelveState" :disabled="form.shelveState != 1">
|
|
<el-radio :label="1">{{ $t('product.shelveson') }}</el-radio>
|
|
<el-radio :label="0">{{ $t('product.shelvesoff') }}</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('product.iflowprice_tips')" prop="ifLowPrice">
|
|
<el-radio-group v-model="form.ifLowPrice">
|
|
<el-radio :label="1">{{ $t('common.yes') }}</el-radio>
|
|
<el-radio :label="0">{{ $t('common.no') }}</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('product.creditsexchange')" prop="ifCredit">
|
|
<el-radio-group v-model="form.ifCredit">
|
|
<el-radio :label="1">{{ $t('common.allow') }}</el-radio>
|
|
<el-radio :label="0">{{ $t('common.notallow') }}</el-radio>
|
|
</el-radio-group>
|
|
<p style="color: #cf0f0f">{{$t('product.credit_tips_1')}}</p>
|
|
</el-form-item>
|
|
<el-form-item v-if="form.ifCredit" class="form-item-long" :label="$t('product.credit_tips')" prop="creditLimit">
|
|
<!-- <el-input v-model="form.creditLimit" type="number" placeholder="请输入单笔最大抵扣" /> -->
|
|
<el-input-number v-model="form.creditLimit" :controls="false" :max="999999999" :min="0" :precision="0"
|
|
:placeholder="$t('product.credit_limit_hint')" />
|
|
<p style="color: #cf0f0f; height: 25px; line-height: 25px;margin-top: 10px">{{$t('product.credit_tips_2')}}</p>
|
|
<p style="color: #cf0f0f; height: 25px; line-height: 25px">( {{$t('product.credit_tips_3', {integralProportion:integralProportion} )}} )</p>
|
|
</el-form-item>
|
|
<!-- <el-form-item label="花呗分期">-->
|
|
<!-- <el-radio-group v-model="form.ifHuabei">-->
|
|
<!-- <el-radio :label="1">支持</el-radio>-->
|
|
<!-- <el-radio :label="0">不支持</el-radio>-->
|
|
<!-- </el-radio-group>-->
|
|
<!-- </el-form-item>-->
|
|
</div>
|
|
</div>
|
|
</el-form>
|
|
</div>
|
|
|
|
<div class="footer">
|
|
<div class="btn_list">
|
|
<span @click="back">{{ $t('common.cancel') }}</span>
|
|
<span @click="save">{{ $t('common.save') }}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 弹窗 -->
|
|
<el-dialog :visible.sync="dialogVisible" class="check-image-dialog" title="查看图片" center append-to-body>
|
|
<img width="100%" :src="dialogImageUrl" alt>
|
|
</el-dialog>
|
|
|
|
<el-dialog :visible.sync="editSkuAttrDialogVisible"
|
|
title="编辑规格" center append-to-body>
|
|
<EditSkuAttr
|
|
ref="EditSkuAttr"
|
|
:skuAttrList="newSkuAttrList"
|
|
@cancel="editSkuAttrCancel"
|
|
@sure="editSkuAttrSure"
|
|
/>
|
|
</el-dialog>
|
|
|
|
<one-setting ref="oneSetting" @onOnSetting="onOnSetting"/>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import Tinymce from '@/components/Tinymce'
|
|
import EditSkuAttr from '@/views/commodity/commoditySystem/editSkuAttr.vue'
|
|
import {
|
|
getGroupSelect,
|
|
getClassify,
|
|
getClassifyAdd,
|
|
getClassifyGetById,
|
|
getClassifyUpdate,
|
|
getBrandList
|
|
} from '@/api/commodity'
|
|
import {
|
|
getSelect
|
|
} from '@/api/account';
|
|
import { uploadUrl } from '@/utils/request'
|
|
import { getToken,getBusinessId, getLanguage } from '@/utils/auth'
|
|
import { storehouseGetAll } from '@/api/shopSys'
|
|
import { shopListGetAll } from '@/api/shop'
|
|
import OneSetting from "@/views/commodity/commoditySystem/oneSetting";
|
|
|
|
export default {
|
|
filters: {
|
|
attrValueFilter(map, list, langType) {
|
|
if (!map) {
|
|
return ''
|
|
}
|
|
const { code, valueCode } = map
|
|
for(let item of list) {
|
|
if (item.code === code){
|
|
const { values } = item
|
|
for(let attr of values){
|
|
if (attr.valueCode === valueCode) {
|
|
return langType == 'en' ? attr.skuValue_EN : attr.skuValue_ZH
|
|
}
|
|
}
|
|
}
|
|
}
|
|
return ''
|
|
}
|
|
},
|
|
components: {
|
|
OneSetting,
|
|
Tinymce,
|
|
EditSkuAttr
|
|
},
|
|
props: {
|
|
productId: {
|
|
type: Number,
|
|
default: 0
|
|
},
|
|
showTinymce: {
|
|
type: Boolean
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
//品牌列表
|
|
brandList: [],
|
|
action: uploadUrl,
|
|
langType : 'zh',
|
|
|
|
headers: {
|
|
'Authorization-business': getToken()
|
|
},
|
|
dataObj: {
|
|
folderId: 1
|
|
},
|
|
form: {
|
|
shopId: '',
|
|
productId: null, //商品Id
|
|
productName_ZH: '', // 商品名称
|
|
productName_EN: '', // 商品名称
|
|
productBrief_ZH: '', // 商品简介
|
|
productBrief_EN: '', // 商品简介
|
|
shopGroupId: '', // 商品分组id
|
|
classifyId: '', // 分类id
|
|
// shopPlatformGroupId: '', // 商品分组id
|
|
classifyBusinessId: '', // 分类id
|
|
supplierId: null, // 供应商Id
|
|
supplierName: '', // 供应商名称
|
|
brandId: null, // 品牌ID
|
|
ifLogistics: '', // 是否需要物流 1-是 0-否
|
|
shelveState: '', // 是否上架 1-上架 0-不上架
|
|
platshelvestate: '', // 是否平台上架 1-上架 0-不上架
|
|
ifOversold: '', // 是否允许超卖 1-是 0-否
|
|
ifCredit: '', // 是否支持积分兑换 1-是 0-否
|
|
creditLimit: '', // 单笔订单限制使用多少积分
|
|
ifHuabei: 1, // 是否支持花呗分期 1-是 0-否
|
|
ifNew: '', // 是否新品 1-是 0-否
|
|
ifFirst: '', // 是否首发 1-是 0-否
|
|
ifLowPrice: '', //是否低价 1-是 0-否
|
|
productText_ZH: '', // 商品描述（富文本）
|
|
productText_EN: '', // 商品描述（富文本）
|
|
attrStyle: 1,//单款式还是多款式,0为单款式，1为多款式
|
|
images: [], // "图片地址"
|
|
deletes: [], // 删除的规格id数组
|
|
langInfoMap:[],
|
|
names: [
|
|
{
|
|
code: '', // 级别
|
|
skuName_ZH: '',
|
|
skuName_EN: '', // 规格名
|
|
needImg: false,
|
|
langInfoMap:[],
|
|
values: [
|
|
{
|
|
valueCode: '', // 级别
|
|
skuValue_ZH: '', // 规格值
|
|
skuValue_EN: '', // 规格值
|
|
image: '', // 图片
|
|
langInfoMap:[]
|
|
}
|
|
]
|
|
}
|
|
],
|
|
|
|
skus: [
|
|
{
|
|
// 规格值
|
|
skuAttrCodeDTOList: [],
|
|
price: '', // 售价
|
|
originalPrice: '', // 原价
|
|
rate: '', // 税率
|
|
storehouseId: '',//仓库Id
|
|
isCross: 0, //是否跨境
|
|
stockNumber: '', // 库存数量
|
|
weight: '', // 重量
|
|
skuImage: '', // 配图地址
|
|
style: '', // 款式 0-单款式 1-多款式
|
|
sku: ''
|
|
}
|
|
],
|
|
},
|
|
newSkuAttrList : [
|
|
{
|
|
code: '', // 级别
|
|
skuName_ZH: '', // 规格名
|
|
skuName_EN: '', // 规格名
|
|
needImg: false,
|
|
values: [
|
|
{
|
|
valueCode: '', // 级别
|
|
skuValue_ZH: '', // 规格值
|
|
skuValue_EN: '', // 规格值
|
|
image: '' // 图片
|
|
}
|
|
]
|
|
}
|
|
],
|
|
//商品图片
|
|
imgList: [],
|
|
//商品分组
|
|
groupList: [],
|
|
//商品分组
|
|
// groupBusinessList: [],
|
|
//商店列表
|
|
shopList: [],
|
|
//商品分类
|
|
classifyList: [],
|
|
classifyBusinessList: [],
|
|
//仓库列表
|
|
storehouseList: [],
|
|
//查看图片地址
|
|
dialogImageUrl: '',
|
|
//查看图片弹出框
|
|
dialogVisible: false,
|
|
editSkuAttrDialogVisible:false,
|
|
//校验规则
|
|
rules: {
|
|
shopId: [{ required: true, message: this.$t('product.ownedshop_hint'), trigger: 'change' }],
|
|
// productName: [{ required: true, message: '请输入商品名称', trigger: 'blur' }],
|
|
shopGroupId: [{ required: true, message: this.$t('product.group_hint'), trigger: 'change' }],
|
|
// classifyId: [{ required: true, message: this.$t('product.category_hint'), trigger: 'change' }],
|
|
// shopPlatformGroupId: [{ required: true, message: '请选择平台商品分组', trigger: 'change' }],
|
|
// classifyBusinessId: [{ required: true, message: '请选择平台商品分类', trigger: 'change' }],
|
|
ifLogistics: [{ required: true, message: this.$t('product.logistics_hint'), trigger: 'change' }],
|
|
shelveState: [{ required: true, message: this.$t('product.shelve_state_hint'), trigger: 'change' }],
|
|
ifOversold: [{ required: true, message: this.$t('product.ifoversold_hint'), trigger: 'change' }],
|
|
ifFirst: [{ required: true, message: this.$t('product.iffirst_hint'), trigger: 'change' }],
|
|
ifNew: [{ required: true, message: this.$t('product.ifnew_hint'), trigger: 'change' }],
|
|
ifLowPrice: [{ required: true, message: this.$t('product.iflowprice_hint'), trigger: 'change' }],
|
|
ifCredit: [{ required: true, message: this.$t('product.credit_hint'), trigger: 'change' }],
|
|
creditLimit: [{ required: true, message: this.$t('product.credit_limit_hint'), trigger: 'blur' }]
|
|
},
|
|
integralList: [],
|
|
integralProportion: '' // 积分兑换金额比例
|
|
}
|
|
},
|
|
watch: {
|
|
productId: {
|
|
handler(nVal, oVal) {
|
|
if (nVal) {
|
|
// this.details()
|
|
}
|
|
}
|
|
},
|
|
},
|
|
mounted() {
|
|
// this.headers.tenant = 'MDAwMA=='
|
|
//获取分组信息
|
|
this.groups()
|
|
//获取分类信息
|
|
this.selectList()
|
|
//获取品牌信息
|
|
this.getBrandList()
|
|
//获取积分兑换信息
|
|
this.getCredit()
|
|
//仓库列表
|
|
this.getStorehouseList()
|
|
//商家列表
|
|
this.getShopList()
|
|
|
|
this.langType = getLanguage() || 'zh'
|
|
},
|
|
|
|
methods: {
|
|
|
|
handleChangeCascader() {
|
|
console.log(this.form.classifyId)
|
|
},
|
|
handleChangePlatformCascader() {
|
|
console.log(this.form.classifyBusinessId)
|
|
},
|
|
async getBrandList() {
|
|
const { data } = await getBrandList()
|
|
this.brandList = data
|
|
},
|
|
async getCredit() {
|
|
const res = await getSelect({ dictName: 'CREDIT_CONFIG' })
|
|
this.integralList = res.data
|
|
this.integralList.forEach((item) => {
|
|
if (item.dictName === 'credit_exchange_rate') {
|
|
this.integralProportion = item.dictDescribe
|
|
}
|
|
})
|
|
},
|
|
handlePictureCardPreview(file) {
|
|
console.log("imgPath:" + file.imgPath)
|
|
this.dialogImageUrl = file.imgPath
|
|
this.dialogVisible = true
|
|
},
|
|
handleImageSuccess(response) {
|
|
const url = response.data.url
|
|
this.form.images.push({
|
|
imgPath: url
|
|
})
|
|
},
|
|
handleRemove(file) {
|
|
const { imgPath } = file
|
|
this.form.images = this.form.images.filter(item => {
|
|
return item.imgPath !== imgPath
|
|
})
|
|
},
|
|
// 点击新增商品时表单数据重置
|
|
reset() {
|
|
|
|
this.form = {
|
|
shopId : '',
|
|
productId: null, //商品Id
|
|
productName_ZH: '', // 商品名称
|
|
productName_EN: '', // 商品名称
|
|
productBrief_ZH: '', // 商品简介
|
|
productBrief_EN: '', // 商品简介
|
|
shopGroupId: '', // 商品分组id
|
|
classifyId: '', // 分类id
|
|
// shopGroupBusinessId: '', // 商品分组id
|
|
classifPlatformId: '', // 分类id
|
|
supplierId: null, // 供应商Id
|
|
supplierName: '', // 供应商名称
|
|
brandId: null, // 品牌ID
|
|
ifLogistics: '', // 是否需要物流 1-是 0-否
|
|
shelveState: '', // 是否上架 1-上架 0-不上架
|
|
platShelveState: '', // 是否平台上架 1-上架 0-不上架
|
|
ifOversold: '', // 是否允许超卖 1-是 0-否
|
|
ifCredit: '', // 是否支持积分兑换 1-是 0-否
|
|
creditLimit: '', // 单笔订单限制使用多少积分
|
|
ifHuabei: 1, // 是否支持花呗分期 1-是 0-否
|
|
productText_ZH: '', // 商品描述（富文本）
|
|
productText_EN: '', // 商品描述（富文本）
|
|
attrStyle: 1,//单款式还是多款式,0为单款式，1为多款式
|
|
images: [], // "图片地址"
|
|
deletes: [], // 删除的规格id数组
|
|
names: [
|
|
{
|
|
code: '', // 级别
|
|
skuName_ZH: '', // 规格名
|
|
skuName_EN: '', // 规格名
|
|
needImg: false,
|
|
values: [
|
|
{
|
|
valueCode: '', // 级别
|
|
skuValue_ZH: '', // 规格值
|
|
skuValue_EN: '', // 规格值
|
|
image: '' // 图片
|
|
}
|
|
]
|
|
}
|
|
],
|
|
skus: [
|
|
{
|
|
skuAttrCodeDTOList: [
|
|
{
|
|
code: '',
|
|
valueCode: ''
|
|
}
|
|
],
|
|
price: '', // 售价
|
|
originalPrice: '', // 原价
|
|
rate: '', // 税率
|
|
storehouseId: '',//仓库Id
|
|
isCross: 0, //是否跨境
|
|
stockNumber: '', // 库存数量
|
|
weight: '', // 重量
|
|
skuImage: '', // 配图地址
|
|
style: '', // 款式 0-单款式 1-多款式
|
|
sku: ''
|
|
}
|
|
]
|
|
}
|
|
this.imgList = []
|
|
this.dialogImageUrl = ''
|
|
this.dialogVisible = false
|
|
},
|
|
back() { this.$emit('cancel') },
|
|
// 保存
|
|
async save() {
|
|
this.$refs['form'].validate((valid) => {
|
|
if (valid) {
|
|
if (
|
|
(this.form.productName_ZH == "" ||
|
|
this.form.productName_ZH == undefined) &&
|
|
(this.form.productName_EN == "" ||
|
|
this.addForm.productName_EN == undefined)
|
|
) {
|
|
this.$message({
|
|
message: this.$t('product.productname_hint'),
|
|
type: "error",
|
|
});
|
|
return;
|
|
}
|
|
|
|
this.doSave();
|
|
} else {
|
|
this.$message({
|
|
message: this.$t('common.inoutsuccess_hint'),
|
|
type: 'warning'
|
|
})
|
|
return false
|
|
}
|
|
})
|
|
|
|
},
|
|
deepClone(obj) {
|
|
var _obj = JSON.stringify(obj)
|
|
var objClone = JSON.parse(_obj)
|
|
return objClone
|
|
},
|
|
async doSave() {
|
|
if (this.form.skus.length === 1) {
|
|
if (this.form.skus[0].skuAttrCodeDTOList.length === 0) {
|
|
this.$message({
|
|
message: '请编辑规格',
|
|
type: 'warning'
|
|
})
|
|
return false
|
|
}
|
|
}
|
|
this.form.skus.forEach(element => {
|
|
//设置单多款式--默认多款式
|
|
element.style = this.form.attrStyle
|
|
})
|
|
this.form.names.forEach(element => {
|
|
element.need = element.needImg ? 1 : 0
|
|
})
|
|
for (let i = 0; i < this.form.skus.length; i++) {
|
|
let skuItem = this.form.skus[i];
|
|
if (skuItem.skuAttrCodeDTOList[0].code === '') {
|
|
this.$message({
|
|
message: '请编辑规格',
|
|
type: 'warning'
|
|
})
|
|
return false
|
|
}
|
|
if (skuItem.rate === '' || skuItem.rate === null || skuItem.rate === undefined) {
|
|
this.$message({
|
|
message: '税率不能为空',
|
|
type: 'warning'
|
|
})
|
|
return false
|
|
}
|
|
|
|
if (skuItem.rate < 0) {
|
|
this.$message({
|
|
message: '税率必须大于0',
|
|
type: 'warning'
|
|
})
|
|
return false
|
|
}
|
|
if (skuItem.rate > 100) {
|
|
this.$message({
|
|
message: '税率必须小于100',
|
|
type: 'warning'
|
|
})
|
|
return false
|
|
}
|
|
|
|
if (skuItem.isCross === 1 && (skuItem.sku === '' || skuItem.sku === null || skuItem.sku === undefined)) {
|
|
this.$message({
|
|
message: '跨境商品必须设置国际条码',
|
|
type: 'warning'
|
|
})
|
|
return false
|
|
}
|
|
|
|
var storehouseId = skuItem.storehouseId;
|
|
if (storehouseId === '' || storehouseId === null || storehouseId === undefined || storehouseId === 0) {
|
|
this.$message({
|
|
message: '仓库不能为空',
|
|
type: 'warning'
|
|
})
|
|
return false
|
|
}
|
|
}
|
|
|
|
//防出错处理
|
|
this.form.classifyId = Array.isArray(this.form.classifyId) ? this.form.classifyId[this.form.classifyId.length - 1] : this.form.classifyId
|
|
this.form.classifyBusinessId = Array.isArray(this.form.classifyBusinessId) ? this.form.classifyBusinessId[this.form.classifyBusinessId.length - 1] : this.form.classifyBusinessId
|
|
|
|
//多语言转换
|
|
this.form.langInfoMap = {}
|
|
this.form.langInfoMap["zh"] = {};
|
|
this.form.langInfoMap["zh"].productName = this.form.productName_ZH;
|
|
this.form.langInfoMap["zh"].productBrief = this.form.productBrief_ZH;
|
|
this.form.langInfoMap["zh"].productText = this.form.productText_ZH;
|
|
this.form.langInfoMap["zh"].languageType = "zh";
|
|
this.form.langInfoMap["en"] = {};
|
|
this.form.langInfoMap["en"].productName = this.form.productName_EN;
|
|
this.form.langInfoMap["en"].productBrief = this.form.productBrief_EN;
|
|
this.form.langInfoMap["en"].productText = this.form.productText_EN;
|
|
this.form.langInfoMap["en"].languageType = "en";
|
|
|
|
if(this.form.names){
|
|
for(let nameValueParams of this.form.names){
|
|
nameValueParams.langInfoMap = {}
|
|
nameValueParams.langInfoMap["zh"] = {};
|
|
nameValueParams.langInfoMap["zh"].skuName = nameValueParams.skuName_ZH;
|
|
nameValueParams.langInfoMap["zh"].languageType = "zh";
|
|
nameValueParams.langInfoMap["en"] = {};
|
|
nameValueParams.langInfoMap["en"].skuName = nameValueParams.skuName_EN;
|
|
nameValueParams.langInfoMap["en"].languageType = "en";
|
|
for(let valueParams of nameValueParams.values){
|
|
valueParams.langInfoMap = {}
|
|
valueParams.langInfoMap["zh"] = {};
|
|
valueParams.langInfoMap["zh"].skuValue = valueParams.skuValue_ZH;
|
|
valueParams.langInfoMap["zh"].languageType = "zh";
|
|
valueParams.langInfoMap["en"] = {};
|
|
valueParams.langInfoMap["en"].skuValue = valueParams.skuValue_EN;
|
|
valueParams.langInfoMap["en"].languageType = "en";
|
|
}
|
|
}
|
|
}
|
|
|
|
if (this.productId) {
|
|
this.form.productId = this.productId
|
|
const res = await getClassifyUpdate(this.form)
|
|
|
|
if (res.code === '') {
|
|
this.$message({
|
|
type: 'success',
|
|
message: this.$t('common.successful')
|
|
})
|
|
this.back()
|
|
}
|
|
} else {
|
|
const res = await getClassifyAdd(this.form)
|
|
if (res.code === '') {
|
|
this.$message({
|
|
type: 'success',
|
|
message: this.$t('common.addsuccessful')
|
|
})
|
|
|
|
this.reset()
|
|
this.back()
|
|
}
|
|
}
|
|
},
|
|
// 获取商品分组
|
|
async groups() {
|
|
const res = await getGroupSelect({}, {project : "0"})
|
|
this.groupList = res.data
|
|
// const res1 = await getGroupSelect({
|
|
// }, {project : "" + getBusinessId()})
|
|
// this.groupBusinessList = res1.data
|
|
},
|
|
// 获取仓库
|
|
async getStorehouseList() {
|
|
const res = await storehouseGetAll({ page: 1, pageSize: 100 })
|
|
this.storehouseList = res.data.list
|
|
},
|
|
// 获取店铺列表
|
|
async getShopList() {
|
|
const res = await shopListGetAll()
|
|
this.shopList = res.data
|
|
},
|
|
// 获取详情--这个接口放在外部调用了，这里先不做修改
|
|
async details() {
|
|
const res = await getClassifyGetById({ productId: this.productId })
|
|
|
|
let itemData = res.data;
|
|
this.initLangInfo(itemData)
|
|
this.initSkuLangInfo(itemData)
|
|
this.form = { ...itemData, attrStyle: itemData.skus[0].style }
|
|
},
|
|
initSkuLangInfo(itemData){
|
|
if(itemData && itemData.names){
|
|
itemData.names.forEach(nameItemData => {
|
|
if(nameItemData && nameItemData.langInfoMap && nameItemData.langInfoMap['zh']){
|
|
nameItemData.skuName_ZH = nameItemData.langInfoMap['zh'].skuName;
|
|
}else{
|
|
nameItemData.skuName_ZH = "";
|
|
}
|
|
if(nameItemData && nameItemData.langInfoMap && nameItemData.langInfoMap['en']){
|
|
nameItemData.skuName_EN = nameItemData.langInfoMap['en'].skuName;
|
|
}else{
|
|
nameItemData.skuName_EN = "";
|
|
}
|
|
if(nameItemData && nameItemData.values){
|
|
nameItemData.values.forEach(valueItemData => {
|
|
if(valueItemData && valueItemData.langInfoMap && valueItemData.langInfoMap['zh']){
|
|
valueItemData.skuValue_ZH = valueItemData.langInfoMap['zh'].skuValue;
|
|
}else{
|
|
valueItemData.skuValue_ZH = "";
|
|
}
|
|
if(valueItemData && valueItemData.langInfoMap && valueItemData.langInfoMap['en']){
|
|
valueItemData.skuValue_EN = valueItemData.langInfoMap['en'].skuValue;
|
|
}else{
|
|
valueItemData.skuValue_EN = "";
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
},
|
|
initLangInfo(itemData){
|
|
if(itemData && itemData.langInfoMap && itemData.langInfoMap['zh']){
|
|
itemData.productName_ZH = itemData.langInfoMap['zh'].productName;
|
|
itemData.productBrief_ZH = itemData.langInfoMap['zh'].productBrief;
|
|
itemData.productText_ZH = itemData.langInfoMap['zh'].productText;
|
|
}else{
|
|
itemData.productName_ZH = "";
|
|
itemData.productBrief_ZH = "";
|
|
itemData.productText_ZH = "";
|
|
}
|
|
if(itemData && itemData.langInfoMap && itemData.langInfoMap['en']){
|
|
itemData.productName_EN = itemData.langInfoMap['en'].productName;
|
|
itemData.productBrief_EN = itemData.langInfoMap['en'].productBrief;
|
|
itemData.productText_EN = itemData.langInfoMap['en'].productText;
|
|
}else{
|
|
itemData.productName_EN = "";
|
|
itemData.productBrief_EN = "";
|
|
itemData.productText_EN = "";
|
|
}
|
|
|
|
},
|
|
|
|
async selectList() {
|
|
const res = await getClassify({}, {project : "0"})
|
|
this.classifyList = this.filterList(res.data)
|
|
|
|
const res1 = await getClassify({}, {project : "" + getBusinessId()})
|
|
this.classifyBusinessList = this.filterList(res1.data)
|
|
},
|
|
filterList(data) {
|
|
data.forEach(i => {
|
|
if (i.childs.length) {
|
|
this.filterList(i.childs)
|
|
} else {
|
|
i.childs = null
|
|
}
|
|
})
|
|
return data
|
|
},
|
|
skuFormat() {
|
|
const skuListArray = []
|
|
const result = {
|
|
productId: '',
|
|
isDelete: 0,
|
|
skuAttrCodeDTOList: [
|
|
{
|
|
code: '',
|
|
valueCode: ''
|
|
}
|
|
],
|
|
sku: '',
|
|
skuImage: '',
|
|
price: 0,
|
|
originalPrice: 0,
|
|
stockNumber: 0,
|
|
weight: 0,
|
|
storehouseId: '',
|
|
isCross: 0,
|
|
rate: '', // 税率
|
|
style: '', // 款式 0-单款式 1-多款式
|
|
}
|
|
const doExchange = (arr, depth) => {
|
|
const map = {
|
|
arr: []
|
|
}
|
|
for (var i = 0; i < arr[depth].length; i++) {
|
|
map.arr.push(arr[depth][i])
|
|
const { code, valueCode, attrId } = arr[depth][i]
|
|
result.skuAttrCodeDTOList[depth] = {
|
|
code,
|
|
valueCode,
|
|
attrId
|
|
}
|
|
if (depth !== arr.length - 1) {
|
|
doExchange(arr, depth + 1)
|
|
} else {
|
|
skuListArray.push(JSON.parse(JSON.stringify(result)))
|
|
}
|
|
}
|
|
}
|
|
|
|
// 获取规格值的所有组合
|
|
const values = []
|
|
//重新生成规格数据
|
|
this.form.names.map((skuItem, index) => {
|
|
const attrList = []
|
|
skuItem.code = skuItem.code || 'attr_code_' + index
|
|
const { code } = skuItem
|
|
skuItem.values && skuItem.values.map((attrItem, index1) => {
|
|
attrItem.valueCode = attrItem.valueCode || code + '_value_' + index1
|
|
const skuId = attrItem.skuId
|
|
const attrId = attrItem.attrId
|
|
if (attrItem.skuValue_EN || attrItem.skuValue_ZH) {
|
|
attrList.push({
|
|
skuId,
|
|
attrId,
|
|
code,
|
|
valueCode: attrItem.valueCode
|
|
})
|
|
}
|
|
})
|
|
if (attrList.length) {
|
|
values.push(attrList)
|
|
}
|
|
})
|
|
|
|
// 相互组合
|
|
if (values.length) {
|
|
doExchange(values, 0)
|
|
}
|
|
this.form.skus = skuListArray.map(sku1 => {
|
|
const findSku = this.form.skus.find(sku2 => {
|
|
|
|
if (!sku2.skuAttrCodeDTOList) {
|
|
return false
|
|
}
|
|
if (sku2.skuAttrCodeDTOList.length != sku1.skuAttrCodeDTOList.length) {
|
|
return false
|
|
}
|
|
const valueCodeList = sku2.skuAttrCodeDTOList.map(item => item.valueCode)
|
|
var result = sku1.skuAttrCodeDTOList.every(item => valueCodeList.indexOf(item.valueCode) !== -1)
|
|
|
|
return result
|
|
})
|
|
if (findSku) {
|
|
return findSku
|
|
} else {
|
|
return sku1
|
|
}
|
|
})
|
|
},
|
|
showEditSkuAttr(){
|
|
this.newSkuAttrList = JSON.parse(JSON.stringify(this.form.names))
|
|
this.editSkuAttrDialogVisible = true;
|
|
},
|
|
editSkuAttrCancel(){
|
|
console.log('cancel')
|
|
this.editSkuAttrDialogVisible = false;
|
|
},
|
|
editSkuAttrSure(){
|
|
console.log('save')
|
|
this.editSkuAttrDialogVisible = false;
|
|
this.form.names = JSON.parse(JSON.stringify(this.newSkuAttrList))
|
|
console.log(this.form.names)
|
|
this.skuFormat()
|
|
},
|
|
|
|
showOneSetting() {
|
|
this.$refs.oneSetting.showOnSetDialog = true
|
|
},
|
|
|
|
onOnSetting(settingInfo){
|
|
console.log('onOnSetting--->', settingInfo)
|
|
this.form.skus.forEach(sku => {
|
|
sku.price = settingInfo.price
|
|
sku.originalPrice = settingInfo.originalPrice
|
|
sku.rate = settingInfo.rate
|
|
sku.storehouseId = settingInfo.storehouseId
|
|
sku.weight = settingInfo.weight
|
|
sku.sku = settingInfo.sku
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang='scss'>
|
|
@import url("../../../styles/elDialog.scss");
|
|
|
|
.edit_add_page {
|
|
padding: 0px;
|
|
|
|
.content {
|
|
overflow: hidden;
|
|
|
|
.detail_title {
|
|
font-size: 16px;
|
|
font-weight: 500;
|
|
padding-left: 10px;
|
|
line-height: 16px;
|
|
margin-bottom: 15px;
|
|
margin-top: 10px;
|
|
position: relative;
|
|
|
|
&::before {
|
|
content: "";
|
|
height: 16px;
|
|
width: 4px;
|
|
background-color: #183ECD;
|
|
position: absolute;
|
|
left: 0px;
|
|
display: block;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
|
|
::v-deep .el-form-item__label {
|
|
vertical-align: middle;
|
|
float: left;
|
|
padding: 0 12px 0 0;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
|
|
font-size: 14px;
|
|
font-family: PingFang SC;
|
|
font-weight: 400;
|
|
color: #404F64;
|
|
line-height: 36px;
|
|
text-align: right;
|
|
}
|
|
|
|
|
|
::v-deep .el-input-number.is-without-controls .el-input__inner {
|
|
padding-left: 15px;
|
|
padding-right: 15px;
|
|
}
|
|
|
|
::v-deep .el-input-number .el-input__inner {
|
|
padding-left: 10px;
|
|
padding-right: 50px;
|
|
text-align: center;
|
|
}
|
|
::v-deep .el-input-number{
|
|
width: 120px;
|
|
}
|
|
|
|
.el-form {
|
|
.el-form-item {
|
|
label.el-form-item__label {
|
|
font-size: 16px !important;
|
|
color: red !important;
|
|
}
|
|
}
|
|
|
|
.lastitem {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: nowrap;
|
|
align-content: flex-start;
|
|
justify-content: flex-start;
|
|
align-items: flex-start;
|
|
margin-top: 22px;
|
|
|
|
.hitem {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex-wrap: nowrap;
|
|
align-content: flex-start;
|
|
justify-content: flex-start;
|
|
align-items: flex-start;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.photo {
|
|
padding: 70px 100px;
|
|
|
|
.avatar-uploader {
|
|
width: 180px;
|
|
|
|
.el-icon-plus,
|
|
img {
|
|
width: 180px;
|
|
height: 180px;
|
|
line-height: 180px;
|
|
border: 1px #bbb solid;
|
|
border-radius: 4px 4px 0px 4px;
|
|
margin-bottom: 10px;
|
|
text-align: center;
|
|
}
|
|
|
|
img {
|
|
border: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.attr-value-list {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
|
|
.main-diagram {
|
|
width: 100px;
|
|
|
|
.span-wrap {
|
|
position: relative;
|
|
display: inline-block;
|
|
margin-top: 10px;
|
|
|
|
.attr-actions {
|
|
line-height: 100px;
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
left: 0;
|
|
top: 0;
|
|
cursor: default;
|
|
text-align: center;
|
|
color: #fff;
|
|
opacity: 0;
|
|
font-size: 20px;
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
-webkit-transition: opacity 0.3s;
|
|
transition: opacity 0.3s;
|
|
z-index: 1;
|
|
|
|
&:hover {
|
|
opacity: 1;
|
|
|
|
.attr-preview {
|
|
display: inline-block;
|
|
}
|
|
|
|
i {
|
|
color: #fff;
|
|
font-size: 20px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.attr-preview {
|
|
display: none;
|
|
cursor: pointer;
|
|
font-size: 20px;
|
|
color: #fff;
|
|
}
|
|
|
|
.attr-delete {
|
|
margin-left: 15px;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
.attr-value-img {
|
|
width: 100%;
|
|
height: 100%;
|
|
|
|
img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.m-8 {
|
|
margin-right: 8px;
|
|
}
|
|
|
|
.upload-btn {
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
height: 110px;
|
|
cursor: pointer;
|
|
border: 2px dashed #2e60f8;
|
|
border-radius: 2px;
|
|
background-color: #f8f9fb;
|
|
text-align: center;
|
|
font-size: 20px;
|
|
color: #2e60f8;
|
|
|
|
i {
|
|
color: #2e60f8;
|
|
font-size: 20px;
|
|
}
|
|
|
|
.upload-title {
|
|
margin-left: 10px;
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
|
|
.upload-wrap {
|
|
margin-bottom: 25px;
|
|
|
|
.el-upload-list__item {
|
|
transition: none !important;
|
|
}
|
|
|
|
.el-upload,
|
|
.el-upload-list__item {
|
|
width: 100px;
|
|
height: 100px;
|
|
line-height: 100px;
|
|
}
|
|
|
|
.el-progress,
|
|
.el-progress-circle {
|
|
width: 80px !important;
|
|
height: 80px !important;
|
|
}
|
|
}
|
|
|
|
.sku-attr-list {
|
|
.el-input {
|
|
width: 100px;
|
|
}
|
|
}
|
|
|
|
.single-style {
|
|
.el-input {
|
|
max-width: 100px;
|
|
}
|
|
}
|
|
|
|
.add-attr-btn {
|
|
margin-bottom: 25px;
|
|
}
|
|
|
|
.check-image-dialog {
|
|
.el-dialog {
|
|
margin-top: 25px;
|
|
|
|
.el-dialog__body {
|
|
img {
|
|
max-width: 100%;
|
|
max-height: 100%;
|
|
height: 500px;
|
|
object-fit: contain;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.delImg {
|
|
position: absolute;
|
|
top: 12px;
|
|
margin-left: -24px
|
|
}
|
|
|
|
.delImg:hover {
|
|
border-radius: 50%;
|
|
color: #ffffff;
|
|
background: #2e60f8;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
|
|
.footer {
|
|
height: 80px;
|
|
line-height: 80px;
|
|
font-size: 24px;
|
|
position: relative;
|
|
border-top: 1px solid #e0e5eb;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-content: center;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex-wrap: nowrap;
|
|
|
|
.btn_list {
|
|
position: absolute;
|
|
|
|
top: 0;
|
|
height: 36px;
|
|
|
|
span {
|
|
padding: 0;
|
|
margin: 0;
|
|
width: 68px;
|
|
height: 36px;
|
|
line-height: 36px;
|
|
text-align: center;
|
|
display: inline-block;
|
|
/* font-size: 16px; */
|
|
border-radius: 4px;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
font-size: 14px;
|
|
font-family: PingFang SC;
|
|
font-weight: 400;
|
|
|
|
&:hover {
|
|
cursor: pointer;
|
|
}
|
|
|
|
&:nth-child(1) {
|
|
background: rgba(255, 255, 255, 1);
|
|
order: 1px solid rgba(224, 229, 235, 1);
|
|
margin-right: 10px;
|
|
border: 1px solid rgba(224, 229, 235, 1);
|
|
}
|
|
|
|
&:nth-child(2) {
|
|
background: #183ECD;
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.timeInfo {
|
|
font-size: 12px;
|
|
color: #999999;
|
|
}
|
|
|
|
.form-content-item-input{
|
|
width:615px
|
|
}
|
|
}
|
|
</style>
|