1174 lines
43 KiB
Vue
1174 lines
43 KiB
Vue
<template>
|
||
<view>
|
||
<top-bar></top-bar>
|
||
<common-header></common-header>
|
||
<category-bar></category-bar>
|
||
|
||
<view class="page-nav">
|
||
<el-breadcrumb separator="/">
|
||
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
|
||
<el-breadcrumb-item>
|
||
<navigator style="display: inline-block;" url="/pages/enquiry/list">询价单</navigator>
|
||
</el-breadcrumb-item>
|
||
<el-breadcrumb-item>发布询价单</el-breadcrumb-item>
|
||
</el-breadcrumb>
|
||
</view>
|
||
|
||
<view class="form-view">
|
||
|
||
<view class="m-20">
|
||
<view class="title-main">请填写询价单</view>
|
||
<view class="title-sub">询价信息越完整，供应商报价越精准</view>
|
||
|
||
<view class="form-type-box">
|
||
<view @click="form1.data.fillType = 0" :class="{active: form1.data.fillType === 0}"
|
||
class="form-type-item">手动填写
|
||
</view>
|
||
<view @click="form1.data.fillType = 1" :class="{active: form1.data.fillType === 1}"
|
||
class="form-type-item">批量上传
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="text-25 text-main my-15" v-if="form1.data.fillType === 0">温馨提示:
|
||
手动填写仅支持主流钢材产品数据，如无您采购产品数据请点击"批量上传"下单。
|
||
</view>
|
||
<!-- 手动填写 -->
|
||
<template v-if="form1.data.fillType === 0">
|
||
<view class="form-title-wrap">
|
||
<view class="goods-info-title">
|
||
<view class="form-title">
|
||
商品信息
|
||
</view>
|
||
<text class="enquiry-no">询价单编号: {{ form1.data.enquiryNo }}</text>
|
||
</view>
|
||
<view class="sales-code flex justify-end items-center">
|
||
<text>金久信业务员编号:</text>
|
||
<el-input v-model="salesCode" placeholder="请输入编号没有则留空" size="small"/>
|
||
</view>
|
||
</view>
|
||
<view class="p-20">
|
||
<view v-for="(item, index) in productList" :key="index">
|
||
<enquiry-template :ref="'product' + index" v-model="productList[index]"
|
||
:base-attributes="baseAttributes" :productIndex="index"/>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<!-- 批量上传 -->
|
||
<template v-else>
|
||
<view class="form-title-wrap mt-20">
|
||
<view class="goods-info-title mb-20">
|
||
<view class="form-title">
|
||
采购单或附件上传
|
||
</view>
|
||
</view>
|
||
<text class="ml-20 text-main text-28">仅支持PDF</text>
|
||
</view>
|
||
<vk-data-upload v-model="form1.data.files" accept=".pdf" list-type="text"
|
||
:on-preview="previewUpload"></vk-data-upload>
|
||
<view class="form-title-wrap my-20">
|
||
<view class="goods-info-title">
|
||
<view class="form-title">
|
||
主要商品分类筛选
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- <view class="flex flex-wrap justify-start items-start my-20">-->
|
||
<!-- <text v-for="(item, index) in goodsList" :key="index" @click="changeMultiGoods(item)"-->
|
||
<!-- :class="[productIdList.includes(item._id) ? 'product-item-active' : '']"-->
|
||
<!-- class="product-item">{{ item.name }}-->
|
||
<!-- </text>-->
|
||
<!-- <el-input style="width: 200px" v-model="form1.data.otherCate" placeholder="其他分类"-->
|
||
<!-- @change="changeOtherCate"/>-->
|
||
<!-- </view>-->
|
||
<div class="flex justify-center items-start">
|
||
<div v-for="(item, index) in productCateList" class="flex-1 mx-15" :key="index">
|
||
<div class="flex justify-start items-center">
|
||
<image :src="item.icon" style="width: 15px; height: 15px"/>
|
||
<span class="ml-10">{{ item.name }}</span>
|
||
</div>
|
||
<div class="ml-25 flex flex-wrap justify-start items-start">
|
||
<span class="mr-25 mt-20 pointer" @click="changeMultiGoods(productItem)"
|
||
:class="[productIdList.includes(productItem._id) ? 'text-main' : '']"
|
||
v-for="(productItem, productIndex) in item.children"
|
||
:key="productIndex"> {{ productItem.name }}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="flex justify-start items-center flex-wrap mt-20">
|
||
<span style="margin: 10px 10px 0 0">已选:</span>
|
||
<div class="flex justify-start items-center pointer"
|
||
v-for="(productItem, productIndex) in allProductList.filter(all => productIdList.includes(all._id))"
|
||
:key="productIndex" style="margin: 10px 10px 0 0">
|
||
<image src="/static/images/check.png" style="width: 12px; height: 12px; margin-right: 5px"/>
|
||
<span style="line-height: 18px">{{ productItem.parentName }}-{{ productItem.name }}</span>
|
||
</div>
|
||
</div>
|
||
<view class="form-title-wrap mt-20">
|
||
<view class="goods-info-title">
|
||
<view class="form-title">
|
||
预估采购数量
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="flex justify-start items-center my-20">
|
||
<el-input v-model="form1.data.procureNumber" style="width: 250px" class="input-with-select"
|
||
type="number">
|
||
<template #prepend>数量</template>
|
||
</el-input>
|
||
<el-input v-model="form1.data.procureUnit" style="width: 250px">
|
||
<template #prepend>单位</template>
|
||
</el-input>
|
||
</view>
|
||
</template>
|
||
|
||
<view v-if="form1.data.fillType === 0" class="btn-add-outer">
|
||
<el-button @click="addProduct" type="primary" size="small" icon="el-icon-plus">添加商品
|
||
</el-button>
|
||
<el-button v-show="productList.length > 1" @click="removeProduct" type="warning" size="small">删除商品
|
||
</el-button>
|
||
</view>
|
||
|
||
<el-form ref="form1" :model="form1.data" label-width="80px">
|
||
<el-row :gutter="10">
|
||
<el-col :span="6">
|
||
<el-form-item label="交货时限">
|
||
<el-date-picker
|
||
v-model="form1.data.deliveryTime"
|
||
type="date" :picker-options="pickerOptions"
|
||
placeholder="选择日期">
|
||
</el-date-picker>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="18">
|
||
<el-form-item label="交货地点" class="ml-10">
|
||
<el-row :gutter="10">
|
||
<el-col :span="11">
|
||
<vk-data-input-address :level="3" v-model="form1.data.addressRegion" class="w-100p"
|
||
@change="changeAddressRegion"/>
|
||
</el-col>
|
||
<el-col :span="11">
|
||
<el-input v-model="form1.data.addressDetail" @change="changeAddressDetail"
|
||
placeholder="详细地址或几公里范围内"></el-input>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<!-- <view class="form-title-wrap">-->
|
||
<!-- <view class="goods-info-title">-->
|
||
<!-- <view class="form-title">-->
|
||
<!-- 钢厂选择-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="my-20">-->
|
||
<!-- <el-select v-model="form1.data.stealFactory" placeholder="请选择钢厂">-->
|
||
<!-- <el-option v-for="(item, index) in stealFactoryList" :key="index"-->
|
||
<!-- :label="item.name"-->
|
||
<!-- :value="item._id">-->
|
||
<!-- </el-option>-->
|
||
<!-- </el-select>-->
|
||
<!-- </view>-->
|
||
<view class="form-title-wrap">
|
||
<view class="goods-info-title">
|
||
<view class="form-title">
|
||
采购商其他要求
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="p-30">
|
||
<el-radio-group v-model="hasRequire" class="my-20">
|
||
<el-radio :label="true">有</el-radio>
|
||
<el-radio :label="false">无</el-radio>
|
||
</el-radio-group>
|
||
<view class="pos-r">
|
||
<el-input type="textarea" v-model="form1.data.remark" :disabled="!hasRequire"
|
||
placeholder="生产厂家、品牌要求、复杂加工提供图纸、简单加工详细说明加工内容，如：镀锌、刷漆、防腐、折弯、裁剪等"
|
||
:rows="15"/>
|
||
<view class="remark-upload">
|
||
<vk-data-upload v-model="form1.data.multiFiles"
|
||
:on-preview="previewUpload"
|
||
accept=".jpg,.jpeg,.png,.xlsx,.doc,.docx,.pdf" list-type="text">
|
||
</vk-data-upload>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="form-title-wrap">
|
||
<view class="goods-info-title">
|
||
<view class="form-title">
|
||
发票要求
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="p-30">
|
||
<view class="mb-20">
|
||
<el-radio-group v-model="form1.data.invoice">
|
||
<el-radio :label="true">含税</el-radio>
|
||
<el-radio :label="false">不含税</el-radio>
|
||
</el-radio-group>
|
||
</view>
|
||
<template v-if="form1.data.invoice">
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<text>开票时间：</text>
|
||
<el-radio-group v-model="form1.data.writeInvoiceTime">
|
||
<el-radio :label="0">付款当月（限20号之前付款，20号之后付款次月开票）</el-radio>
|
||
<el-radio :label="1">付款后次月</el-radio>
|
||
<el-radio :label="2">付款前</el-radio>
|
||
</el-radio-group>
|
||
</view>
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<view class="flex-1 flex justify-start items-center">
|
||
<text style="width: 30%">纳税人身份：</text>
|
||
<el-select v-model="form1.data.taxType" placeholder="纳税人身份" style="width: 100%">
|
||
<el-option
|
||
v-for="item in ['一般纳税人', '小规模公司', '个体工商户']"
|
||
:key="item"
|
||
:label="item"
|
||
:value="item">
|
||
</el-option>
|
||
</el-select>
|
||
</view>
|
||
<view class="flex-1 flex justify-start items-center ml-20">
|
||
<text style="width: 30%">发票种类：</text>
|
||
<el-select v-model="form1.data.invoiceType" placeholder="发票种类" style="width: 100%">
|
||
<el-option
|
||
v-for="item in ['专用发票', '普通发票']"
|
||
:key="item"
|
||
:label="item"
|
||
:value="item">
|
||
</el-option>
|
||
</el-select>
|
||
</view>
|
||
</view>
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<view class="flex-1 flex justify-start items-center">
|
||
<text style="width: 30%">税率：</text>
|
||
<el-select v-model="form1.data.taxRate" placeholder="税率" style="width: 100%">
|
||
<el-option
|
||
v-for="item in ['13%', '9%', '6%', '4%', '3%', '1%']"
|
||
:key="item"
|
||
:label="item"
|
||
:value="item">
|
||
</el-option>
|
||
</el-select>
|
||
</view>
|
||
<view class="ml-20 flex justify-start items-center flex-1 ml-20">
|
||
<text style="width: 30%">手动填写税票要求：</text>
|
||
<el-input v-model="form1.data.invoiceOther" placeholder="如：一般纳税人 专用发票 税率13%"
|
||
size="small"/>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
</view>
|
||
|
||
<view class="form-title-wrap">
|
||
<view class="goods-info-title">
|
||
<view class="form-title">
|
||
运输要求
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="p-30">
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<text>随货资料：</text>
|
||
<el-checkbox-group v-model="form1.data.transportDocuments">
|
||
<el-checkbox label="合格证"/>
|
||
<el-checkbox label="检测报告"/>
|
||
<el-checkbox label="销售清单"/>
|
||
<el-checkbox label="磅重"/>
|
||
</el-checkbox-group>
|
||
<view style="margin-left: 30px">
|
||
<el-checkbox label="全选" @change="changeDocumentAll"/>
|
||
</view>
|
||
</view>
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<text class="label-width">其他要求：</text>
|
||
<el-input v-model="form1.data.otherTransportDocuments" placeholder="请输入"/>
|
||
</view>
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<text>运输限制：</text>
|
||
<el-radio-group v-model="form1.data.transportLimit">
|
||
<el-radio :label="false">无</el-radio>
|
||
<el-radio :label="true">有</el-radio>
|
||
</el-radio-group>
|
||
<view class="ml-20 flex justify-start items-center" v-if="form1.data.transportLimit"
|
||
style="width: 400px">
|
||
<el-input v-model="form1.data.otherTransportRequest" placeholder="请输入运输限制说明"/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="form-title-wrap">
|
||
<view class="goods-info-title">
|
||
<view class="form-title">
|
||
交易模式
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="p-30">
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<text>交易模式：</text>
|
||
<el-radio-group v-model="form1.data.tradeMethod">
|
||
<el-radio :label="1">金久信公证</el-radio>
|
||
<el-radio :label="0">自主交易</el-radio>
|
||
</el-radio-group>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="form-title-wrap">
|
||
<view class="goods-info-title">
|
||
<view class="form-title">
|
||
交易说明
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="p-30">
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<text>付款方式：</text>
|
||
<el-radio v-model="form1.data.payMethod" :label="0" @change="changePayMethod(0)">预付</el-radio>
|
||
<view class="flex justify-start items-center">
|
||
<el-input v-model="form1.data.advancePayRate" :disabled="form1.data.payMethod !== 0"
|
||
class="advance-pay-rate"/>
|
||
<text>%货到付全款</text>
|
||
</view>
|
||
<view class="mx-20">
|
||
<el-radio v-model="form1.data.payMethod" :label="1" @change="changePayMethod(1)">
|
||
货到验收后付款
|
||
</el-radio>
|
||
</view>
|
||
<el-radio v-model="form1.data.payMethod" :label="2" @change="changePayMethod(2)">提货付全款
|
||
</el-radio>
|
||
<view class="mx-20 flex justify-start items-center">
|
||
<el-radio v-model="form1.data.payMethod" :label="3" @change="changePayMethod(3)">
|
||
信誉采购，货到签单后账期：
|
||
</el-radio>
|
||
<el-input v-model="form1.data.reputationPayDay" :disabled="form1.data.payMethod !== 3"
|
||
class="advance-pay-rate">
|
||
<template slot="suffix">
|
||
<span style="margin-top: 10px">天</span>
|
||
</template>
|
||
</el-input>
|
||
</view>
|
||
</view>
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<el-radio v-model="form1.data.payMethod" :label="4">其他付款方式</el-radio>
|
||
<el-input v-model="form1.data.otherPayMethod"/>
|
||
</view>
|
||
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<text>报价形式：</text>
|
||
<el-radio v-model="form1.data.offerType" :label="0">整单报价</el-radio>
|
||
<el-radio v-model="form1.data.offerType" :label="1">可分项报价</el-radio>
|
||
</view>
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<text>报价时限：</text>
|
||
<view class="flex justify-start items-center">
|
||
<el-date-picker :picker-options="pickerOptions"
|
||
v-model="form1.data.answerStartTime"
|
||
type="datetime"/>
|
||
<view class="mx-15">~</view>
|
||
<el-date-picker :picker-options="pickerOptions"
|
||
v-model="form1.data.answerEndTime"
|
||
type="datetime"/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="form-title-wrap">
|
||
<view class="goods-info-title">
|
||
<view class="form-title">
|
||
交易保证金要求
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="p-30">
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<text style="width: 140px">人民币金额≥</text>
|
||
<el-input-number v-model="form1.data.earnestMoney" :min="0" :precision="2"
|
||
placeholder="请输入交易保证金要求（如无要求则留空）" type="number"
|
||
@blur="formatAmount" @focus="resetAmount"/>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="form-title-wrap">
|
||
<view class="goods-info-title">
|
||
<view class="form-title">
|
||
简易合同备注和其他补充条款
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="p-30">
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<el-radio v-model="form1.data.signMethod" :label="0">线上签约-标准合同</el-radio>
|
||
<el-radio v-model="form1.data.signMethod" :label="2">线上签约-双方协商合同</el-radio>
|
||
<el-radio v-model="form1.data.signMethod" :label="1" v-if="form1.data.tradeMethod === 0">
|
||
线下签约
|
||
</el-radio>
|
||
</view>
|
||
|
||
<view class="my-25" v-if="form1.data.signMethod === 2">
|
||
<view class="p-30">
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<text style="width: 140px">合同附件：</text>
|
||
<vk-data-upload v-model="form1.data.contractAttachment" accept=".pdf" list-type="text"
|
||
:on-preview="previewUpload"/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view v-if="form1.data.signMethod === 0">
|
||
<view @click="openDownload" class="pointer my-25 text-main">
|
||
点击查看标准合同
|
||
</view>
|
||
<view class="flex justify-start items-start border">
|
||
<view class="m-10 sign-method-header">违约责任:</view>
|
||
<view class="border-left m-10 pl-20 flex-1">
|
||
1.
|
||
乙方所交产品品种、型号、规格、质量不符合规定的，如果甲方同意利用，应当按质论价；如果甲方不能利用的，应根据产品的具体情况，由乙方负责包换或包修，并承担修理、调换或退货而支付的实际费用；
|
||
2.乙方不予供货违约责任为甲方的实际损失+违约金，如乙方材料符合订货标准，甲方不能退货和不收货，甲方无条件应按实际本合同订货数量支付100%货款，并支付乙方因此产生的实际费用。带有甲乙双方单位相关收货人和发货人签字的本合同的发货清单事项和内容均视为本合同的补充合同，与本合同有相同的法律效力，双方应共同遵照执行。
|
||
</view>
|
||
</view>
|
||
<view class="flex justify-start items-start border">
|
||
<view class="m-10 sign-method-header">解决纠纷的方法:</view>
|
||
<view class="border-left m-10 pl-20 flex-1">
|
||
1、凡因本合同引起的或与本合同有关的任何争议，均可友好协商或仲裁解决，协商或仲裁不成的，双方协商同意在合同签订地人民法院管辖地起诉，违约一方或对合同争议承担主要责任的一方，应承担对方因仲裁和起诉而产生的全部律师代理费、鉴定（检验）费、诉讼保全费、诉讼保险费、公告费、差旅费、执行费、误工费和获取证据产生费用等其他相关费用。
|
||
2、双方本合同相关权利放弃均应有双方书面作出并加盖公章或授权委托人签字后生效。
|
||
</view>
|
||
</view>
|
||
<view class="flex justify-start items-start border">
|
||
<view class="m-10 sign-method-header">不可抗力:</view>
|
||
<view class="border-left m-10 pl-20 flex-1">
|
||
甲乙双方的任何一方由于不可抗力或突发公共事件的原因不能履行合同时，应及时向对方通报不能履行或不能完全履行的理由，以减轻可能给对方造成的损失，在取得有关机构证明以后，允许延期履行、部分履行或者不履行合同，并根据情况可部分或全部免予承担违约责任。
|
||
</view>
|
||
</view>
|
||
<view class="flex justify-start items-start border">
|
||
<view class="m-10 sign-method-header">其他:</view>
|
||
<view class="border-left m-10 pl-20 flex-1">
|
||
本合同的全部内容由双方平等共同协商一致，共同起草制定，非一方事先拟定，不属于格式条款。本合同自双方签字盖章后生效（包括电子签字、盖章），按本合同内容地址、联系方式寄送的一切文书、函件送达与否，均为视为送达有法律效力，通知途径和本合同内联系方式或地址送达文件双方均予以验证。
|
||
</view>
|
||
</view>
|
||
<view class="flex justify-start items-start border">
|
||
<view class="m-10 sign-method-header">采购方补充条款:</view>
|
||
<view class="border-left m-10 pl-20 flex-1">
|
||
<el-input v-if="form1.data.signMethod === 0" v-model="form1.data.supplementary"
|
||
placeholder="请输入采购方补充条款"/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="form-title-wrap">
|
||
<view class="goods-info-title">
|
||
<view class="form-title">
|
||
采购商信息
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="p-30">
|
||
<view class="mb-20 flex justify-start items-center">
|
||
<text style="width: 140px">项目名称：</text>
|
||
<el-input v-model="form1.data.projectName" placeholder="请输入项目名称或主要用途"/>
|
||
</view>
|
||
<view class="mb-20 flex justify-start items-center w-100p">
|
||
<text style="width: 140px">项目地址：</text>
|
||
<el-row :gutter="10" class="w-100p">
|
||
<el-col :span="11">
|
||
<vk-data-input-address :level="3" v-model="form1.data.projectAddressRegion"
|
||
class="w-100p"/>
|
||
</el-col>
|
||
<el-col :span="11">
|
||
<el-input v-model="form1.data.projectAddressDetail"
|
||
placeholder="详细地址或几公里范围内"></el-input>
|
||
</el-col>
|
||
</el-row>
|
||
</view>
|
||
<el-row :gutter="10" class="mb-20">
|
||
<el-col :span="12" class="flex justify-start items-center">
|
||
<text style="width: 160px">{{
|
||
userInfo.accountType === 2 ? '公司信息' : '个人信息'
|
||
}}：
|
||
</text>
|
||
<el-input v-model="form1.data.companyName" placeholder=""/>
|
||
</el-col>
|
||
<el-col :span="12" class="flex justify-start items-center">
|
||
<text style="width: 160px">{{
|
||
userInfo.accountType === 2 ? '公司联系方式' : '个人联系方式'
|
||
}}：
|
||
</text>
|
||
<el-input v-model="form1.data.companyMobile"/>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row :gutter="10">
|
||
<el-col :span="12" class="flex justify-start items-center">
|
||
<text style="width: 160px">授权业务咨询人：</text>
|
||
<el-select v-model="form1.data.businessName" placeholder="点击选择业务联系人"
|
||
class="w-100p" @change="selectContact">
|
||
<el-option
|
||
v-for="(item, index) in contactList"
|
||
:key="index"
|
||
:label="item.name"
|
||
:value="item.name">
|
||
</el-option>
|
||
<view slot="empty" class="text-gray pointer p-20">
|
||
<text>无业务联系人,请到</text>
|
||
<text class="text-main mx-15" @click="navTo">个人中心</text>
|
||
<text>添加</text>
|
||
</view>
|
||
</el-select>
|
||
</el-col>
|
||
<el-col :span="12" class="flex justify-start items-center">
|
||
<text style="width: 160px">业务咨询联系方式：</text>
|
||
<el-input v-model="form1.data.businessMobile" type="number" disabled/>
|
||
</el-col>
|
||
</el-row>
|
||
</view>
|
||
|
||
</el-form>
|
||
<view class="form-footer">
|
||
<!-- <el-button @click="draft">保存草稿</el-button>-->
|
||
<el-button type="primary" @click="save" plain>暂存</el-button>
|
||
<el-button type="primary" @click="submit">提交询价单</el-button>
|
||
</view>
|
||
<!-- <el-divider content-position="left">其他设置</el-divider> -->
|
||
</view>
|
||
<Gap/>
|
||
<common-footer></common-footer>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import EnquiryTemplate from './components/template.vue'
|
||
import dayjs from "dayjs";
|
||
import Gap from "../../components/gap/gap.vue";
|
||
import provinces from "@/uni_modules/vk-uview-ui/libs/address/provinces.json";
|
||
import citys from "@/uni_modules/vk-uview-ui/libs/address/citys.json";
|
||
import areas from "@/uni_modules/vk-uview-ui/libs/address/areas.json";
|
||
|
||
export default {
|
||
components: {Gap, EnquiryTemplate},
|
||
data() {
|
||
return {
|
||
pickerOptions: {
|
||
disabledDate(time) {
|
||
return time.getTime() < Date.now();
|
||
},
|
||
},
|
||
disabled: false,
|
||
provinceData: provinces,
|
||
cityData: citys,
|
||
areaData: areas,
|
||
company: {
|
||
companyName: '',
|
||
legalMobile: '',
|
||
},
|
||
enquiryNo: '',
|
||
// 表单相关开始-----------------------------------------------------------
|
||
productList: [],
|
||
productIdList: [],
|
||
baseAttributes: [],
|
||
categoryTreeData: [],
|
||
checkCategoryList: [],
|
||
projectProvinceIndex: null,
|
||
projectCityIndex: null,
|
||
projectAreaIndex: null,
|
||
goodsList: [],
|
||
stealFactoryList: [],
|
||
dialogVisible: false,
|
||
singleQuoteAmount: 1,
|
||
monthlyQuoteAmount: 100,
|
||
buyQuoteMode: null,
|
||
form1: {
|
||
// 表单请求数据，此处可以设置默认值
|
||
data: {
|
||
fillType: 0,
|
||
enquiryNo: dayjs().format('YYYYMMDD') + (Math.ceil(Math.random() * 10000)).toString(),
|
||
// extraAttributes: {},
|
||
// attributes: {},
|
||
multiFiles: [],
|
||
stealFactory: null,
|
||
invoice: false,
|
||
invoiceType: '',
|
||
taxType: '',
|
||
taxRate: '',
|
||
invoiceOther: '',
|
||
writeInvoiceTime: 0,
|
||
transportDocuments: [],
|
||
files: [],
|
||
otherTransportDocuments: '',
|
||
transportLimit: false,
|
||
otherTransportRequest: '',
|
||
tradeMethod: 1,
|
||
payMethod: 0,
|
||
advancePayRate: null,
|
||
reputationPayDay: null,
|
||
otherPayMethod: '',
|
||
offerType: 0,
|
||
answerStartTime: '',
|
||
answerEndTime: '',
|
||
earnestMoney: '',
|
||
signMethod: 0,
|
||
projectName: '',
|
||
province: '',
|
||
city: '',
|
||
area: '',
|
||
projectAddress: '',
|
||
businessName: '',
|
||
businessMobile: '',
|
||
companyName: '',
|
||
companyMobile: '',
|
||
contractAttachment: [],
|
||
supplementary: '',
|
||
addressRegion: {},
|
||
addressDetail: null,
|
||
projectAddressRegion: {},
|
||
projectAddressDetail: null,
|
||
otherCate: null,
|
||
},
|
||
},
|
||
// 表单相关结束-----------------------------------------------------------
|
||
salesCode: '',
|
||
hasRequire: false,
|
||
contactList: [],
|
||
productCateList: [],
|
||
allProductList: [],
|
||
userInfo: null
|
||
};
|
||
},
|
||
async onLoad(option) {
|
||
// await this.getStealFactory()
|
||
|
||
await this.check()
|
||
this.getGoodsList()
|
||
if (option.id) this.getInfo(option.id)
|
||
this.addProduct()
|
||
await this.getCommonContractUrl()
|
||
await this.getContactList()
|
||
await this.getCate()
|
||
if (!!localStorage.getItem("enquiry")) {
|
||
this.$confirm('您有一份暂存数据，是否恢复?', '提示', {
|
||
confirmButtonText: '确定',
|
||
type: 'warning'
|
||
}).then(() => {
|
||
const savedData = JSON.parse(localStorage.getItem("enquiry"))
|
||
this.form1.data = savedData.form
|
||
this.hasRequire = savedData.hasRequire
|
||
this.productList = savedData.productList
|
||
this.productList.forEach((item, index) => {
|
||
console.log(this.$refs[`product${index}`])
|
||
this.$refs[`product${index}`][0].selectGoods(item.goodsId)
|
||
})
|
||
})
|
||
}
|
||
|
||
},
|
||
onShow() {
|
||
this.userInfo = vk.getVuex('$user.userInfo')
|
||
console.log(this.userInfo)
|
||
this.form1.data.companyName = this.userInfo.accountType === 2 ? this.userInfo.company?.companyName : this.userInfo.person?.personName
|
||
this.form1.data.companyMobile = this.userInfo.accountType === 2 ? this.userInfo.company?.mobile : this.userInfo.person?.mobile
|
||
},
|
||
methods: {
|
||
dayjs,
|
||
getInfo(_id) {
|
||
vk.callFunction({
|
||
url: 'client/enquiry/sheet/pub/getDetail',
|
||
title: '请求中...',
|
||
data: {
|
||
_id
|
||
},
|
||
success: (res) => {
|
||
this.form1.data = res.data
|
||
this.productList = res.data.productList
|
||
}
|
||
})
|
||
},
|
||
getGoodsList() {
|
||
vk.callFunction({
|
||
url: 'client/enquiry/template/pub/getList',
|
||
title: '请求中',
|
||
success: ({rows}) => {
|
||
this.goodsList = rows
|
||
}
|
||
})
|
||
},
|
||
async getCate() {
|
||
const {rows} = await vk.callFunction({
|
||
url: 'client/spot/category/pub/getTree',
|
||
title: '请求中...',
|
||
});
|
||
this.allProductList = []
|
||
this.productCateList = rows.map(item => {
|
||
item.children.forEach(child => {
|
||
this.allProductList.push({
|
||
...child,
|
||
parentName: item.name
|
||
})
|
||
})
|
||
item.idList = []
|
||
return item
|
||
})
|
||
},
|
||
addProduct() {
|
||
this.productList.push({
|
||
goodsId: null,
|
||
model: [],
|
||
otherData: null,
|
||
materialQuality: null,
|
||
singleLength: null,
|
||
singleLengthUnit: null,
|
||
deliverService: null,
|
||
standard: null,
|
||
pricingForm: null,
|
||
loadPaidBy: null,
|
||
deliveryTime: null,
|
||
len: null,
|
||
extraAttributes: {},
|
||
attributes: {},
|
||
// addressRegion: [],
|
||
// addressDetail: null
|
||
})
|
||
},
|
||
removeProduct() {
|
||
if (this.productList.length > 1) {
|
||
this.productList.splice(this.productList.length - 1, 1)
|
||
}
|
||
},
|
||
onFormSuccess() {
|
||
vk.redirectTo({url: '/pages/enquiry/list'});
|
||
},
|
||
// 提交并发布
|
||
submit() {
|
||
this.form1.data.isShow = 1
|
||
this.submitAll()
|
||
},
|
||
// 提交并保存草稿
|
||
draft() {
|
||
this.form1.data.isShow = 0
|
||
this.submitAll()
|
||
},
|
||
changeAddressRegion(val) {
|
||
this.form1.data.projectAddressRegion = val
|
||
},
|
||
changeAddressDetail(val) {
|
||
this.form1.data.projectAddressDetail = val
|
||
},
|
||
async submitAll() {
|
||
const stealFactory = [], materialQuality = []
|
||
if (this.form1.data.fillType === 1) {
|
||
if (this.productIdList.length === 0 && !this.form1.data.otherCate) return this.$message({
|
||
message: '请选择商品或输入其他分类',
|
||
type: 'error'
|
||
})
|
||
if (this.form1.data.files.length === 0) return this.$message({
|
||
message: '请上传附件',
|
||
type: 'error'
|
||
})
|
||
this.productList = []
|
||
this.goodsList.forEach(goods => {
|
||
if (this.productIdList.includes(goods._id)) {
|
||
goods.goodsName = goods.name
|
||
goods.procureNumber = this.form1.data.procureNumber
|
||
goods.procureUnit = this.form1.data.procureUnit
|
||
this.productList.push(goods)
|
||
}
|
||
})
|
||
if (this.form1.data.otherCate) this.productList.push({
|
||
goodsName: this.form1.data.otherCate,
|
||
procureNumber: this.form1.data.procureNumber,
|
||
procureUnit: this.form1.data.procureUnit,
|
||
})
|
||
} else {
|
||
for (let i = 0; i < this.productList.length; i++) {
|
||
if (!this.productList[i].goodsName) return this.$message({message: '请选择商品', type: 'error'})
|
||
this.productList[i].model.forEach(model => {
|
||
if (['钢厂', '品牌厂家'].includes(model.label)) {
|
||
stealFactory.push(model.value)
|
||
}
|
||
if (['材质'].includes(model.label)) materialQuality.push(model.value)
|
||
})
|
||
}
|
||
}
|
||
// if (!this.form1.data.stealFactory) return this.$message({message: '请选择钢厂', type: 'error'})
|
||
if (!this.form1.data.projectName) return this.$message({message: '请输入项目名称', type: 'error'})
|
||
if (JSON.stringify(this.form1.data.projectAddressRegion) === '{}') return this.$message({
|
||
message: '请选择项目地址',
|
||
type: 'error'
|
||
})
|
||
if (JSON.stringify(this.form1.data.addressRegion) === '{}') return this.$message({
|
||
message: '请选择交货地点',
|
||
type: 'error'
|
||
})
|
||
if (!this.form1.data.addressDetail) return this.$message({
|
||
message: '请完善交货地点',
|
||
type: 'error'
|
||
})
|
||
|
||
if (!this.form1.data.answerEndTime || !this.form1.data.answerStartTime) return this.$message({
|
||
message: '请选择报价时限',
|
||
type: 'error'
|
||
})
|
||
if (dayjs(this.form1.data.answerEndTime).isBefore(this.form1.data.answerStartTime)) return this.$message({
|
||
message: '报价结束时限不能早于开始时间',
|
||
type: 'error'
|
||
})
|
||
if (dayjs(this.form1.data.answerStartTime).isAfter(this.form1.data.deliveryTime)) return this.$message({
|
||
message: '报价时限不能晚于交货时间',
|
||
type: 'error'
|
||
})
|
||
if (this.form1.data.payMethod === 0 && !this.form1.data.advancePayRate) return this.$message({
|
||
message: '请填写预付比例',
|
||
type: 'error'
|
||
})
|
||
if (this.form1.data.payMethod === 3 && !this.form1.data.reputationPayDay) return this.$message({
|
||
message: '请填写回款日期',
|
||
type: 'error'
|
||
})
|
||
if (this.form1.data.signMethod === 2 && (!this.form1.data.contractAttachment || this.form1.data.contractAttachment.length === 0)) {
|
||
return this.$message({
|
||
message: '请上传合同附件',
|
||
type: 'error'
|
||
})
|
||
}
|
||
if (!this.form1.data.businessName) {
|
||
return this.$message({
|
||
message: '请选择业务联系人',
|
||
type: 'error'
|
||
})
|
||
}
|
||
|
||
this.form1.data.productList = this.productList
|
||
// if (this.projectProvinceIndex !== null) {
|
||
// this.form1.data.province = this.provinceData[this.projectProvinceIndex].code
|
||
// if (this.projectCityIndex !== null) {
|
||
// this.form1.data.city = this.cityData[this.projectProvinceIndex][this.projectCityIndex].code
|
||
// if (this.projectAreaIndex !== null) {
|
||
// this.form1.data.area = this.areaData[this.projectProvinceIndex][this.projectCityIndex][this.projectAreaIndex].code
|
||
// }
|
||
// }
|
||
// }
|
||
this.disabled = true
|
||
let title = this.form1.data.productList.map(item => `${item.goodsName}`).join("/")
|
||
title += ` -${this.form1.data.projectName}`
|
||
localStorage.removeItem('enquiry')
|
||
vk.callFunction({
|
||
url: 'client/enquiry/sheet/kh/add',
|
||
data: {
|
||
...this.form1.data, ...{
|
||
title,
|
||
nameList: this.form1.data.productList.map(item => item.goodsName),
|
||
material: materialQuality,
|
||
stealFactory
|
||
}
|
||
},
|
||
title: '请求中...',
|
||
success: (data) => {
|
||
this.$message({
|
||
message: "您的信息已经提交，等待管理员审核，请您耐心等待！",
|
||
type: 'success'
|
||
})
|
||
this.disabled = false
|
||
vk.redirectTo({url: '/pages/enquiry/list'})
|
||
}
|
||
})
|
||
},
|
||
changeMultiGoods(item) {
|
||
const index = this.productIdList.indexOf(item._id)
|
||
if (index === -1) this.productIdList.push(item._id)
|
||
else this.productIdList.splice(index, 1)
|
||
},
|
||
async getStealFactory() {
|
||
const {rows} = await vk.callFunction({
|
||
url: 'client/stealFactory/pub/getList',
|
||
title: '请求中...',
|
||
})
|
||
this.stealFactoryList = rows
|
||
},
|
||
async getCommonContractUrl() {
|
||
const res = await vk.callFunction({
|
||
url: 'client/dict/pub/getDetail',
|
||
data: {
|
||
id: '657d36befe975f63af1f24e7'
|
||
},
|
||
})
|
||
this.commonContractUrl = res.content
|
||
},
|
||
openDownload() {
|
||
window.open(this.commonContractUrl)
|
||
},
|
||
async getContactList() {
|
||
const {rows} = await vk.callFunction({
|
||
url: 'client/businessContact/kh/getList',
|
||
})
|
||
this.contactList = rows
|
||
},
|
||
navTo() {
|
||
vk.navigateTo({url: '/pages/user/user?menu=business-contact'})
|
||
},
|
||
selectContact(name) {
|
||
const contact = this.contactList.find(item => item.name === name)
|
||
this.form1.data.businessMobile = contact.phone
|
||
},
|
||
formatAmount() {
|
||
this.form1.data.earnestMoney = parseFloat(this.form1.data.earnestMoney).toFixed(2)
|
||
},
|
||
resetAmount() {
|
||
this.form1.data.earnestMoney = parseFloat(this.form1.data.earnestMoney)
|
||
},
|
||
changeOtherCate() {
|
||
if (this.form1.data.otherCate) {
|
||
this.productIdList = []
|
||
}
|
||
},
|
||
async check() {
|
||
const {userInfo, accountNum} = await vk.callFunction({
|
||
url: 'user/kh/getMyUserInfo'
|
||
})
|
||
if (!userInfo.fadadaConfirm || [-1, 2].includes(userInfo.authStatus)) {
|
||
this.$confirm('您尚未认证, 是否前往个人中心认证?', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning'
|
||
}).then(() => {
|
||
vk.navigateTo({url: '/pages/user/user?menu=fadada'});
|
||
})
|
||
} else if (vk.pubfn.isNull(userInfo.businessCard)) {
|
||
this.$confirm('您尚未认证和完善名片，是否前往个人中心？', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning'
|
||
}).then(() => {
|
||
vk.navigateTo({url: '/pages/user/user?menu=fadada'});
|
||
})
|
||
} else if (accountNum === 0) {
|
||
this.$confirm('请先到个人中心添加收款账户', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning'
|
||
}).then(() => {
|
||
vk.navigateTo({url: '/pages/user/user?menu=account'});
|
||
})
|
||
} else {
|
||
if (userInfo.businessCard.status !== 1) {
|
||
this.$confirm('您的名片信息未审核,请耐心等待', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
type: 'warning'
|
||
})
|
||
vk.navigateBack()
|
||
}
|
||
}
|
||
},
|
||
changePayMethod(payMethod) {
|
||
if ([1, 2].includes(payMethod)) {
|
||
this.form1.data.advancePayRate = null
|
||
this.form1.data.reputationPayDay = null
|
||
}
|
||
},
|
||
changeDocumentAll() {
|
||
if (this.form1.data.transportDocuments.length !== 4) {
|
||
this.form1.data.transportDocuments = ['合格证', '检测报告', '销售清单', '磅重']
|
||
} else this.form1.data.transportDocuments = []
|
||
},
|
||
previewUpload({url}) {
|
||
window.open(url)
|
||
},
|
||
save() {
|
||
console.log(this.productList)
|
||
localStorage.setItem("enquiry", JSON.stringify({
|
||
form: this.form1.data,
|
||
hasRequire: this.hasRequire,
|
||
productList: this.productList,
|
||
}))
|
||
this.$message({
|
||
message: "已保存",
|
||
type: 'success'
|
||
})
|
||
}
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
@import "@/common/css/app.scss";
|
||
|
||
.form-type-box {
|
||
position: absolute;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
width: 270px;
|
||
left: 0;
|
||
top: 0;
|
||
bottom: 0;
|
||
margin: auto;
|
||
}
|
||
|
||
.form-type-item {
|
||
width: 120px;
|
||
height: 35px;
|
||
text-align: center;
|
||
line-height: 35px;
|
||
font-size: 14px;
|
||
background-color: rgba(206, 206, 206, 0.75);
|
||
color: rgba(0, 0, 0, 1);
|
||
cursor: pointer;
|
||
}
|
||
|
||
.form-type-item.active {
|
||
background-color: #A92924;
|
||
color: #FFFFFF;
|
||
|
||
}
|
||
|
||
.form-view {
|
||
width: 1200px;
|
||
margin: 0 auto;
|
||
background-color: #FFFFFF;
|
||
padding: 20rpx;
|
||
border-radius: 20px;
|
||
}
|
||
|
||
.m-20 {
|
||
margin: 20px;
|
||
position: relative;
|
||
}
|
||
|
||
.title-main {
|
||
font-size: 18px;
|
||
font-weight: bold;
|
||
text-align: center;
|
||
}
|
||
|
||
.title-sub {
|
||
font-size: 14px;
|
||
text-align: center;
|
||
}
|
||
|
||
.btn-add-outer {
|
||
margin: 0 0 20px 30px;
|
||
}
|
||
|
||
.form-footer {
|
||
height: 40px;
|
||
line-height: 40px;
|
||
background: #fff;
|
||
padding-top: 0;
|
||
text-align: center;
|
||
width: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin: auto;
|
||
|
||
* {
|
||
flex: 1;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin: 0 40px;
|
||
}
|
||
}
|
||
|
||
.tags {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
|
||
.el-tag {
|
||
margin-right: 10px;
|
||
}
|
||
}
|
||
|
||
.form-title-wrap {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.goods-info-title {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-start;
|
||
}
|
||
|
||
.form-title {
|
||
padding-left: 10px;
|
||
color: $--color-primary;
|
||
font-size: 18px;
|
||
line-height: 18px;
|
||
border-left: 4px solid $--color-primary;
|
||
}
|
||
|
||
.enquiry-no {
|
||
margin-left: 10px;
|
||
font-size: 14px;
|
||
}
|
||
}
|
||
|
||
.sales-code {
|
||
text {
|
||
width: 400rpx;
|
||
}
|
||
}
|
||
|
||
.remark-upload {
|
||
position: absolute;
|
||
left: 0;
|
||
bottom: 0;
|
||
//border: 1px solid #ddd;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 5px;
|
||
|
||
i {
|
||
color: #ddd;
|
||
font-size: 18px;
|
||
}
|
||
}
|
||
|
||
.label-width {
|
||
width: 100px;
|
||
}
|
||
|
||
.advance-pay-rate {
|
||
width: 100px;
|
||
}
|
||
|
||
.sign-method-header {
|
||
width: 120px;
|
||
}
|
||
|
||
|
||
.product-item {
|
||
font-size: 35rpx;
|
||
margin: 10rpx;
|
||
padding: 20rpx;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.product-item:hover {
|
||
background-color: #f1c7c7;
|
||
color: #a92924
|
||
}
|
||
|
||
|
||
.product-item-active {
|
||
background-color: #f1c7c7;
|
||
color: #a92924
|
||
}
|
||
|
||
</style>
|
||
|
||
<style>
|
||
.vk-data-upload .el-upload--picture-card {
|
||
width: 40px !important;
|
||
height: 40px !important;
|
||
}
|
||
|
||
/deep/ .el-input__suffix {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
</style> |