1168 lines
34 KiB
Vue
1168 lines
34 KiB
Vue
<template>
|
||
<el-dialog
|
||
v-if="dialogVisible"
|
||
title="商品审核"
|
||
v-el-drag-dialog
|
||
:visible.sync="dialogVisible"
|
||
:append-to-body="isAppend"
|
||
width="1260px"
|
||
top="60px"
|
||
:before-close="handleClose"
|
||
class="projectInfo"
|
||
>
|
||
<div class="acea-row mt10" v-if="isShow">
|
||
<span class="sp"
|
||
>店铺名称：{{
|
||
projectData.merchant && projectData.merchant.mer_name
|
||
}}</span
|
||
>
|
||
<span class="sp"
|
||
>入驻企业名称：{{
|
||
projectData.merchant &&
|
||
projectData.merchant.ext.com &&
|
||
projectData.merchant.ext.com.name
|
||
}}</span
|
||
>
|
||
<span class="sp"
|
||
>店铺联系人:
|
||
{{ projectData.merchant && projectData.merchant.real_name }}</span
|
||
>
|
||
<span class="sp" v-if="projectData.merchant">
|
||
营业执照：
|
||
<div class="demo-image__preview">
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="projectData.merchant.mer_cert"
|
||
:preview-src-list="[projectData.merchant.mer_cert]"
|
||
/>
|
||
</div>
|
||
</span>
|
||
|
||
<span class="sp"
|
||
>联系人电话：{{
|
||
projectData.merchant && projectData.merchant.service_phone
|
||
}}</span
|
||
>
|
||
<span class="sp" v-if="projectData.refusal"
|
||
>上传拒绝原因：{{ projectData.refusal }}</span
|
||
>
|
||
</div>
|
||
<div class="acea-row" v-if="isShow">
|
||
<span class="sp">商品id：{{ projectData.product_id }}</span>
|
||
<span class="sp">商品名称：{{ projectData.store_name }}</span>
|
||
<span class="sp"
|
||
>平台分类：{{
|
||
projectData.storeCategory ? projectData.storeCategory.cate_name : ""
|
||
}}</span
|
||
>
|
||
<!-- <span class="sp">品牌：{{ projectData.brand?projectData.brand.brand_name:'其他' }}</span> -->
|
||
<span class="sp">商品关键字：{{ projectData.keyword }}</span>
|
||
<span class="sp">商品单位：{{ projectData.unit_name }}</span>
|
||
<span class="sp">
|
||
商品分类：
|
||
<template v-if="projectData.merCateId">
|
||
<span
|
||
v-for="(item, index) in projectData.merCateId"
|
||
:key="index"
|
||
class="mr10"
|
||
>{{ item.category ? item.category.cate_name : "" }}</span
|
||
>
|
||
</template>
|
||
<span v-else>-</span>
|
||
</span>
|
||
<span class="sp">商品简介：{{ projectData.store_info }}</span>
|
||
<span class="sp">商品备注：{{ projectData.remark }}</span>
|
||
<!-- <span class="sp"
|
||
>是否惠美乡村：{{ projectData.is_huimei ? "是" : "否" }}</span
|
||
> -->
|
||
<span class="sp100">
|
||
商品封面图：
|
||
<div class="demo-image__preview">
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="projectData.image"
|
||
:preview-src-list="[projectData.image]"
|
||
/>
|
||
</div>
|
||
</span>
|
||
</div>
|
||
<el-tabs
|
||
v-if="projectData && isShow"
|
||
v-model="activeNames"
|
||
v-loading="loading"
|
||
>
|
||
<el-tab-pane label="商品信息" name="first">
|
||
<div class="acea-row">
|
||
<span class="sp" v-if="projectData.temp && projectData.temp.name"
|
||
>运费模板：{{ projectData.temp ? projectData.temp.name : "" }}</span
|
||
>
|
||
<span class="sp100" v-if="projectData.temp && projectData.temp.info"
|
||
>运费说明：{{ projectData.temp ? projectData.temp.info : "" }}</span
|
||
>
|
||
|
||
<span v-if="projectData.video_link" class="sp100">
|
||
主图视频：
|
||
<video
|
||
style="width: 40%; height: 180px; border-radius: 10px"
|
||
:src="projectData.video_link"
|
||
controls="controls"
|
||
>
|
||
您的浏览器不支持 video 标签。
|
||
</video>
|
||
</span>
|
||
<span class="sp100"
|
||
>商品轮播图：
|
||
<div
|
||
v-for="(item, index) in projectData.slider_image"
|
||
:key="index"
|
||
class="pictrue"
|
||
>
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item"
|
||
:preview-src-list="[item]"
|
||
/>
|
||
</div>
|
||
</span>
|
||
</div>
|
||
</el-tab-pane>
|
||
<el-tab-pane label="资质信息" name="aptitude">
|
||
<span class="sp"
|
||
>商品名称：
|
||
<el-radio-group v-model="qualification.commodity_type">
|
||
<el-radio
|
||
:label="0"
|
||
class="radio"
|
||
:disabled="qualification.commodity_type == 1"
|
||
>国产</el-radio
|
||
>
|
||
<el-radio :label="1" :disabled="qualification.commodity_type == 0"
|
||
>进口</el-radio
|
||
>
|
||
</el-radio-group>
|
||
</span>
|
||
<div v-if="qualification.commodity_type == 0">
|
||
<span class="sp"
|
||
>生产企业名称：{{ qualification.production_name }}</span
|
||
>
|
||
<span class="upload">
|
||
<div class="upload_left">生产营业执照：</div>
|
||
<div class="upload_right">
|
||
<div
|
||
v-for="(item, index) in qualification.businessList"
|
||
:key="index"
|
||
>
|
||
<a
|
||
class="txt"
|
||
v-if="getType(item)"
|
||
:href="item.url"
|
||
target="downloadFile"
|
||
download
|
||
>{{ item.name }}</a
|
||
>
|
||
<div class="pictrue" v-else>
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item.url"
|
||
:preview-src-list="[item.url]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
<span class="upload">
|
||
<div class="upload_left">生产许可证：</div>
|
||
<div class="upload_right">
|
||
<div
|
||
v-for="(item, index) in qualification.licenceList"
|
||
:key="index"
|
||
>
|
||
<a
|
||
class="txt"
|
||
v-if="getType(item)"
|
||
:href="item.url"
|
||
target="downloadFile"
|
||
download
|
||
>{{ item.name }}</a
|
||
>
|
||
<div class="pictrue" v-else>
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item.url"
|
||
:preview-src-list="[item.url]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
<span class="upload">
|
||
<div class="upload_left">商标注册证：</div>
|
||
<div class="upload_right">
|
||
<div
|
||
v-for="(item, index) in qualification.trademarkList"
|
||
:key="index"
|
||
>
|
||
<a
|
||
class="txt"
|
||
v-if="getType(item)"
|
||
:href="item.url"
|
||
target="downloadFile"
|
||
download
|
||
>{{ item.name }}</a
|
||
>
|
||
<div class="pictrue" v-else>
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item.url"
|
||
:preview-src-list="[item.url]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
<span class="upload">
|
||
<div class="upload_left">销售授权及品牌方营业执照：</div>
|
||
<div class="upload_right">
|
||
<div
|
||
v-for="(item, index) in qualification.authorizedList"
|
||
:key="index"
|
||
>
|
||
<a
|
||
class="txt"
|
||
v-if="getType(item)"
|
||
:href="item.url"
|
||
target="downloadFile"
|
||
download
|
||
>{{ item.name }}</a
|
||
>
|
||
<div class="pictrue" v-else>
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item.url"
|
||
:preview-src-list="[item.url]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
<span class="upload">
|
||
<div class="upload_left">商品检测报告及备案：</div>
|
||
<div class="upload_right">
|
||
<div
|
||
v-for="(item, index) in qualification.commodityList"
|
||
:key="index"
|
||
>
|
||
<a
|
||
class="txt"
|
||
v-if="getType(item)"
|
||
:href="item.url"
|
||
target="downloadFile"
|
||
download
|
||
>{{ item.name }}</a
|
||
>
|
||
<div class="pictrue" v-else>
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item.url"
|
||
:preview-src-list="[item.url]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
<span class="upload">
|
||
<div class="upload_left">其他资质：</div>
|
||
<div class="upload_right">
|
||
<div
|
||
v-for="(item, index) in qualification.otherList"
|
||
:key="index"
|
||
>
|
||
<a
|
||
class="txt"
|
||
v-if="getType(item)"
|
||
:href="item.url"
|
||
target="downloadFile"
|
||
download
|
||
>{{ item.name }}</a
|
||
>
|
||
<div class="pictrue" v-else>
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item.url"
|
||
:preview-src-list="[item.url]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
</div>
|
||
<div v-if="qualification.commodity_type == 1">
|
||
<span class="sp"
|
||
>进口/企业境内总代企业名称: {{ qualification.import_name }}</span
|
||
>
|
||
<span class="upload">
|
||
<div class="upload_left">生产营业执照：</div>
|
||
<div class="upload_right">
|
||
<div
|
||
v-for="(item, index) in qualification.importBusinessList"
|
||
:key="index"
|
||
>
|
||
<a
|
||
class="txt"
|
||
v-if="getType(item)"
|
||
:href="item.url"
|
||
target="downloadFile"
|
||
download
|
||
>{{ item.name }}</a
|
||
>
|
||
<div class="pictrue" v-else>
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item.url"
|
||
:preview-src-list="[item.url]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
<span class="upload">
|
||
<div class="upload_left">销售授权及其他：</div>
|
||
<div class="upload_right">
|
||
<div
|
||
v-for="(item, index) in qualification.importAuthorizedList"
|
||
:key="index"
|
||
>
|
||
<a
|
||
class="txt"
|
||
v-if="getType(item)"
|
||
:href="item.url"
|
||
target="downloadFile"
|
||
download
|
||
>{{ item.name }}</a
|
||
>
|
||
<div class="pictrue" v-else>
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item.url"
|
||
:preview-src-list="[item.url]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
<span class="upload">
|
||
<div class="upload_left">海关检验检疫证书及报关单：</div>
|
||
<div class="upload_right">
|
||
<div
|
||
v-for="(item, index) in qualification.customsList"
|
||
:key="index"
|
||
>
|
||
<a
|
||
class="txt"
|
||
v-if="getType(item)"
|
||
:href="item.url"
|
||
target="downloadFile"
|
||
download
|
||
>{{ item.name }}</a
|
||
>
|
||
<div class="pictrue" v-else>
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item.url"
|
||
:preview-src-list="[item.url]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
<span class="upload">
|
||
<div class="upload_left">产品外包装实物图：</div>
|
||
<div class="upload_right">
|
||
<div
|
||
v-for="(item, index) in qualification.packingList"
|
||
:key="index"
|
||
>
|
||
<a
|
||
class="txt"
|
||
v-if="getType(item)"
|
||
:href="item.url"
|
||
target="downloadFile"
|
||
download
|
||
>{{ item.name }}</a
|
||
>
|
||
<div class="pictrue" v-else>
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item.url"
|
||
:preview-src-list="[item.url]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
<span class="upload">
|
||
<div class="upload_left">其他资质：</div>
|
||
<div class="upload_right">
|
||
<div
|
||
v-for="(item, index) in qualification.importOtherList"
|
||
:key="index"
|
||
>
|
||
<a
|
||
class="txt"
|
||
v-if="getType(item)"
|
||
:href="item.url"
|
||
target="downloadFile"
|
||
download
|
||
>{{ item.name }}</a
|
||
>
|
||
<div class="pictrue" v-else>
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item.url"
|
||
:preview-src-list="[item.url]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</span>
|
||
</div>
|
||
</el-tab-pane>
|
||
<el-tab-pane label="商品详情" name="second">
|
||
<span class="sp100">商品详情：</span>
|
||
<div class="contentPic" v-html="projectData.content" />
|
||
</el-tab-pane>
|
||
<el-tab-pane label="其他设置" name="third">
|
||
<span class="sp100">商品排序：{{ projectData.sort }}</span>
|
||
<span class="third mb20">
|
||
<span>商品推荐：</span>
|
||
<el-checkbox-group v-model="checkboxGroup" size="small">
|
||
<el-checkbox
|
||
v-for="(item, index) in recommend"
|
||
:key="index"
|
||
disabled
|
||
:label="item.value"
|
||
>{{ item.name }}</el-checkbox
|
||
>
|
||
</el-checkbox-group>
|
||
</span>
|
||
<span
|
||
v-if="
|
||
projectData.guarantee && projectData.guarantee.templateValue.length
|
||
"
|
||
class="third mb20"
|
||
>
|
||
<span>服务保障：</span>
|
||
<span
|
||
v-for="(item, index) in projectData.guarantee.templateValue"
|
||
:key="index"
|
||
>
|
||
<span v-if="item.value"
|
||
>{{ index + 1 }}. {{ item.value.guarantee_name }}；</span
|
||
>
|
||
</span>
|
||
</span>
|
||
</el-tab-pane>
|
||
<el-tab-pane label="商品规格" name="fourth">
|
||
<span class="sp"
|
||
>商品规格：{{
|
||
projectData.spec_type === 0 ? "单规格" : "多规格"
|
||
}}</span
|
||
>
|
||
<span class="sp"
|
||
>佣金设置：{{
|
||
projectData.extension_type === 0 ? "默认设置" : "单独设置"
|
||
}}</span
|
||
>
|
||
<span class="sp100">
|
||
<span class="mb15" style="display: block">商品规格:</span>
|
||
<template v-if="projectData.spec_type === 0">
|
||
<el-table :data="OneattrValue" border size="small">
|
||
<el-table-column align="center" label="图片" min-width="80">
|
||
<template slot-scope="scope">
|
||
<div class="demo-image__preview">
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="scope.row.image"
|
||
:preview-src-list="[scope.row.image]"
|
||
/>
|
||
</div>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column
|
||
v-for="(item, iii) in attrValue"
|
||
:key="iii"
|
||
:label="formThead[iii].title"
|
||
align="center"
|
||
min-width="80"
|
||
>
|
||
<template slot-scope="scope">
|
||
<a
|
||
v-if="formThead[iii].title == '依据链接'"
|
||
:href="scope.row[iii]"
|
||
target="_blank"
|
||
>{{ scope.row[iii] }}</a
|
||
>
|
||
<span v-else class="priceBox" v-text="scope.row[iii]" />
|
||
</template>
|
||
</el-table-column>
|
||
<template v-if="projectData.extension_type === 1">
|
||
<el-table-column
|
||
align="center"
|
||
label="一级返佣(元)"
|
||
min-width="120"
|
||
>
|
||
<template slot-scope="scope">
|
||
<span class="priceBox" v-text="scope.row.extension_one" />
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column
|
||
align="center"
|
||
label="二级返佣(元)"
|
||
min-width="120"
|
||
>
|
||
<template slot-scope="scope">
|
||
<span class="priceBox" v-text="scope.row.extension_two" />
|
||
</template>
|
||
</el-table-column>
|
||
</template>
|
||
</el-table>
|
||
</template>
|
||
<template v-if="projectData.spec_type === 1">
|
||
<el-table :data="ManyAttrValue" border size="small">
|
||
<template v-if="manyTabDate">
|
||
<el-table-column
|
||
v-for="(item, iii) in manyTabDate"
|
||
:key="iii"
|
||
align="center"
|
||
:label="manyTabTit[iii].title"
|
||
min-width="80"
|
||
>
|
||
<template slot-scope="scope">
|
||
<span class="priceBox" v-text="scope.row[iii]" />
|
||
</template>
|
||
</el-table-column>
|
||
</template>
|
||
<el-table-column align="center" label="图片" min-width="80">
|
||
<template slot-scope="scope">
|
||
<div class="upLoadPicBox">
|
||
<div class="pictrue tabPic">
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="scope.row.image"
|
||
:preview-src-list="[scope.row.image]"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column
|
||
v-for="(item, iii) in attrValue"
|
||
:key="iii"
|
||
:label="formThead[iii].title"
|
||
align="center"
|
||
min-width="80"
|
||
>
|
||
<template slot-scope="scope">
|
||
<a
|
||
v-if="formThead[iii].title == '依据链接'"
|
||
:href="scope.row[iii]"
|
||
target="_blank"
|
||
>{{ scope.row[iii] }}</a
|
||
>
|
||
<span v-else class="priceBox" v-text="scope.row[iii]" />
|
||
</template>
|
||
</el-table-column>
|
||
<template v-if="projectData.extension_type === 1">
|
||
<el-table-column
|
||
align="center"
|
||
label="一级返佣(元)"
|
||
min-width="120"
|
||
>
|
||
<template slot-scope="scope">
|
||
<span class="priceBox">{{ scope.row.extension_one }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column
|
||
align="center"
|
||
label="二级返佣(元)"
|
||
min-width="120"
|
||
>
|
||
<template slot-scope="scope">
|
||
<span class="priceBox">{{ scope.row.extension_two }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
</template>
|
||
</el-table>
|
||
</template>
|
||
</span>
|
||
</el-tab-pane>
|
||
</el-tabs>
|
||
<el-form
|
||
ref="ruleForm"
|
||
:model="ruleForm"
|
||
:rules="rules"
|
||
label-width="80px"
|
||
class="demo-ruleForm"
|
||
>
|
||
<el-form-item
|
||
:label="projectData.status == 15 ? '解锁状态' : '审核状态'"
|
||
prop="status"
|
||
>
|
||
<el-radio-group v-model="ruleForm.status">
|
||
<el-radio :label="1">通过</el-radio>
|
||
<el-radio :label="-1">拒绝</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
<el-form-item label="佐证图片" prop="status_img" label-width="80px">
|
||
<div class="acea-row">
|
||
<div
|
||
v-for="(item, index) in ruleForm.status_img"
|
||
:key="index"
|
||
class="pictrue"
|
||
draggable="false"
|
||
@dragstart="handleDragStart($event, item)"
|
||
@dragover.prevent="handleDragOver($event, item)"
|
||
@dragenter="handleDragEnter($event, item)"
|
||
@dragend="handleDragEnd($event, item)"
|
||
>
|
||
<!-- <img :src="item"> -->
|
||
<el-image
|
||
style="width: 60px; height: 60px"
|
||
:src="item"
|
||
:preview-src-list="[item]"
|
||
/>
|
||
<i class="el-icon-error btndel" @click="handleRemove(index)" />
|
||
</div>
|
||
<div
|
||
v-if="ruleForm.status_img.length < 10"
|
||
class="uploadCont"
|
||
title="750*750px"
|
||
>
|
||
<!-- <div class="upLoadPicBox" @paste="handlePaste" @click="modalPicTap('2')">
|
||
<div class="upLoad">
|
||
<i class="el-icon-camera cameraIconfont" />
|
||
</div>
|
||
</div> -->
|
||
<el-upload
|
||
:action="fileUrl"
|
||
:show-file-list="false"
|
||
list-type="picture-card"
|
||
multiple
|
||
:headers="myHeaders"
|
||
:on-success="setQualificationsList"
|
||
:before-upload="beforeUploadQualification"
|
||
>
|
||
<i class="el-icon-plus" />
|
||
</el-upload>
|
||
</div>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item
|
||
v-if="ruleForm.status === -1 || ruleForm.status === 15"
|
||
:label="projectData.status != 0 ? '锁定原因' : '拒绝原因'"
|
||
prop="refusal"
|
||
>
|
||
<el-input
|
||
v-model="ruleForm.refusal"
|
||
type="textarea"
|
||
placeholder="请输入原因"
|
||
/>
|
||
</el-form-item>
|
||
</el-form>
|
||
<div slot="footer" class="dialog-footer">
|
||
<el-button size="small" @click="dialogVisible = false">取 消</el-button>
|
||
<el-button size="small" type="primary" @click="onSubmit">确 定</el-button>
|
||
</div>
|
||
</el-dialog>
|
||
</template>
|
||
|
||
<script>
|
||
import SettingMer from "@/libs/settingMer";
|
||
import { getToken } from "@/utils/auth";
|
||
import elDragDialog from "@/directive/el-drag-dialog";
|
||
import {
|
||
productStatusUnlockApi,
|
||
productDetailApi,
|
||
productStatusApi,
|
||
productStatusFirstApi,
|
||
productStatusFirstTwoApi,
|
||
productStatusSecondApi,
|
||
} from "@/api/product";
|
||
import log from "@/libs/util.log";
|
||
const defaultObj = {
|
||
image: "",
|
||
slider_image: [],
|
||
store_name: "",
|
||
store_info: "",
|
||
keyword: "",
|
||
brand_id: "", // 品牌id
|
||
cate_id: "", // 平台分类id
|
||
mer_cate_id: [], // 商户分类id
|
||
unit_name: "",
|
||
sort: 0,
|
||
is_show: 0,
|
||
is_benefit: 0,
|
||
is_new: 0,
|
||
is_good: 0,
|
||
temp_id: "",
|
||
attrValue: [
|
||
{
|
||
image: "",
|
||
price: null,
|
||
svip_price: null,
|
||
cost: null,
|
||
ot_price: null,
|
||
proportion: 0.6,
|
||
coupon:'',
|
||
stock: 0,
|
||
growth: 0,
|
||
bar_code: "",
|
||
weight: null,
|
||
volume: null,
|
||
gist_url: null,
|
||
},
|
||
],
|
||
attr: [],
|
||
selectRule: "",
|
||
extension_type: 0,
|
||
content: "",
|
||
spec_type: 0,
|
||
};
|
||
const objTitle = {
|
||
price: {
|
||
title: "售价",
|
||
},
|
||
svip_price: {
|
||
title: "付费会员价",
|
||
},
|
||
cost: {
|
||
title: "成本价",
|
||
},
|
||
ot_price: {
|
||
title: "市场价",
|
||
},
|
||
proportion: {
|
||
title: "占比",
|
||
},
|
||
coupon:{
|
||
title:'抵扣券'
|
||
},
|
||
stock: {
|
||
title: "库存",
|
||
},
|
||
growth: {
|
||
title: "成长值",
|
||
},
|
||
bar_code: {
|
||
title: "商品编号",
|
||
},
|
||
weight: {
|
||
title: "重量（KG）",
|
||
},
|
||
volume: {
|
||
title: "体积(m³)",
|
||
},
|
||
gist_url: {
|
||
title: "依据链接",
|
||
},
|
||
};
|
||
const proOptions = [
|
||
{ name: "是否热卖", value: "is_hot" },
|
||
{ name: "优品推荐", value: "is_good" },
|
||
{ name: "特惠专区", value: "is_benefit" },
|
||
{ name: "是否精品", value: "is_best" },
|
||
{ name: "是否新品", value: "is_new" },
|
||
];
|
||
export default {
|
||
name: "Info",
|
||
props: {
|
||
isShow: {
|
||
type: Boolean,
|
||
default: true,
|
||
},
|
||
ids: {
|
||
type: Array,
|
||
default: () => [],
|
||
},
|
||
},
|
||
|
||
directives: {
|
||
elDragDialog,
|
||
},
|
||
data() {
|
||
return {
|
||
rules: {
|
||
status: [
|
||
{ required: true, message: "请选择审核状态", trigger: "change" },
|
||
],
|
||
refusal: [
|
||
{ required: true, message: "请填写拒绝原因", trigger: "blur" },
|
||
],
|
||
// status_img: [
|
||
// {type: 'array', required: true, message: '请上传佐证图片', trigger: 'blur' }
|
||
// ]
|
||
},
|
||
myHeaders: { "X-Token": getToken() },
|
||
isAppend: true,
|
||
proId: 0,
|
||
aptitude: 0,
|
||
qualification: {
|
||
production_name: "",
|
||
businessList: [],
|
||
licenceList: [],
|
||
trademarkList: [],
|
||
authorizedList: [],
|
||
commodityList: [],
|
||
otherList: [],
|
||
importBusinessList: [],
|
||
importAuthorizedList: [],
|
||
customsList: [],
|
||
packingList: [],
|
||
importOtherList: [],
|
||
commodity_type: 0,
|
||
brands_name: "",
|
||
import_name: "",
|
||
},
|
||
ruleForm: {
|
||
refusal: "",
|
||
status: 1,
|
||
id: "",
|
||
status_img: [],
|
||
},
|
||
formThead: Object.assign({}, objTitle),
|
||
manyTabDate: {},
|
||
manyTabTit: {},
|
||
loading: false,
|
||
dialogVisible: false,
|
||
activeNames: "first",
|
||
projectData: {
|
||
merchant: {
|
||
ext: {
|
||
com: {},
|
||
},
|
||
},
|
||
},
|
||
recommend: proOptions,
|
||
checkboxGroup: [],
|
||
svip_type: 0,
|
||
OneattrValue: [Object.assign({}, defaultObj.attrValue[0])], // 单规格
|
||
ManyAttrValue: [Object.assign({}, defaultObj.attrValue[0])], // 多规格
|
||
};
|
||
},
|
||
computed: {
|
||
fileUrl() {
|
||
return SettingMer.https + `/upload/image/0/file`;
|
||
},
|
||
attrValue() {
|
||
const obj = Object.assign({}, defaultObj.attrValue[0]);
|
||
if (this.svip_type == 0) delete obj.svip_price;
|
||
delete obj.image;
|
||
return obj;
|
||
},
|
||
oneFormBatch() {
|
||
const obj = [Object.assign({}, defaultObj.attrValue[0])];
|
||
delete obj[0].bar_code;
|
||
return obj;
|
||
},
|
||
},
|
||
methods: {
|
||
handlePaste(event) {
|
||
console.log("粘贴");
|
||
const items = (event.clipboardData || event.originalEvent.clipboardData)
|
||
.items;
|
||
let pasteFiles = [];
|
||
console.log(event);
|
||
},
|
||
// 上传文件之前的钩子函数
|
||
beforeUploadQualification() {
|
||
if (this.ruleForm.status_img.length >= 10) {
|
||
this.$message.error("上传文件最大数量为10张, 上传失败!");
|
||
return false;
|
||
} else {
|
||
return true;
|
||
}
|
||
},
|
||
// 上传成功
|
||
setQualificationsList(response) {
|
||
if (response.status === 200) {
|
||
this.ruleForm.status_img.push(response.data.src);
|
||
console.log(this.ruleForm.status_img);
|
||
} else {
|
||
this.$message.error(response.message);
|
||
}
|
||
},
|
||
handleRemove(i) {
|
||
this.ruleForm.status_img.splice(i, 1);
|
||
},
|
||
handleDragEnd(e, item) {
|
||
this.dragging = null;
|
||
},
|
||
handleDragEnter(e, item) {
|
||
e.dataTransfer.effectAllowed = "move";
|
||
if (item === this.dragging) {
|
||
return;
|
||
}
|
||
const newItems = [...this.ruleForm.status_img];
|
||
const src = newItems.indexOf(this.dragging);
|
||
const dst = newItems.indexOf(item);
|
||
newItems.splice(dst, 0, ...newItems.splice(src, 1));
|
||
this.ruleForm.status_img = newItems;
|
||
},
|
||
handleDragOver(e) {
|
||
e.dataTransfer.dropEffect = "move";
|
||
},
|
||
// 移动
|
||
handleDragStart(e, item) {
|
||
this.dragging = item;
|
||
},
|
||
getType(val) {
|
||
var regex = /(?:\.([^.]+))?$/;
|
||
let suffix = regex.exec(val.url)[1];
|
||
return suffix == "pdf";
|
||
},
|
||
// 点击商品图
|
||
modalPicTap(tit, num, i) {
|
||
const _this = this;
|
||
const attr = [];
|
||
this.$modalUpload(function (img) {
|
||
console.log(_this.ruleForm);
|
||
if (tit === "1" && !num) {
|
||
_this.ruleForm.status_img = img[0];
|
||
}
|
||
if (tit === "2" && !num) {
|
||
img.map((item) => {
|
||
attr.push(item.attachment_src);
|
||
_this.ruleForm.status_img.push(item);
|
||
if (_this.ruleForm.status_img.length > 10) {
|
||
_this.ruleForm.status_img.length = 10;
|
||
}
|
||
});
|
||
}
|
||
}, tit);
|
||
},
|
||
onSubmit() {
|
||
console.log(this.projectData);
|
||
let mode = {
|
||
0: {
|
||
api: productStatusFirstApi,
|
||
status: 9,
|
||
},
|
||
10: {
|
||
api: productStatusSecondApi,
|
||
status: 11,
|
||
},
|
||
9: {
|
||
api: productStatusFirstTwoApi,
|
||
status: 10,
|
||
},
|
||
11: {
|
||
api: productStatusApi,
|
||
status: 1,
|
||
},
|
||
15: {
|
||
api: productStatusUnlockApi,
|
||
status: 10,
|
||
},
|
||
};
|
||
this.$refs.ruleForm.validate((valid) => {
|
||
if (valid) {
|
||
let params = {};
|
||
if(this.isShow){
|
||
params = {
|
||
...this.ruleForm,
|
||
id:this.proId,
|
||
status:this.ruleForm.status == -1? -1: mode[this.projectData.status].status,
|
||
};
|
||
}else{
|
||
params = {
|
||
...this.ruleForm,
|
||
id:this.ids,
|
||
status:this.ruleForm.status == -1? -1:1
|
||
};
|
||
}
|
||
mode[this.isShow?this.projectData.status:11]
|
||
.api(params)
|
||
.then((res) => {
|
||
this.$message.success(res.message);
|
||
this.dialogVisible = false;
|
||
this.activeNames = "first";
|
||
this.$emit("subSuccess");
|
||
})
|
||
.catch((res) => {
|
||
this.listLoading = false;
|
||
this.$message.error(res.message);
|
||
});
|
||
}
|
||
});
|
||
},
|
||
handleClose() {
|
||
this.dialogVisible = false;
|
||
this.activeNames = "first";
|
||
},
|
||
getInfo(id) {
|
||
this.proId = id;
|
||
this.loading = true;
|
||
this.ruleForm.status_img = [];
|
||
this.ruleForm.status = 1;
|
||
this.ruleForm.refusal = "";
|
||
productDetailApi(id)
|
||
.then((res) => {
|
||
(this.projectData = res.data),
|
||
(this.ruleForm.status_img = res.data.status_img);
|
||
let qualification = {
|
||
production_name: "",
|
||
businessList: [],
|
||
licenceList: [],
|
||
trademarkList: [],
|
||
authorizedList: [],
|
||
commodityList: [],
|
||
otherList: [],
|
||
importBusinessList: [],
|
||
importAuthorizedList: [],
|
||
customsList: [],
|
||
packingList: [],
|
||
importOtherList: [],
|
||
commodity_type: 0,
|
||
brands_name: "",
|
||
import_name: "",
|
||
};
|
||
this.qualification = res.data.qualification || qualification;
|
||
this.qualification.commodityList = this.qualification.commodityList.slice(0,20)
|
||
this.svip_type = res.data.svip_price_type;
|
||
|
||
if (this.projectData.spec_type === 0) {
|
||
this.OneattrValue = res.data.attrValue;
|
||
} else {
|
||
this.ManyAttrValue = res.data.attrValue;
|
||
}
|
||
const tmp = {};
|
||
const tmpTab = {};
|
||
this.projectData.attr.forEach((o, i) => {
|
||
tmp["value" + i] = { title: o.value };
|
||
tmpTab["value" + i] = "";
|
||
});
|
||
this.manyTabDate = tmpTab;
|
||
this.manyTabTit = tmp;
|
||
this.checkboxGroup = [];
|
||
this.formThead = Object.assign({}, this.formThead, tmp);
|
||
if (this.projectData.is_hot === 1) this.checkboxGroup.push("is_hot");
|
||
if (this.projectData.is_good === 1)
|
||
this.checkboxGroup.push("is_good");
|
||
if (this.projectData.is_benefit === 1)
|
||
this.checkboxGroup.push("is_benefit");
|
||
if (this.projectData.is_best === 1)
|
||
this.checkboxGroup.push("is_best");
|
||
if (this.projectData.is_new === 1) this.checkboxGroup.push("is_new");
|
||
this.loading = false;
|
||
})
|
||
.catch((res) => {
|
||
this.$message.error(res.message);
|
||
this.loading = false;
|
||
});
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.projectInfo ::v-deep .el-dialog__body {
|
||
padding-top: 0 !important;
|
||
}
|
||
.pictrue {
|
||
width: 60px;
|
||
height: 60px;
|
||
border: 1px dotted rgba(0, 0, 0, 0.1);
|
||
margin-right: 10px;
|
||
position: relative;
|
||
cursor: pointer;
|
||
img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
::v-deep .el-upload--picture-card {
|
||
width: 58px;
|
||
height: 58px;
|
||
line-height: 70px;
|
||
}
|
||
.btndel {
|
||
position: absolute;
|
||
z-index: 1;
|
||
width: 20px !important;
|
||
height: 20px !important;
|
||
left: 46px;
|
||
top: -4px;
|
||
}
|
||
.upload {
|
||
display: flex;
|
||
flex-direction: row;
|
||
align-content: center;
|
||
height: 60px;
|
||
// line-height: 60px;
|
||
margin-bottom: 10px;
|
||
&_right {
|
||
display: flex;
|
||
height: 60px;
|
||
}
|
||
&_left {
|
||
width: 115px;
|
||
}
|
||
.txt {
|
||
width: 60px;
|
||
height: 60px;
|
||
line-height: 60px;
|
||
overflow: hidden;
|
||
display: inline-block;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
border: 1px solid #dcdfe6;
|
||
border-radius: 4px;
|
||
margin-right: 10px;
|
||
color: blue;
|
||
}
|
||
}
|
||
.projectInfo ::v-deep .el-tabs__content {
|
||
padding-left: 10px !important;
|
||
}
|
||
.tabPic {
|
||
width: 40px !important;
|
||
height: 40px !important;
|
||
img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
.sp {
|
||
display: block;
|
||
width: 33%;
|
||
margin-bottom: 20px;
|
||
}
|
||
.sp100 {
|
||
width: 100%;
|
||
margin-bottom: 15px;
|
||
display: inline-block;
|
||
}
|
||
.third {
|
||
width: 100%;
|
||
display: flex;
|
||
}
|
||
.pictrue {
|
||
width: 60px;
|
||
height: 60px;
|
||
border: 1px dotted rgba(0, 0, 0, 0.1);
|
||
margin-right: 10px;
|
||
position: relative;
|
||
cursor: pointer;
|
||
display: inline-block;
|
||
vertical-align: middle;
|
||
img {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
.demo-image__preview {
|
||
display: inline-block;
|
||
vertical-align: middle;
|
||
}
|
||
</style>
|