20261008
This commit is contained in:
@@ -1,191 +1,257 @@
|
||||
<template>
|
||||
<view>
|
||||
<top-bar></top-bar>
|
||||
<common-header></common-header>
|
||||
<category-bar></category-bar>
|
||||
<view class="w-1200 m-a">
|
||||
<u-swiper :list="list" :height="380" borderRadius="0"></u-swiper>
|
||||
<view class="bg-white p-40">
|
||||
<view v-for="(item, index) in configList" :key="index"
|
||||
class="my-20 flex flex-col justify-start items-start">
|
||||
<view class="flex flex-col justify-start items-start">
|
||||
<view class="flex justify-start items-center text-35 mb-20">
|
||||
<text>服务内容:{{ item.name }}</text>
|
||||
<view class="flex flex-col justify-start items-start">
|
||||
<view v-for="(content, contentIndex) in item.contents" :key="contentIndex"
|
||||
class="mb-40 flex justify-start items-center">
|
||||
<view class="ml-35">
|
||||
<text>业务编号:</text>
|
||||
<text>{{ content.code }}</text>
|
||||
</view>
|
||||
<view class="flex justify-start items-center">
|
||||
<text class="ml-35">服务服务项目:</text>
|
||||
<el-checkbox v-model="configList[index].contents[contentIndex].checked"
|
||||
:disabled="!content.amountList || content.amountList.length === 0">
|
||||
{{ content.title }}
|
||||
</el-checkbox>
|
||||
</view>
|
||||
<view class="flex justify-start items-center ml-35">
|
||||
<el-select v-model="configList[index].contents[contentIndex].amountIndex"
|
||||
clearable @change="selectAmount(index, contentIndex, $event)"
|
||||
:disabled="!content.amountList || content.amountList.length === 0">
|
||||
<el-option v-for="(amount, amountIndex) in content.amountList"
|
||||
:key="amountIndex"
|
||||
:label="amount.title" :value="amountIndex"/>
|
||||
</el-select>
|
||||
<text class="ml-35" v-if="content.amountIndex !== null">
|
||||
{{ content.amountList[content.amountIndex].amount }}元/次
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view>备注: {{ item.remark }}</view>
|
||||
</view>
|
||||
<view>
|
||||
<top-bar></top-bar>
|
||||
<common-header></common-header>
|
||||
<category-bar></category-bar>
|
||||
<view class="w-1200 m-a">
|
||||
<common-swiper page="self-support-company-swiper"/>
|
||||
<view class="flex justify-end items-center text-main pointer my-20 " @click="demoDownload">示例下载</view>
|
||||
<view class="bg-white p-40">
|
||||
<view v-for="(item, index) in configList" :key="index"
|
||||
class="server-item my-20 flex flex-col justify-start items-start">
|
||||
<el-checkbox v-model="configList[index].checked" @change="changeCheck(index, item.name, $event)">
|
||||
<view class="flex flex-col justify-start items-start">
|
||||
<view class="flex justify-start items-center text-35 mb-20">
|
||||
<view class="name">{{ item.name }}</view>
|
||||
<view class="ml-15">
|
||||
<text>业务编号:</text>
|
||||
<text v-if="item.contentIndex !== null">{{
|
||||
item.contents[item.contentIndex].code
|
||||
}}
|
||||
</text>
|
||||
</view>
|
||||
<el-form ref="form" :model="form" label-width="200px">
|
||||
<view v-for="(item, companyIndex) in companyList" :key="companyIndex">
|
||||
<el-form-item label="考察对象(个人/企业全称):" required>
|
||||
<el-input v-model="companyList[companyIndex].name"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="考察对象(个人身份证/企业信用代码):">
|
||||
<el-input v-model="companyList[companyIndex].code"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="考察对象(个人/单位)所在地:">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[companyIndex][0]" placeholder="请选择省">
|
||||
<el-option v-for="(item, index) in provinceData" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[companyIndex][1]" placeholder="请选择市"
|
||||
:disabled="addressIndex[companyIndex].length === 0">
|
||||
<template v-if="addressIndex[companyIndex][0] !== null">
|
||||
<el-option v-for="(item, index) in cityData[addressIndex[companyIndex][0]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[companyIndex][2]" placeholder="请选择区"
|
||||
:disabled="addressIndex[companyIndex].length === 1">
|
||||
<template
|
||||
v-if="addressIndex[companyIndex][0] !== null && addressIndex[companyIndex][1] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in areaData[addressIndex[companyIndex][0]][addressIndex[companyIndex][1]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="companyList[companyIndex].address" placeholder="请输入详细地址"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收文件电子邮箱:">
|
||||
<el-input v-model="companyList[companyIndex].email"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收文件微信:">
|
||||
<el-input v-model="companyList[companyIndex].wechat"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收文件寄件地址">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[companyIndex][0]" placeholder="请选择省">
|
||||
<el-option v-for="(item, index) in provinceData" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[companyIndex][1]" placeholder="请选择市"
|
||||
:disabled="receiveAddressIndex[companyIndex].length === 0">
|
||||
<template v-if="receiveAddressIndex[companyIndex][0] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in cityData[receiveAddressIndex[companyIndex][0]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[companyIndex][2]" placeholder="请选择区"
|
||||
:disabled="receiveAddressIndex[companyIndex].length === 1">
|
||||
<template
|
||||
v-if="receiveAddressIndex[companyIndex][0] !== null && receiveAddressIndex[companyIndex][1] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in areaData[receiveAddressIndex[companyIndex][0]][receiveAddressIndex[companyIndex][1]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="companyList[companyIndex].receiveAddress" placeholder="请输入详细地址"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请人:">
|
||||
<el-input v-model="companyList[companyIndex].requestName"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系人:">
|
||||
<el-input v-model="companyList[companyIndex].contactName"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系方式:">
|
||||
<el-input v-model="companyList[companyIndex].contact"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="本次服务费用小计:">
|
||||
<view class="flex justify-between items-start mb-20 w-100p">
|
||||
<view class="flex justify-start items-center">
|
||||
<el-input v-model="amount" disabled/>
|
||||
<view class="ml-20">
|
||||
<el-button type="primary" @click.native="addCompany">增加考察对象
|
||||
</el-button>
|
||||
</view>
|
||||
<view class="ml-20">
|
||||
<el-button type="primary" plain @click.native="removeCompany(companyIndex)"
|
||||
class="ml-20"
|
||||
:disabled="companyList.length === 1">删除该对象
|
||||
</el-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</el-form-item>
|
||||
</view>
|
||||
</el-form>
|
||||
<view class="mt-40 flex justify-center items-center">
|
||||
<view class="flex justify-center items-center">
|
||||
<text>总价:</text>
|
||||
<text class="text-main font-bold text-35">{{ totalAmount }}元</text>
|
||||
</view>
|
||||
<view class="ml-35">客服联系方式: 0771-3923001</view>
|
||||
</view>
|
||||
<view class="mt-40 flex justify-center items-center">
|
||||
<el-button type="primary" @click="newOrder"
|
||||
:disabled="companyList.length === 0 || !companyList[0].name">
|
||||
立即支付
|
||||
</el-button>
|
||||
<view class="server-item-content">
|
||||
<view class="server-select-row">
|
||||
<text class="ml-15 nowrap-label">服务项目:</text>
|
||||
<el-select v-model="configList[index].contentIndex" clearable
|
||||
class="server-select"
|
||||
:disabled="!contentList.includes(index)">
|
||||
<el-option v-for="(content, contentIndex) in item.contents" :key="contentIndex"
|
||||
:label="content.title" :value="contentIndex"/>
|
||||
</el-select>
|
||||
<template v-if="item.contentIndex !== null">
|
||||
<text class="ml-15 nowrap-label">金额:</text>
|
||||
<el-select v-model="configList[index].amountIndex"
|
||||
clearable class="server-select ml-15">
|
||||
<el-option
|
||||
v-for="(amount, amountIndex) in item.contents[item.contentIndex].amountList"
|
||||
:key="amountIndex"
|
||||
:label="amount.title" :value="amountIndex"/>
|
||||
</el-select>
|
||||
</template>
|
||||
</view>
|
||||
<view class="server-amount-text" v-if="item.contentIndex !== null && item.amountIndex!== null">
|
||||
{{ item.contents[item.contentIndex].amountList[item.amountIndex].amount }}元/次
|
||||
</view>
|
||||
<view class="server-amount-text" v-else>
|
||||
元/次
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="remark">备注: {{ item.remark }}</view>
|
||||
</view>
|
||||
</el-checkbox>
|
||||
</view>
|
||||
<gap/>
|
||||
<common-footer></common-footer>
|
||||
<el-form ref="form" :model="form" label-width="200px">
|
||||
<view v-for="(item, companyIndex) in companyList" :key="companyIndex">
|
||||
<el-divider>{{ item.name }}</el-divider>
|
||||
<el-form-item label="考察对象类型:" required>
|
||||
<el-select v-model="companyList[companyIndex].type" placeholder="请选择考察对象类型">
|
||||
<el-option label="企业" value="企业"></el-option>
|
||||
<!-- <el-option label="个人" value="个人"></el-option>-->
|
||||
<el-option label="项目" value="项目"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="`考察对象(全称):`" required>
|
||||
<el-input v-model="companyList[companyIndex].name"/>
|
||||
</el-form-item>
|
||||
<template v-if="item.type === '个人'">
|
||||
<el-form-item label="考察对象(全称): " required>
|
||||
<el-input v-model="companyList[companyIndex].code"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="考察对象所在地:" required>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[companyIndex][0]" placeholder="请选择省">
|
||||
<el-option v-for="(item, index) in provinceData" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[companyIndex][1]" placeholder="请选择市"
|
||||
:disabled="addressIndex[companyIndex].length === 0">
|
||||
<template v-if="addressIndex[companyIndex][0] !== null">
|
||||
<el-option v-for="(item, index) in cityData[addressIndex[companyIndex][0]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[companyIndex][2]" placeholder="请选择区"
|
||||
:disabled="addressIndex[companyIndex].length === 1">
|
||||
<template
|
||||
v-if="addressIndex[companyIndex][0] !== null && addressIndex[companyIndex][1] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in areaData[addressIndex[companyIndex][0]][addressIndex[companyIndex][1]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="companyList[companyIndex].address" placeholder="请输入详细地址"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<el-form-item label="本次服务费用小计:">
|
||||
<view class="flex justify-between items-start mb-20 w-100p">
|
||||
<view class="flex justify-start items-center">
|
||||
<el-input v-model="amount" disabled/>
|
||||
<view class="ml-20">
|
||||
<el-button type="primary" plain @click.native="removeCompany(companyIndex)"
|
||||
class="ml-20"
|
||||
:disabled="companyList.length === 1">删除该对象
|
||||
</el-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</el-form-item>
|
||||
|
||||
</view>
|
||||
<el-divider/>
|
||||
<el-button type="primary" @click.native="addCompany">增加考察对象
|
||||
</el-button>
|
||||
<el-form-item label="接收文件电子邮箱:" required>
|
||||
<el-input v-model="email"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收文件微信:" required>
|
||||
<el-input v-model="wechat"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收文件寄件地址" required>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[0]" placeholder="请选择省">
|
||||
<el-option v-for="(item, index) in provinceData" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[1]" placeholder="请选择市"
|
||||
:disabled="receiveAddressIndex.length === 0">
|
||||
<template v-if="receiveAddressIndex[0] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in cityData[receiveAddressIndex[0]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[2]" placeholder="请选择区"
|
||||
:disabled="receiveAddressIndex.length === 1">
|
||||
<template
|
||||
v-if="receiveAddressIndex[0] !== null && receiveAddressIndex[1] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in areaData[receiveAddressIndex[0]][receiveAddressIndex[1]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="receiveAddress"
|
||||
placeholder="请输入详细地址"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<p class="text-main text-25 text-center" style="margin-bottom: 80rpx">接收文件电子邮箱/ 接收文件微信/
|
||||
接收文件寄件地址,以上三项选填一项即可</p>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8" class="flex justify-start items-center">
|
||||
<el-form-item label="申请人:" required>
|
||||
<el-input v-model="requestName"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" class="flex justify-start items-center">
|
||||
<el-form-item label="业务联系人:" required>
|
||||
<el-input v-model="contactName"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" class="flex justify-start items-center">
|
||||
<el-form-item label="业务咨询联系方式:" required>
|
||||
<el-input v-model="contact"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="8" class="flex justify-start items-center">-->
|
||||
<!-- <el-form-item label="业务联系人:" required>-->
|
||||
<!-- <el-select v-model="contactName" 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-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="8" class="flex justify-start items-center">-->
|
||||
<!-- <el-form-item label="业务咨询联系方式:" required>-->
|
||||
<!-- <el-input v-model="contact" type="number" disabled/>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
</el-row>
|
||||
<!-- <el-form-item label="联系方式:" required>-->
|
||||
<!-- <el-input v-model="contact" disabled/>-->
|
||||
<!-- </el-form-item>-->
|
||||
</el-form>
|
||||
<view class="mt-40 flex justify-center items-center">
|
||||
<view class="flex justify-center items-center">
|
||||
<text>总价:</text>
|
||||
<text class="text-main font-bold text-35">{{ totalAmount }}元</text>
|
||||
</view>
|
||||
<view class="ml-35">客服联系方式: 400-686-5559</view>
|
||||
</view>
|
||||
<view class="flex justify-start items-center">
|
||||
<el-checkbox v-model="agree">我已阅读并同意</el-checkbox>
|
||||
<span class="text-main pointer font-bold" @click="dialogVisible = true">《金久信自营交易协议》</span>
|
||||
</view>
|
||||
<view class="mt-40 flex justify-center items-center">
|
||||
<el-button type="primary" @click="newOrder"
|
||||
:disabled="companyList.length === 0 || !companyList[0].name || !agree">
|
||||
立即支付
|
||||
</el-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<gap/>
|
||||
<common-footer></common-footer>
|
||||
<el-dialog
|
||||
title="金久信自营交易协议"
|
||||
:visible.sync="dialogVisible"
|
||||
width="70%">
|
||||
<div v-html="agreement"></div>
|
||||
</el-dialog>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -195,167 +261,352 @@ import areas from "@/uni_modules/vk-uview-ui/libs/address/areas.json";
|
||||
import Gap from "../../../components/gap/gap.vue";
|
||||
|
||||
export default {
|
||||
name: "companyQuote",
|
||||
components: {Gap},
|
||||
data() {
|
||||
return {
|
||||
provinceData: provinces,
|
||||
cityData: citys,
|
||||
areaData: areas,
|
||||
list: [
|
||||
{
|
||||
image: '/static/images/selfSupport/swiper.jpg',
|
||||
title: '昨夜星辰昨夜风，画楼西畔桂堂东'
|
||||
},
|
||||
],
|
||||
form: {},
|
||||
configList: [],
|
||||
checkList: [],
|
||||
contentList: [],
|
||||
contentNameList: [],
|
||||
addressIndex: [[null, null, null]],
|
||||
addressDetail: '',
|
||||
receiveAddressIndex: [[null, null, null]],
|
||||
receiveAddressDetail: '',
|
||||
companyList: [
|
||||
{
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
address: '',
|
||||
email: '',
|
||||
wechat: '',
|
||||
receiveAddressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
receiveAddress: '',
|
||||
requestName: '',
|
||||
contactName: '',
|
||||
contact: '',
|
||||
}
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getConfigList() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/coop/config/pub/getList',
|
||||
data: {type: 0}
|
||||
})
|
||||
if (rows) {
|
||||
this.configList = rows.map(item => {
|
||||
item.contents.map(content => {
|
||||
content.checked = false
|
||||
content.amountIndex = null
|
||||
return content
|
||||
})
|
||||
return item
|
||||
})
|
||||
}
|
||||
},
|
||||
addCompany() {
|
||||
this.companyList.push({
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
address: '',
|
||||
email: '',
|
||||
wechat: '',
|
||||
receiveAddressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
receiveAddress: '',
|
||||
requestName: '',
|
||||
contactName: '',
|
||||
contact: '',
|
||||
})
|
||||
this.addressIndex.push([null, null, null])
|
||||
this.receiveAddressIndex.push([null, null, null])
|
||||
},
|
||||
removeCompany(index) {
|
||||
this.companyList.splice(index, 1)
|
||||
this.addressIndex.splice(index, 1)
|
||||
this.receiveAddressIndex.splice(index, 1)
|
||||
},
|
||||
async newOrder() {
|
||||
const amountList = []
|
||||
this.configList.forEach(item => {
|
||||
item.contents.forEach(content => {
|
||||
if (content.checked && content.amountList.length > 0) {
|
||||
content.amountList.forEach((amount, amountIndex) => {
|
||||
if (amountIndex === content.amountIndex) {
|
||||
amountList.push(amount._index)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
if (amountList.length === 0) return this.$message({
|
||||
message: '请至少选择一项服务',
|
||||
type: 'error'
|
||||
})
|
||||
this.companyList.forEach((item, index) => {
|
||||
this.companyList[index].addressRegion = {
|
||||
province: this.provinceData[this.addressIndex[index][0]],
|
||||
city: this.cityData[this.addressIndex[index][0]][this.addressIndex[index][1]],
|
||||
area: this.areaData[this.addressIndex[index][0]][this.addressIndex[index][1]][this.addressIndex[index][2]],
|
||||
}
|
||||
this.companyList[index].receiveAddressRegion = {
|
||||
province: this.provinceData[this.receiveAddressIndex[index][0]],
|
||||
city: this.cityData[this.receiveAddressIndex[index][0]][this.receiveAddressIndex[index][1]],
|
||||
area: this.areaData[this.receiveAddressIndex[index][0]][this.receiveAddressIndex[index][1]][this.receiveAddressIndex[index][2]],
|
||||
}
|
||||
})
|
||||
const {data} = await vk.callFunction({
|
||||
url: 'client/selfSupport/kh/addOrder',
|
||||
data: {
|
||||
type: 0,
|
||||
amountList,
|
||||
contentList: this.companyList
|
||||
}
|
||||
})
|
||||
vk.navigateTo({
|
||||
url: `/pages/index/shop/pay?id=${data}`
|
||||
})
|
||||
},
|
||||
selectAmount(index, contentIndex, e) {
|
||||
console.log(index, contentIndex, e)
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getConfigList()
|
||||
},
|
||||
computed: {
|
||||
amount() {
|
||||
let tmpAmount = 0
|
||||
this.configList.forEach(item => {
|
||||
item.contents.forEach(content => {
|
||||
if (content.checked && content.amountList.length > 0) {
|
||||
content.amountList.forEach((amount, amountIndex) => {
|
||||
if (amountIndex === content.amountIndex) {
|
||||
tmpAmount += parseFloat(amount.amount)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
return tmpAmount
|
||||
},
|
||||
totalAmount() {
|
||||
return this.amount * this.companyList.length
|
||||
name: "companyQuote",
|
||||
components: {Gap},
|
||||
data() {
|
||||
return {
|
||||
provinceData: provinces,
|
||||
cityData: citys,
|
||||
areaData: areas,
|
||||
form: {},
|
||||
configList: [],
|
||||
checkList: [],
|
||||
contentList: [],
|
||||
contentNameList: [],
|
||||
addressIndex: [[null, null, null]],
|
||||
addressDetail: '',
|
||||
receiveAddressIndex: [null, null, null],
|
||||
receiveAddressDetail: '',
|
||||
companyList: [
|
||||
{
|
||||
name: '',
|
||||
code: '',
|
||||
type: '企业',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
address: '',
|
||||
}
|
||||
],
|
||||
email: '',
|
||||
wechat: '',
|
||||
receiveAddressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
receiveAddress: '',
|
||||
requestName: '',
|
||||
contactName: '',
|
||||
contact: '',
|
||||
agreement: '',
|
||||
agree: false,
|
||||
dialogVisible: false,
|
||||
contactList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
async getConfigList() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/coop/config/pub/getList',
|
||||
data: {type: 0}
|
||||
})
|
||||
if (rows) {
|
||||
this.configList = rows.map(item => {
|
||||
item.checked = false
|
||||
item.contentIndex = null
|
||||
item.amountIndex = null
|
||||
return item
|
||||
})
|
||||
}
|
||||
},
|
||||
changeCheck(itemIndex, name, checked) {
|
||||
this.configList.forEach((item, index) => {
|
||||
item.checked = checked && index === itemIndex
|
||||
if (index !== itemIndex || !checked) {
|
||||
item.contentIndex = null
|
||||
item.amountIndex = null
|
||||
}
|
||||
})
|
||||
this.contentList = checked ? [itemIndex] : []
|
||||
this.contentNameList = checked ? [name] : []
|
||||
},
|
||||
addCompany() {
|
||||
this.companyList.push({
|
||||
name: '',
|
||||
code: '',
|
||||
type: '企业',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
})
|
||||
this.addressIndex.push([null, null, null])
|
||||
this.receiveAddressIndex.push([null, null, null])
|
||||
},
|
||||
removeCompany(index) {
|
||||
this.companyList.splice(index, 1)
|
||||
this.addressIndex.splice(index, 1)
|
||||
this.receiveAddressIndex.splice(index, 1)
|
||||
},
|
||||
async newOrder() {
|
||||
const amountList = []
|
||||
this.configList.forEach(item => {
|
||||
item.contents.forEach((content, contentIndex) => {
|
||||
if (contentIndex === item.contentIndex && content.amountList.length > 0) {
|
||||
content.amountList.forEach((amount, amountIndex) => {
|
||||
if (amountIndex === item.amountIndex) {
|
||||
amountList.push(`${content._index},${amount._index}`)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
if (amountList.length === 0) return this.$message({
|
||||
message: '请至少选择一项服务',
|
||||
type: 'error'
|
||||
})
|
||||
// if (this.addressIndex[0][2] === null) return this.$message({
|
||||
// message: '请选择地址',
|
||||
// type: 'error'
|
||||
// })
|
||||
if (!this.email && !this.wechat && this.receiveAddressIndex[0][2] === null) return this.$message({
|
||||
message: '请选择接收文件地址/微信/邮箱',
|
||||
type: 'error'
|
||||
})
|
||||
this.companyList.forEach((item, index) => {
|
||||
if (this.addressIndex[index][2]) {
|
||||
const companyProvince = this.provinceData[this.addressIndex[index][0]]
|
||||
const companyCity = this.cityData[this.addressIndex[index][0]][this.addressIndex[index][1]]
|
||||
const companyArea = this.areaData[this.addressIndex[index][0]][this.addressIndex[index][1]][this.addressIndex[index][2]]
|
||||
this.companyList[index].addressRegion = {
|
||||
province: {code: companyProvince.code, name: companyProvince.name},
|
||||
city: {code: companyCity.code, name: companyCity.name},
|
||||
area: {code: companyArea.code, name: companyArea.name},
|
||||
}
|
||||
}
|
||||
})
|
||||
for (let i = 0; i < this.companyList.length; i++) {
|
||||
if (!this.companyList[i].name) return this.$message({
|
||||
message: '请填写考察对象名称',
|
||||
type: 'error'
|
||||
})
|
||||
if (this.companyList[i].type === '个人') {
|
||||
if (!this.companyList[i].code) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写考察个人身份证号',
|
||||
})
|
||||
if (!this.companyList[i].address) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写个人地址',
|
||||
})
|
||||
if (this.addressIndex[i][2] === null) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写个人地址',
|
||||
})
|
||||
}
|
||||
}
|
||||
if (!this.requestName) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写申请人',
|
||||
})
|
||||
if (!this.contactName) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写业务联系人姓名',
|
||||
})
|
||||
if (!this.contact) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写联系人电话',
|
||||
})
|
||||
if (this.receiveAddressIndex.length > 0 && this.receiveAddressIndex[2] !== null) {
|
||||
const province = this.provinceData[this.receiveAddressIndex[0]]
|
||||
const city = this.cityData[this.receiveAddressIndex[0]][this.receiveAddressIndex[1]]
|
||||
const area = this.areaData[this.receiveAddressIndex[0]][this.receiveAddressIndex[1]][this.receiveAddressIndex[2]]
|
||||
this.receiveAddressRegion = {
|
||||
province: {code: province.code, name: province.name},
|
||||
city: {code: city.code, name: city.name},
|
||||
area: {code: area.code, name: area.name},
|
||||
}
|
||||
}
|
||||
const {data} = await vk.callFunction({
|
||||
url: 'client/selfSupport/kh/addOrder',
|
||||
title: '提交中...',
|
||||
data: {
|
||||
type: 0,
|
||||
amountList,
|
||||
contentList: this.companyList,
|
||||
receiveAddressRegion: this.receiveAddressRegion,
|
||||
email: this.email,
|
||||
wechat: this.wechat,
|
||||
receiveAddress: this.receiveAddress,
|
||||
requestName: this.requestName,
|
||||
contactName: this.contactName,
|
||||
contact: this.contact,
|
||||
}
|
||||
})
|
||||
vk.navigateTo({
|
||||
url: `/pages/index/shop/pay?id=${data}`
|
||||
})
|
||||
},
|
||||
showAgreement() {
|
||||
this.$confirm(this.agreement, '金久信自营交易协议', {
|
||||
cancelButtonText: '关闭',
|
||||
showConfirmButton: false,
|
||||
dangerouslyUseHTMLString: true,
|
||||
})
|
||||
},
|
||||
async getAgreement() {
|
||||
const res = await vk.callFunction({
|
||||
url: 'client/dict/pub/getDetail',
|
||||
data: {
|
||||
id: '65885d4c09664c1c8d8e8476'
|
||||
},
|
||||
})
|
||||
this.agreement = res.content
|
||||
},
|
||||
demoDownload() {
|
||||
vk.callFunction({
|
||||
url: 'client/dict/pub/getDetail',
|
||||
data: {
|
||||
id: '6588642a99c624e89199fbb4'
|
||||
},
|
||||
success: res => {
|
||||
window.open(res.content)
|
||||
}
|
||||
})
|
||||
},
|
||||
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.contact = contact.phone
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
const userInfo = vk.getVuex('$user.userInfo')
|
||||
if (parseInt(userInfo.accountType) === 2) {
|
||||
this.email = userInfo.company.contactEmail
|
||||
this.requestName = userInfo.manager.personName
|
||||
this.contactName = userInfo.manager.personName
|
||||
this.contact = userInfo.company.mobile
|
||||
if (userInfo.company && userInfo.company.addressRegion) {
|
||||
this.receiveAddressIndex[0] = this.provinceData.findIndex(item => item.name === userInfo.company.addressRegion.province.name)
|
||||
this.receiveAddressIndex[1] = this.cityData[this.receiveAddressIndex[0]].findIndex(item => item.name === userInfo.company.addressRegion.city.name)
|
||||
this.receiveAddressIndex[2] = this.areaData[this.receiveAddressIndex[0]][this.receiveAddressIndex[1]].findIndex(item => item.name === userInfo.company.addressRegion.area.name)
|
||||
}
|
||||
if (userInfo.company.addressDetail) this.receiveAddress = userInfo.company.addressDetail
|
||||
} else {
|
||||
if (userInfo.businessCard && userInfo.businessCard.email) this.email = userInfo.businessCard.email
|
||||
this.requestName = userInfo.person.personName
|
||||
this.contactName = userInfo.person.personName
|
||||
this.contact = userInfo.person.mobile
|
||||
if (userInfo.person && userInfo.person.addressRegion) {
|
||||
this.receiveAddressIndex[0] = this.provinceData.findIndex(item => item.name === userInfo.person.addressRegion.province.name)
|
||||
this.receiveAddressIndex[1] = this.cityData[this.receiveAddressIndex[0]].findIndex(item => item.name === userInfo.person.addressRegion.city.name)
|
||||
this.receiveAddressIndex[2] = this.areaData[this.receiveAddressIndex[0]][this.receiveAddressIndex[1]].findIndex(item => item.name === userInfo.person.addressRegion.area.name)
|
||||
}
|
||||
if (userInfo.person.addressDetail) this.receiveAddress = userInfo.person.addressDetail
|
||||
}
|
||||
this.getAgreement()
|
||||
this.getConfigList()
|
||||
// this.getContactList()
|
||||
},
|
||||
computed: {
|
||||
amount() {
|
||||
let tmpAmount = 0
|
||||
this.configList.forEach(item => {
|
||||
item.contents.forEach((content, contentIndex) => {
|
||||
if (contentIndex === item.contentIndex && content.amountList.length > 0) {
|
||||
content.amountList.forEach((amount, amountIndex) => {
|
||||
if (amountIndex === item.amountIndex) {
|
||||
tmpAmount += parseFloat(amount.amount)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
return tmpAmount
|
||||
},
|
||||
totalAmount() {
|
||||
return this.amount * this.companyList.length
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.server-item {
|
||||
background-color: #fbf8f8;
|
||||
border: 2px solid #fbebf1;
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.items-center {
|
||||
width: 1100px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
|
||||
view {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.ml-35 {
|
||||
font-weight: normal;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
.server-item-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 600px !important;
|
||||
}
|
||||
|
||||
.server-select-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: auto !important;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.server-select {
|
||||
width: 180px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.server-amount-text {
|
||||
width: 80px !important;
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.nowrap-label {
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.remark {
|
||||
color: #999999;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.divider-title {
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,532 @@
|
||||
<template>
|
||||
<view>
|
||||
<top-bar></top-bar>
|
||||
<common-header></common-header>
|
||||
<category-bar></category-bar>
|
||||
<view class="w-1200 m-a">
|
||||
<common-swiper page="self-support-quote-swiper"/>
|
||||
<view class="flex justify-end items-center text-main pointer my-20 " @click="demoDownload">示例下载</view>
|
||||
<view class="bg-white p-40">
|
||||
<view v-for="(item, index) in configList" :key="index"
|
||||
class="server-item my-20 flex flex-col justify-start items-start">
|
||||
<el-checkbox @change="changeCheck(index, item.name)">
|
||||
<view class="flex flex-col justify-start items-start">
|
||||
<view class="flex justify-start items-center text-35 mb-20">
|
||||
<view class="name" style="width: 120px;">{{ item.name }}</view>
|
||||
<view class="ml-15" style="width: 120px;">
|
||||
<text>业务编号:</text>
|
||||
<text v-if="item.contentIndex !== null">{{
|
||||
item.contents[item.contentIndex].code
|
||||
}}
|
||||
</text>
|
||||
</view>
|
||||
<view class="server-item-content">
|
||||
<text class="ml-15">服务项目:</text>
|
||||
<el-select v-model="configList[index].contentIndex" clearable style="width: 200px"
|
||||
:disabled="!contentList.includes(index)">
|
||||
<el-option v-for="(content, contentIndex) in item.contents" :key="contentIndex"
|
||||
:label="content.title" :value="contentIndex"/>
|
||||
</el-select>
|
||||
<template v-if="item.contentIndex !== null">
|
||||
<el-select v-model="configList[index].amountIndex" @change="changeAmountIndex(index)"
|
||||
clearable class="ml-15" style="width: 300px">
|
||||
<el-option
|
||||
v-for="(amount, amountIndex) in item.contents[item.contentIndex].amountList"
|
||||
:key="amountIndex"
|
||||
:label="amount.title" :value="amountIndex"/>
|
||||
</el-select>
|
||||
<template v-if="configList[index].amountIndex !== null">
|
||||
<text class="ml-15">清单单品项数:</text>
|
||||
<el-input v-model="configList[index].num" style="width: 200px"/>
|
||||
</template>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
<view class="remark">备注: {{ item.remark }}</view>
|
||||
</view>
|
||||
</el-checkbox>
|
||||
</view>
|
||||
<el-form ref="form" :model="form" label-width="200px">
|
||||
<view v-for="(item, companyIndex) in companyList" :key="companyIndex">
|
||||
<el-divider>{{ item.name }}</el-divider>
|
||||
<el-form-item label="产品明细：" required>
|
||||
<vk-data-upload v-model="companyList[companyIndex].files" list-type="text"
|
||||
:on-preview="previewUpload"
|
||||
accept=".jpg,.jpeg,.png,.xlsx,.doc,.docx,.pdf">
|
||||
</vk-data-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="产品应用地址:" required>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[companyIndex][0]" placeholder="请选择省">
|
||||
<el-option v-for="(item, index) in provinceData" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[companyIndex][1]" placeholder="请选择市"
|
||||
:disabled="addressIndex[companyIndex].length === 0">
|
||||
<template v-if="addressIndex[companyIndex][0] !== null">
|
||||
<el-option v-for="(item, index) in cityData[addressIndex[companyIndex][0]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[companyIndex][2]" placeholder="请选择区"
|
||||
:disabled="addressIndex[companyIndex].length === 1">
|
||||
<template
|
||||
v-if="addressIndex[companyIndex][0] !== null && addressIndex[companyIndex][1] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in areaData[addressIndex[companyIndex][0]][addressIndex[companyIndex][1]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="companyList[companyIndex].address" placeholder="请输入详细地址"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
</view>
|
||||
<el-divider/>
|
||||
<el-form-item label="接收文件电子邮箱:" required>
|
||||
<el-input v-model="email"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收文件微信:" required>
|
||||
<el-input v-model="wechat"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收文件寄件地址" required>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[0]" placeholder="请选择省">
|
||||
<el-option v-for="(item, index) in provinceData" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[1]" placeholder="请选择市"
|
||||
:disabled="receiveAddressIndex.length === 0">
|
||||
<template v-if="receiveAddressIndex[0] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in cityData[receiveAddressIndex[0]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[2]" placeholder="请选择区"
|
||||
:disabled="receiveAddressIndex.length === 1">
|
||||
<template
|
||||
v-if="receiveAddressIndex[0] !== null && receiveAddressIndex[1] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in areaData[receiveAddressIndex[0]][receiveAddressIndex[1]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="receiveAddress" placeholder="请输入详细地址"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<p class="text-main text-25 text-center" style="margin-bottom: 80rpx">接收文件电子邮箱/ 接收文件微信/
|
||||
接收文件寄件地址,以上三项选填一项即可</p>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8" class="flex justify-start items-center">
|
||||
<el-form-item label="申请人:" required>
|
||||
<el-input v-model="requestName"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" class="flex justify-start items-center">
|
||||
<el-form-item label="业务联系人:" required>
|
||||
<el-input v-model="contactName"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" class="flex justify-start items-center">
|
||||
<el-form-item label="业务咨询联系方式:" required>
|
||||
<el-input v-model="contact"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<view class="mt-40 flex justify-center items-center">
|
||||
<view class="ml-35">客服联系方式: 400-686-5559</view>
|
||||
</view>
|
||||
<view class="flex justify-start items-center">
|
||||
<el-checkbox v-model="agree">我已阅读并同意</el-checkbox>
|
||||
<span class="text-main pointer font-bold" @click="dialogVisible = true">《金久信自营交易协议》</span>
|
||||
</view>
|
||||
<view class="mt-40 flex justify-center items-center">
|
||||
<el-button type="primary" @click="newOrder"
|
||||
:disabled="companyList.length === 0 || !agree">
|
||||
立即提交
|
||||
</el-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<gap/>
|
||||
<common-footer></common-footer>
|
||||
<el-dialog
|
||||
title="金久信自营交易协议"
|
||||
:visible.sync="dialogVisible"
|
||||
width="70%">
|
||||
<div v-html="agreement"></div>
|
||||
</el-dialog>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
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";
|
||||
import Gap from "../../../components/gap/gap.vue";
|
||||
|
||||
export default {
|
||||
name: "companyQuote",
|
||||
components: {Gap},
|
||||
data() {
|
||||
return {
|
||||
provinceData: provinces,
|
||||
cityData: citys,
|
||||
areaData: areas,
|
||||
form: {},
|
||||
configList: [],
|
||||
checkList: [],
|
||||
contentList: [],
|
||||
contentNameList: [],
|
||||
addressIndex: [[null, null, null]],
|
||||
addressDetail: '',
|
||||
receiveAddressIndex: [null, null, null],
|
||||
receiveAddressDetail: '',
|
||||
companyList: [
|
||||
{
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
address: '',
|
||||
}
|
||||
],
|
||||
email: '',
|
||||
wechat: '',
|
||||
receiveAddressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
receiveAddress: '',
|
||||
requestName: '',
|
||||
contactName: '',
|
||||
contact: '',
|
||||
agreement: '',
|
||||
agree: false,
|
||||
dialogVisible: false,
|
||||
contactList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
async getConfigList() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/coop/config/pub/getList',
|
||||
data: {type: 2}
|
||||
})
|
||||
if (rows) {
|
||||
this.configList = rows.map(item => {
|
||||
item.contentIndex = null
|
||||
item.amountIndex = null
|
||||
item.num = null
|
||||
return item
|
||||
})
|
||||
}
|
||||
},
|
||||
changeCheck(itemIndex, name) {
|
||||
const index = this.contentList.indexOf(itemIndex)
|
||||
if (index === -1) {
|
||||
this.contentList.push(itemIndex)
|
||||
this.contentNameList.push(name)
|
||||
} else {
|
||||
this.contentList.splice(index, 1)
|
||||
this.contentNameList.splice(index, 1)
|
||||
this.configList[itemIndex].contentIndex = null
|
||||
this.configList[itemIndex].amountIndex = null
|
||||
}
|
||||
},
|
||||
addCompany() {
|
||||
this.companyList.push({
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
})
|
||||
this.addressIndex.push([null, null, null])
|
||||
this.receiveAddressIndex.push([null, null, null])
|
||||
},
|
||||
removeCompany(index) {
|
||||
this.companyList.splice(index, 1)
|
||||
this.addressIndex.splice(index, 1)
|
||||
this.receiveAddressIndex.splice(index, 1)
|
||||
},
|
||||
async newOrder() {
|
||||
const amountList = []
|
||||
this.configList.forEach(item => {
|
||||
item.contents.forEach((content, contentIndex) => {
|
||||
if (contentIndex === item.contentIndex && content.amountList.length > 0) {
|
||||
content.amountList.forEach((amount, amountIndex) => {
|
||||
if (amountIndex === item.amountIndex) {
|
||||
amountList.push(`${content._index},${amount._index},${item.num}`)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
if (amountList.length === 0) return this.$message({
|
||||
message: '请至少选择一项服务',
|
||||
type: 'error'
|
||||
})
|
||||
if (this.addressIndex[0][2] === null) return this.$message({
|
||||
message: '请选择地址',
|
||||
type: 'error'
|
||||
})
|
||||
if (!this.email && !this.wechat && this.receiveAddressIndex[0][2] === null) return this.$message({
|
||||
message: '请选择接收文件地址/微信/邮箱',
|
||||
type: 'error'
|
||||
})
|
||||
this.companyList.forEach((item, index) => {
|
||||
const companyProvince = this.provinceData[this.addressIndex[index][0]]
|
||||
const companyCity = this.cityData[this.addressIndex[index][0]][this.addressIndex[index][1]]
|
||||
const companyArea = this.areaData[this.addressIndex[index][0]][this.addressIndex[index][1]][this.addressIndex[index][2]]
|
||||
this.companyList[index].addressRegion = {
|
||||
province: {code: companyProvince.code, name: companyProvince.name},
|
||||
city: {code: companyCity.code, name: companyCity.name},
|
||||
area: {code: companyArea.code, name: companyArea.name},
|
||||
}
|
||||
})
|
||||
for (let i = 0; i < this.companyList.length; i++) {
|
||||
if (!this.companyList[i].files || this.companyList[i].files.length === 0) return this.$message({
|
||||
message: '请上传产品明细',
|
||||
type: 'error'
|
||||
})
|
||||
if (!this.companyList[i].address) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写产品应用地址',
|
||||
})
|
||||
if (this.addressIndex[i][2] === null) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写产品应用地址',
|
||||
})
|
||||
}
|
||||
if (!this.requestName) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写申请人',
|
||||
})
|
||||
if (!this.contactName) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写业务联系人姓名',
|
||||
})
|
||||
if (!this.contact) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写联系人电话',
|
||||
})
|
||||
if (this.receiveAddressIndex.length > 0 && this.receiveAddressIndex[2] !== null) {
|
||||
const province = this.provinceData[this.receiveAddressIndex[0]]
|
||||
const city = this.cityData[this.receiveAddressIndex[0]][this.receiveAddressIndex[1]]
|
||||
const area = this.areaData[this.receiveAddressIndex[0]][this.receiveAddressIndex[1]][this.receiveAddressIndex[2]]
|
||||
this.receiveAddressRegion = {
|
||||
province: {code: province.code, name: province.name},
|
||||
city: {code: city.code, name: city.name},
|
||||
area: {code: area.code, name: area.name},
|
||||
}
|
||||
}
|
||||
const {data} = await vk.callFunction({
|
||||
url: 'client/selfSupport/kh/addOrder',
|
||||
title: '提交中...',
|
||||
data: {
|
||||
type: 2,
|
||||
amountList,
|
||||
contentList: this.companyList,
|
||||
receiveAddressRegion: this.receiveAddressRegion,
|
||||
email: this.email,
|
||||
wechat: this.wechat,
|
||||
receiveAddress: this.receiveAddress,
|
||||
requestName: this.requestName,
|
||||
contactName: this.contactName,
|
||||
contact: this.contact,
|
||||
}
|
||||
})
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '已提交',
|
||||
})
|
||||
vk.navigateBack()
|
||||
},
|
||||
showAgreement() {
|
||||
this.$confirm(this.agreement, '金久信自营交易协议', {
|
||||
cancelButtonText: '关闭',
|
||||
showConfirmButton: false,
|
||||
dangerouslyUseHTMLString: true,
|
||||
})
|
||||
},
|
||||
async getAgreement() {
|
||||
const res = await vk.callFunction({
|
||||
url: 'client/dict/pub/getDetail',
|
||||
data: {
|
||||
id: '65885d4c09664c1c8d8e8476'
|
||||
},
|
||||
})
|
||||
this.agreement = res.content
|
||||
},
|
||||
demoDownload() {
|
||||
vk.callFunction({
|
||||
url: 'client/dict/pub/getDetail',
|
||||
data: {
|
||||
id: '6588642a99c624e89199fbb4'
|
||||
},
|
||||
success: res => {
|
||||
window.open(res.content)
|
||||
}
|
||||
})
|
||||
},
|
||||
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.contact = contact.phone
|
||||
},
|
||||
changeAmountIndex(configIndex) {
|
||||
const config = this.configList[configIndex]
|
||||
if (config.contentIndex !== null && config.amountIndex !== null) {
|
||||
this.configList[configIndex].num = config.contents[config.contentIndex].amountList[config.amountIndex].defaultNum
|
||||
}
|
||||
},
|
||||
previewUpload({url}) {
|
||||
window.open(url)
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
const userInfo = vk.getVuex('$user.userInfo')
|
||||
// console.log('userInfo', userInfo)
|
||||
if (parseInt(userInfo.accountType) === 2) {
|
||||
this.email = userInfo.company.contactEmail
|
||||
this.requestName = userInfo.manager.personName
|
||||
this.contactName = userInfo.manager.personName
|
||||
this.contact = userInfo.company.mobile
|
||||
if (userInfo.company && userInfo.company.addressRegion) {
|
||||
this.receiveAddressIndex[0] = this.provinceData.findIndex(item => item.name === userInfo.company.addressRegion.province.name)
|
||||
this.receiveAddressIndex[1] = this.cityData[this.receiveAddressIndex[0]].findIndex(item => item.name === userInfo.company.addressRegion.city.name)
|
||||
this.receiveAddressIndex[2] = this.areaData[this.receiveAddressIndex[0]][this.receiveAddressIndex[1]].findIndex(item => item.name === userInfo.company.addressRegion.area.name)
|
||||
}
|
||||
if (userInfo.company.addressDetail) this.receiveAddress = userInfo.company.addressDetail
|
||||
} else {
|
||||
if (userInfo.businessCard && userInfo.businessCard.email) this.email = userInfo.businessCard.email
|
||||
this.requestName = userInfo.person.personName
|
||||
this.contactName = userInfo.person.personName
|
||||
this.contact = userInfo.person.mobile
|
||||
if (userInfo.person && userInfo.person.addressRegion) {
|
||||
this.receiveAddressIndex[0] = this.provinceData.findIndex(item => item.name === userInfo.person.addressRegion.province.name)
|
||||
this.receiveAddressIndex[1] = this.cityData[this.receiveAddressIndex[0]].findIndex(item => item.name === userInfo.person.addressRegion.city.name)
|
||||
this.receiveAddressIndex[2] = this.areaData[this.receiveAddressIndex[0]][this.receiveAddressIndex[1]].findIndex(item => item.name === userInfo.person.addressRegion.area.name)
|
||||
}
|
||||
if (userInfo.person.addressDetail) this.receiveAddress = userInfo.person.addressDetail
|
||||
}
|
||||
this.getAgreement()
|
||||
this.getConfigList()
|
||||
// this.getContactList()
|
||||
},
|
||||
computed: {
|
||||
amount() {
|
||||
let tmpAmount = 0
|
||||
this.configList.forEach(item => {
|
||||
item.contents.forEach((content, contentIndex) => {
|
||||
if (contentIndex === item.contentIndex && content.amountList.length > 0) {
|
||||
content.amountList.forEach((amount, amountIndex) => {
|
||||
if (amountIndex === item.amountIndex) {
|
||||
tmpAmount += parseFloat(amount.amount)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
return tmpAmount
|
||||
},
|
||||
totalAmount() {
|
||||
return this.amount * this.companyList.length
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.server-item {
|
||||
background-color: #fbf8f8;
|
||||
border: 2px solid #fbebf1;
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.items-center {
|
||||
width: 1100px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
|
||||
view {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.ml-35 {
|
||||
font-weight: normal;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
.server-item-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
//width: 600px !important;
|
||||
}
|
||||
|
||||
.remark {
|
||||
color: #999999;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.divider-title {
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
@@ -1,193 +1,276 @@
|
||||
<template>
|
||||
<view>
|
||||
<top-bar></top-bar>
|
||||
<common-header></common-header>
|
||||
<category-bar></category-bar>
|
||||
<view class="w-1200 m-a">
|
||||
<u-swiper :list="list" :height="380" borderRadius="0"></u-swiper>
|
||||
<view class="bg-white p-40">
|
||||
<view v-for="(item, index) in configList" :key="index"
|
||||
class="my-20 flex flex-col justify-start items-start">
|
||||
<view class="flex flex-col justify-start items-start">
|
||||
<view class="flex justify-start items-center text-35 mb-20">
|
||||
<text>服务内容:{{ item.name }}</text>
|
||||
<view class="flex flex-col justify-start items-start">
|
||||
<view v-for="(content, contentIndex) in item.contents" :key="contentIndex"
|
||||
class="mb-40 flex justify-start items-center">
|
||||
<view class="ml-35">
|
||||
<text>业务编号:</text>
|
||||
<text>{{ content.code }}</text>
|
||||
</view>
|
||||
<view class="flex justify-start items-center">
|
||||
<text class="ml-35">服务服务项目:</text>
|
||||
<el-checkbox v-model="configList[index].contents[contentIndex].checked"
|
||||
@change="selectContent(content)"
|
||||
:disabled="!content.amountList || content.amountList.length === 0">
|
||||
{{ content.title }}
|
||||
</el-checkbox>
|
||||
</view>
|
||||
<view class="flex justify-start items-center ml-35">
|
||||
<el-select v-model="configList[index].contents[contentIndex].amountIndex"
|
||||
clearable
|
||||
:disabled="!content.amountList || content.amountList.length === 0">
|
||||
<el-option v-for="(amount, amountIndex) in content.amountList"
|
||||
:key="amountIndex"
|
||||
:label="amount.title" :value="amountIndex"/>
|
||||
</el-select>
|
||||
<text class="ml-35" v-if="content.amountIndex !== null">
|
||||
{{ content.amountList[content.amountIndex].amount }}元/次
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<top-bar></top-bar>
|
||||
<common-header></common-header>
|
||||
<category-bar></category-bar>
|
||||
<view class="w-1200 m-a">
|
||||
<common-swiper page="self-support-product-swiper"/>
|
||||
<view class="flex justify-end items-center text-main pointer my-20 " @click="demoDownload">示例下载</view>
|
||||
|
||||
</view>
|
||||
<view>备注: {{ item.remark }}</view>
|
||||
</view>
|
||||
<view class="bg-white p-40">
|
||||
<view v-for="(item, index) in configList" :key="index"
|
||||
class="server-item my-20 flex flex-col justify-start items-start">
|
||||
<el-checkbox @change="changeCheck(index, item.name)">
|
||||
<view class="flex flex-col justify-start items-start">
|
||||
<view class="flex justify-start items-center text-35 mb-20">
|
||||
<view class="name">{{ item.name }}</view>
|
||||
<view class="ml-15">
|
||||
<text>业务编号:</text>
|
||||
<text v-if="item.contentIndex !== null">{{
|
||||
item.contents[item.contentIndex].code
|
||||
}}
|
||||
</text>
|
||||
</view>
|
||||
<el-form ref="form" :model="form" label-width="200px">
|
||||
<view v-for="(item, productIndex) in productList" :key="productIndex">
|
||||
<el-form-item label="检测产品:" required>
|
||||
<el-input v-model="productList[productIndex].name"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="检测内容">
|
||||
{{ contentNameList.join() }}
|
||||
</el-form-item>
|
||||
<el-form-item label="取样所在地">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[productIndex][0]" placeholder="请选择省">
|
||||
<el-option v-for="(item, index) in provinceData" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[productIndex][1]" placeholder="请选择市"
|
||||
:disabled="addressIndex[productIndex].length === 0">
|
||||
<template v-if="addressIndex[productIndex][0] !== null">
|
||||
<el-option v-for="(item, index) in cityData[addressIndex[productIndex][0]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[productIndex][2]" placeholder="请选择区"
|
||||
:disabled="addressIndex[productIndex].length === 1">
|
||||
<template
|
||||
v-if="addressIndex[productIndex][0] !== null && addressIndex[productIndex][1] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in areaData[addressIndex[productIndex][0]][addressIndex[productIndex][1]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="productList[productIndex].address" placeholder="请输入详细地址"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收文件电子邮箱:">
|
||||
<el-input v-model="productList[productIndex].email"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收文件微信:">
|
||||
<el-input v-model="productList[productIndex].wechat"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收文件寄件地址">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[productIndex][0]" placeholder="请选择省">
|
||||
<el-option v-for="(item, index) in provinceData" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[productIndex][1]" placeholder="请选择市"
|
||||
:disabled="receiveAddressIndex[productIndex].length === 0">
|
||||
<template v-if="receiveAddressIndex[productIndex][0] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in cityData[receiveAddressIndex[productIndex][0]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[productIndex][2]" placeholder="请选择区"
|
||||
:disabled="receiveAddressIndex[productIndex].length === 1">
|
||||
<template
|
||||
v-if="receiveAddressIndex[productIndex][0] !== null && receiveAddressIndex[productIndex][1] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in areaData[receiveAddressIndex[productIndex][0]][receiveAddressIndex[productIndex][1]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="productList[productIndex].receiveAddress" placeholder="请输入详细地址"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请人:">
|
||||
<el-input v-model="productList[productIndex].requestName"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系人:">
|
||||
<el-input v-model="productList[productIndex].contactName"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系方式:">
|
||||
<el-input v-model="productList[productIndex].contact"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="本次服务费用小计:">
|
||||
<view class="flex justify-between items-start mb-20 w-100p">
|
||||
<view class="flex justify-start items-center">
|
||||
<el-input v-model="amount" disabled/>
|
||||
<view class="ml-20">
|
||||
<el-button type="primary" @click.native="addProduct">增加考察对象
|
||||
</el-button>
|
||||
</view>
|
||||
<view class="ml-20">
|
||||
<el-button type="primary" plain @click.native="removeProduct(productIndex)"
|
||||
class="ml-20"
|
||||
:disabled="productList.length === 1">删除该对象
|
||||
</el-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</el-form-item>
|
||||
</view>
|
||||
</el-form>
|
||||
<view class="mt-40 flex justify-center items-center">
|
||||
<view class="flex justify-center items-center">
|
||||
<text>总价:</text>
|
||||
<text class="text-main font-bold text-35">{{ totalAmount }}元</text>
|
||||
</view>
|
||||
<view class="ml-35">客服联系方式: 0771-3923001</view>
|
||||
<view class="server-item-content">
|
||||
<text class="ml-15">服务项目:</text>
|
||||
<el-select v-model="configList[index].contentIndex" clearable
|
||||
:disabled="!contentList.includes(index)">
|
||||
<el-option v-for="(content, contentIndex) in item.contents" :key="contentIndex"
|
||||
:label="content.title" :value="contentIndex"/>
|
||||
</el-select>
|
||||
|
||||
<template v-if="item.contentIndex !== null">
|
||||
<el-select v-model="configList[index].amountIndex"
|
||||
clearable class="ml-15">
|
||||
<el-option
|
||||
v-for="(amount, amountIndex) in item.contents[item.contentIndex].amountList"
|
||||
:key="amountIndex"
|
||||
:label="amount.title" :value="amountIndex"/>
|
||||
</el-select>
|
||||
</template>
|
||||
</view>
|
||||
<view class="mt-40 flex justify-center items-center">
|
||||
<el-button type="primary" @click.native="newOrder"
|
||||
:disabled="productList.length === 0 || !productList[0].name">
|
||||
立即支付
|
||||
</el-button>
|
||||
<text>金额:</text>
|
||||
<view class="ml-15" v-if="item.contentIndex !== null && item.amountIndex !== null">
|
||||
{{ item.contents[item.contentIndex].amountList[item.amountIndex].amount }}元/次
|
||||
</view>
|
||||
<view class="ml-15" v-else>
|
||||
元/次
|
||||
</view>
|
||||
<el-button type="primary" size="small"
|
||||
@click="addToAmountList(index, configList[index].contentIndex, item.amountIndex)"
|
||||
:disabled="item.amountIndex === null">
|
||||
添加
|
||||
</el-button>
|
||||
</view>
|
||||
<view class="remark">备注: {{ item.remark }}</view>
|
||||
</view>
|
||||
</el-checkbox>
|
||||
</view>
|
||||
<gap/>
|
||||
<common-footer></common-footer>
|
||||
<el-form ref="form" :model="form" label-width="200px">
|
||||
<view v-for="(item, productIndex) in productList" :key="productIndex">
|
||||
<el-form-item label="检测产品:" required>
|
||||
<el-input v-model="productList[productIndex].name"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="文档上传：">
|
||||
<vk-data-upload v-model="productList[productIndex].files" list-type="text"
|
||||
:on-preview="previewUpload"
|
||||
accept=".jpg,.jpeg,.png,.xlsx,.doc,.docx,.pdf">
|
||||
</vk-data-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="检测内容">
|
||||
{{ contentNameList.join() }}
|
||||
</el-form-item>
|
||||
<el-form-item label="取样所在地">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[productIndex][0]" placeholder="请选择省">
|
||||
<el-option v-for="(item, index) in provinceData" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[productIndex][1]" placeholder="请选择市"
|
||||
:disabled="addressIndex[productIndex].length === 0">
|
||||
<template v-if="addressIndex[productIndex][0] !== null">
|
||||
<el-option v-for="(item, index) in cityData[addressIndex[productIndex][0]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="addressIndex[productIndex][2]" placeholder="请选择区"
|
||||
:disabled="addressIndex[productIndex].length === 1">
|
||||
<template
|
||||
v-if="addressIndex[productIndex][0] !== null && addressIndex[productIndex][1] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in areaData[addressIndex[productIndex][0]][addressIndex[productIndex][1]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="productList[productIndex].address" placeholder="请输入详细地址"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="本次服务费用小计:">
|
||||
<view class="flex justify-between items-start mb-20 w-100p">
|
||||
<view class="flex justify-start items-center">
|
||||
<el-input v-model="amount" disabled/>
|
||||
</view>
|
||||
<view class="ml-20">
|
||||
<el-button type="primary" plain @click.native="removeProduct(productIndex)"
|
||||
class="ml-20"
|
||||
:disabled="productList.length === 1">删除该对象
|
||||
</el-button>
|
||||
</view>
|
||||
</view>
|
||||
</el-form-item>
|
||||
<el-divider/>
|
||||
</view>
|
||||
<el-form-item label="接收文件电子邮箱:">
|
||||
<el-input v-model="email"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收文件微信:">
|
||||
<el-input v-model="wechat"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收文件寄件地址">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[0]" placeholder="请选择省">
|
||||
<el-option v-for="(item, index) in provinceData" :key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[1]" placeholder="请选择市"
|
||||
:disabled="receiveAddressIndex.length === 0">
|
||||
<template v-if="receiveAddressIndex[0] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in cityData[receiveAddressIndex[0]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<el-select v-model="receiveAddressIndex[2]" placeholder="请选择区"
|
||||
:disabled="receiveAddressIndex.length === 1">
|
||||
<template
|
||||
v-if="receiveAddressIndex[0] !== null && receiveAddressIndex[1] !== null">
|
||||
<el-option
|
||||
v-for="(item, index) in areaData[receiveAddressIndex[0]][receiveAddressIndex[1]]"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="index">
|
||||
</el-option>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="11">
|
||||
<el-input v-model="receiveAddress"
|
||||
placeholder="请输入详细地址"/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<p class="text-main text-25 text-center" style="margin-bottom: 80rpx">接收文件电子邮箱/ 接收文件微信/
|
||||
接收文件寄件地址,以上三项选填一项即可</p>
|
||||
<!-- <el-form-item label="申请人:">-->
|
||||
<!-- <el-input v-model="requestName"/>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="联系人:">-->
|
||||
<!-- <el-input v-model="contactName"/>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- <el-form-item label="联系方式:">-->
|
||||
<!-- <el-input v-model="contact"/>-->
|
||||
<!-- </el-form-item>-->
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8" class="flex justify-start items-center">
|
||||
<el-form-item label="申请人:" required>
|
||||
<el-input v-model="requestName"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" class="flex justify-start items-center">
|
||||
<el-form-item label="业务联系人:" required>
|
||||
<el-input v-model="contactName"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" class="flex justify-start items-center">
|
||||
<el-form-item label="业务咨询联系方式:" required>
|
||||
<el-input v-model="contact"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="8" class="flex justify-start items-center">-->
|
||||
<!-- <el-form-item label="联系人:" required>-->
|
||||
<!-- <el-select v-model="contactName" 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-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="8" class="flex justify-start items-center">-->
|
||||
<!-- <el-form-item label="业务咨询联系方式:" required>-->
|
||||
<!-- <el-input v-model="contact" type="number" disabled/>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
</el-row>
|
||||
<el-form-item label="备注:">
|
||||
<el-input v-model="remark"/>
|
||||
</el-form-item>
|
||||
<el-button type="primary" @click.native="addProduct">增加考察对象
|
||||
</el-button>
|
||||
</el-form>
|
||||
<view class="mt-20">
|
||||
<view>已选项目:</view>
|
||||
<view v-for="(item, index) in amountList" :key="index" class="mt-20 flex justify-start items-center">
|
||||
<el-button type="primary" size="small" @click="removeFromAmountList(index)">删除</el-button>
|
||||
<p class="ml-20">{{ configList[item.index].name }} -- {{ configList[item.index].contents[item.contentIndex].title }} --
|
||||
{{
|
||||
configList[item.index].contents[item.contentIndex].amountList[item.amountIndex].title
|
||||
}},{{ configList[item.index].contents[item.contentIndex].amountList[item.amountIndex].amount }}元</p>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="mt-40 flex justify-center items-center">
|
||||
<view class="flex justify-center items-center">
|
||||
<text>总价:</text>
|
||||
<text class="text-main font-bold text-35">{{ totalAmount }}元</text>
|
||||
</view>
|
||||
<view class="ml-35">客服联系方式: 400-686-5559</view>
|
||||
</view>
|
||||
<view class="flex justify-start items-center">
|
||||
<el-checkbox v-model="agree">我已阅读并同意</el-checkbox>
|
||||
<span class="text-main pointer font-bold" @click="dialogVisible = true">《金久信自营交易协议》</span>
|
||||
</view>
|
||||
<view class="mt-40 flex justify-center items-center">
|
||||
<el-button type="primary" @click.native="newOrder"
|
||||
:disabled="productList.length === 0 || !productList[0].name || !agree">
|
||||
立即支付
|
||||
</el-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<gap/>
|
||||
<common-footer></common-footer>
|
||||
<el-dialog
|
||||
title="金久信自营交易协议"
|
||||
:visible.sync="dialogVisible"
|
||||
width="70%">
|
||||
<div v-html="agreement"></div>
|
||||
</el-dialog>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -196,168 +279,341 @@ 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 {
|
||||
name: "productQuote",
|
||||
data() {
|
||||
return {
|
||||
provinceData: provinces,
|
||||
cityData: citys,
|
||||
areaData: areas,
|
||||
list: [
|
||||
{
|
||||
image: '/static/images/selfSupport/swiper.jpg',
|
||||
title: '昨夜星辰昨夜风，画楼西畔桂堂东'
|
||||
},
|
||||
],
|
||||
form: {},
|
||||
configList: [],
|
||||
checkList: [],
|
||||
contentList: [],
|
||||
contentNameList: [],
|
||||
addressIndex: [[null, null, null]],
|
||||
addressDetail: '',
|
||||
receiveAddressIndex: [[null, null, null]],
|
||||
receiveAddressDetail: '',
|
||||
productList: [
|
||||
{
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
address: '',
|
||||
email: '',
|
||||
wechat: '',
|
||||
receiveAddressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
receiveAddress: '',
|
||||
requestName: '',
|
||||
contactName: '',
|
||||
contact: '',
|
||||
}
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getConfigList() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/coop/config/pub/getList',
|
||||
data: {type: 1}
|
||||
})
|
||||
if (rows) {
|
||||
this.configList = rows.map(item => {
|
||||
item.contents.map(content => {
|
||||
content.checked = false
|
||||
content.amountIndex = null
|
||||
return content
|
||||
})
|
||||
return item
|
||||
})
|
||||
}
|
||||
},
|
||||
addProduct() {
|
||||
this.productList.push({
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
address: '',
|
||||
email: '',
|
||||
wechat: '',
|
||||
receiveAddressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
receiveAddress: '',
|
||||
requestName: '',
|
||||
contactName: '',
|
||||
contact: '',
|
||||
})
|
||||
this.addressIndex.push([null, null, null])
|
||||
this.receiveAddressIndex.push([null, null, null])
|
||||
},
|
||||
removeProduct(index) {
|
||||
this.productList.splice(index, 1)
|
||||
this.addressIndex.splice(index, 1)
|
||||
this.receiveAddressIndex.splice(index, 1)
|
||||
},
|
||||
selectContent(content) {
|
||||
const index = this.contentNameList.indexOf(content.title)
|
||||
if (index === -1) this.contentNameList.push(content.title)
|
||||
else this.contentNameList.splice(index, 1)
|
||||
},
|
||||
async newOrder() {
|
||||
const amountList = []
|
||||
this.configList.forEach(item => {
|
||||
item.contents.forEach(content => {
|
||||
if (content.checked && content.amountList.length > 0) {
|
||||
content.amountList.forEach((amount, amountIndex) => {
|
||||
if (amountIndex === content.amountIndex) {
|
||||
amountList.push(amount._index)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
if (amountList.length === 0) return this.$message({
|
||||
message: '请至少选择一项服务',
|
||||
type: 'error'
|
||||
})
|
||||
this.productList.forEach((item, index) => {
|
||||
this.productList[index].addressRegion = {
|
||||
province: this.provinceData[this.addressIndex[index][0]],
|
||||
city: this.cityData[this.addressIndex[index][0]][this.addressIndex[index][1]],
|
||||
area: this.areaData[this.addressIndex[index][0]][this.addressIndex[index][1]][this.addressIndex[index][2]],
|
||||
}
|
||||
this.productList[index].receiveAddressRegion = {
|
||||
province: this.provinceData[this.receiveAddressIndex[index][0]],
|
||||
city: this.cityData[this.receiveAddressIndex[index][0]][this.receiveAddressIndex[index][1]],
|
||||
area: this.areaData[this.receiveAddressIndex[index][0]][this.receiveAddressIndex[index][1]][this.receiveAddressIndex[index][2]],
|
||||
}
|
||||
})
|
||||
const {data} = await vk.callFunction({
|
||||
url: 'client/selfSupport/kh/addOrder',
|
||||
data: {
|
||||
type: 1,
|
||||
amountList,
|
||||
contentList: this.productList
|
||||
}
|
||||
})
|
||||
vk.navigateTo({
|
||||
url: `/pages/index/shop/pay?id=${data}`
|
||||
})
|
||||
},
|
||||
},
|
||||
onLoad() {
|
||||
this.getConfigList()
|
||||
},
|
||||
computed: {
|
||||
amount() {
|
||||
let tmpAmount = 0
|
||||
this.configList.forEach(item => {
|
||||
item.contents.forEach(content => {
|
||||
if (content.checked && content.amountList.length > 0) {
|
||||
content.amountList.forEach((amount, amountIndex) => {
|
||||
if (amountIndex === content.amountIndex) {
|
||||
tmpAmount += parseFloat(amount.amount)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
return tmpAmount
|
||||
},
|
||||
totalAmount() {
|
||||
return this.amount * this.productList.length
|
||||
name: "productQuote",
|
||||
data() {
|
||||
return {
|
||||
provinceData: provinces,
|
||||
cityData: citys,
|
||||
areaData: areas,
|
||||
form: {},
|
||||
configList: [],
|
||||
checkList: [],
|
||||
contentList: [],
|
||||
contentNameList: [],
|
||||
addressIndex: [[null, null, null]],
|
||||
addressDetail: '',
|
||||
receiveAddressIndex: [null, null, null],
|
||||
receiveAddressDetail: '',
|
||||
productList: [
|
||||
{
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
address: '',
|
||||
}
|
||||
],
|
||||
email: '',
|
||||
wechat: '',
|
||||
receiveAddressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
receiveAddress: '',
|
||||
requestName: '',
|
||||
contactName: '',
|
||||
contact: '',
|
||||
remark: '',
|
||||
agreement: '',
|
||||
agree: false,
|
||||
dialogVisible: false,
|
||||
contactList: [],
|
||||
files: [],
|
||||
amountList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getConfigList() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/coop/config/pub/getList',
|
||||
data: {type: 1}
|
||||
})
|
||||
if (rows) {
|
||||
this.configList = rows.map(item => {
|
||||
item.contentIndex = null
|
||||
item.amountIndex = null
|
||||
return item
|
||||
})
|
||||
}
|
||||
},
|
||||
addProduct() {
|
||||
this.productList.push({
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
address: '',
|
||||
})
|
||||
this.addressIndex.push([null, null, null])
|
||||
},
|
||||
removeProduct(index) {
|
||||
this.productList.splice(index, 1)
|
||||
this.addressIndex.splice(index, 1)
|
||||
},
|
||||
addToAmountList(index, contentIndex, amountIndex) {
|
||||
this.amountList.push({
|
||||
index,
|
||||
contentIndex,
|
||||
amountIndex,
|
||||
contentIndexVal: this.configList[index].contents[contentIndex]._index,
|
||||
amountIndexVal: this.configList[index].contents[contentIndex].amountList[amountIndex]._index,
|
||||
amount: this.configList[index].contents[contentIndex].amountList[amountIndex].amount
|
||||
})
|
||||
this.configList[index].contentIndex = null
|
||||
this.configList[index].amountIndex = null
|
||||
},
|
||||
removeFromAmountList(index) {
|
||||
this.amountList.splice(index, 1)
|
||||
},
|
||||
async newOrder() {
|
||||
// const amountList = []
|
||||
// this.configList.forEach(item => {
|
||||
// item.contents.forEach((content, contentIndex) => {
|
||||
// if (contentIndex === item.contentIndex && content.amountList.length > 0) {
|
||||
// content.amountList.forEach((amount, amountIndex) => {
|
||||
// if (amountIndex === item.amountIndex) {
|
||||
// amountList.push(`${content._index},${amount._index}`)
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
if (this.amountList.length === 0) return this.$message({
|
||||
message: '请至少选择一项服务',
|
||||
type: 'error'
|
||||
})
|
||||
if (!this.email && !this.wechat && this.receiveAddressIndex[0][2] === null) return this.$message({
|
||||
message: '请选择接收文件地址/微信/邮箱',
|
||||
type: 'error'
|
||||
})
|
||||
if (!this.requestName) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写申请人',
|
||||
})
|
||||
if (!this.contactName) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写联系人姓名',
|
||||
})
|
||||
if (!this.contact) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写联系人电话',
|
||||
})
|
||||
for (let i = 0; i < this.productList.length; i++) {
|
||||
if (!this.productList[i].name) return this.$message({
|
||||
message: '请填写考察产品名称',
|
||||
type: 'error'
|
||||
})
|
||||
if (!this.productList[i].address) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写考察产品地址',
|
||||
})
|
||||
if (this.addressIndex[i][2] === null) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写考察产品地址',
|
||||
})
|
||||
}
|
||||
if (this.receiveAddressIndex.length > 0 && this.receiveAddressIndex[2] !== null) {
|
||||
const province = this.provinceData[this.receiveAddressIndex[0]]
|
||||
const city = this.cityData[this.receiveAddressIndex[0]][this.receiveAddressIndex[1]]
|
||||
const area = this.areaData[this.receiveAddressIndex[0]][this.receiveAddressIndex[1]][this.receiveAddressIndex[2]]
|
||||
this.receiveAddressRegion = {
|
||||
province: {code: province.code, name: province.name},
|
||||
city: {code: city.code, name: city.name},
|
||||
area: {code: area.code, name: area.name},
|
||||
}
|
||||
}
|
||||
this.productList.forEach((item, index) => {
|
||||
const companyProvince = this.provinceData[this.addressIndex[index][0]]
|
||||
const companyCity = this.cityData[this.addressIndex[index][0]][this.addressIndex[index][1]]
|
||||
const companyArea = this.areaData[this.addressIndex[index][0]][this.addressIndex[index][1]][this.addressIndex[index][2]]
|
||||
this.productList[index].addressRegion = {
|
||||
province: {code: companyProvince.code, name: companyProvince.name},
|
||||
city: {code: companyCity.code, name: companyCity.name},
|
||||
area: {code: companyArea.code, name: companyArea.name},
|
||||
}
|
||||
})
|
||||
|
||||
const {data} = await vk.callFunction({
|
||||
url: 'client/selfSupport/kh/addOrder',
|
||||
title: '请求中...',
|
||||
data: {
|
||||
type: 1,
|
||||
amountList: this.amountList.map(item => `${item.contentIndexVal},${item.amountIndexVal}`),
|
||||
contentList: this.productList,
|
||||
receiveAddressRegion: this.receiveAddressRegion,
|
||||
email: this.email,
|
||||
wechat: this.wechat,
|
||||
receiveAddress: this.receiveAddress,
|
||||
requestName: this.requestName,
|
||||
contactName: this.contactName,
|
||||
contact: this.contact,
|
||||
remark: this.remark,
|
||||
}
|
||||
})
|
||||
vk.navigateTo({
|
||||
url: `/pages/index/shop/pay?id=${data}`
|
||||
})
|
||||
},
|
||||
changeCheck(itemIndex, name) {
|
||||
const index = this.contentList.indexOf(itemIndex)
|
||||
if (index === -1) {
|
||||
this.contentList.push(itemIndex)
|
||||
this.contentNameList.push(name)
|
||||
} else {
|
||||
this.contentList.splice(index, 1)
|
||||
this.contentNameList.splice(index, 1)
|
||||
this.configList[itemIndex].contentIndex = null
|
||||
this.configList[itemIndex].amountIndex = null
|
||||
}
|
||||
},
|
||||
showAgreement() {
|
||||
this.$confirm(this.agreement, '金久信自营交易协议', {
|
||||
cancelButtonText: '关闭',
|
||||
showConfirmButton: false,
|
||||
dangerouslyUseHTMLString: true,
|
||||
})
|
||||
},
|
||||
async getAgreement() {
|
||||
const res = await vk.callFunction({
|
||||
url: 'client/dict/pub/getDetail',
|
||||
data: {
|
||||
id: '65885d4c09664c1c8d8e8476'
|
||||
},
|
||||
})
|
||||
this.agreement = res.content
|
||||
},
|
||||
demoDownload() {
|
||||
vk.callFunction({
|
||||
url: 'client/dict/pub/getDetail',
|
||||
data: {
|
||||
id: '6588648da7c432e4a360bb34'
|
||||
},
|
||||
success: res => {
|
||||
window.open(res.content)
|
||||
}
|
||||
})
|
||||
},
|
||||
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.contact = contact.phone
|
||||
},
|
||||
previewUpload({url}) {
|
||||
window.open(url)
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
const userInfo = vk.getVuex('$user.userInfo')
|
||||
// console.log('userInfo', userInfo)
|
||||
if (parseInt(userInfo.accountType) === 2) {
|
||||
this.email = userInfo.company.contactEmail
|
||||
this.requestName = userInfo.manager.personName
|
||||
this.contactName = userInfo.manager.personName
|
||||
this.contact = userInfo.company.mobile
|
||||
if (userInfo.company && userInfo.company.addressRegion) {
|
||||
this.receiveAddressIndex[0] = this.provinceData.findIndex(item => item.name === userInfo.company.addressRegion.province.name)
|
||||
this.receiveAddressIndex[1] = this.cityData[this.receiveAddressIndex[0]].findIndex(item => item.name === userInfo.company.addressRegion.city.name)
|
||||
this.receiveAddressIndex[2] = this.areaData[this.receiveAddressIndex[0]][this.receiveAddressIndex[1]].findIndex(item => item.name === userInfo.company.addressRegion.area.name)
|
||||
}
|
||||
if (userInfo.company.addressDetail) this.receiveAddress = userInfo.company.addressDetail
|
||||
} else {
|
||||
if (userInfo.businessCard && userInfo.businessCard.email) this.email = userInfo.businessCard.email
|
||||
this.requestName = userInfo.person.personName
|
||||
this.contactName = userInfo.person.personName
|
||||
this.contact = userInfo.person.mobile
|
||||
if (userInfo.person && userInfo.person.addressRegion) {
|
||||
this.receiveAddressIndex[0] = this.provinceData.findIndex(item => item.name === userInfo.person.addressRegion.province.name)
|
||||
this.receiveAddressIndex[1] = this.cityData[this.receiveAddressIndex[0]].findIndex(item => item.name === userInfo.person.addressRegion.city.name)
|
||||
this.receiveAddressIndex[2] = this.areaData[this.receiveAddressIndex[0]][this.receiveAddressIndex[1]].findIndex(item => item.name === userInfo.person.addressRegion.area.name)
|
||||
}
|
||||
if (userInfo.person.addressDetail) this.receiveAddress = userInfo.person.addressDetail
|
||||
}
|
||||
this.getConfigList()
|
||||
this.getAgreement()
|
||||
// this.getContactList()
|
||||
},
|
||||
computed: {
|
||||
amount() {
|
||||
let tmpAmount = 0
|
||||
// this.configList.forEach(item => {
|
||||
// item.contents.forEach((content, contentIndex) => {
|
||||
// if (contentIndex === item.contentIndex && content.amountList.length > 0) {
|
||||
// content.amountList.forEach((amount, amountIndex) => {
|
||||
// if (amountIndex === item.amountIndex) {
|
||||
// tmpAmount += parseFloat(amount.amount)
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
this.amountList.forEach(item => {
|
||||
tmpAmount += item.amount
|
||||
})
|
||||
return tmpAmount
|
||||
},
|
||||
totalAmount() {
|
||||
return this.amount * this.productList.length
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.server-item {
|
||||
background-color: #fbf8f8;
|
||||
border: 2px solid #fbebf1;
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.items-center {
|
||||
width: 1100px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
|
||||
view {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.ml-35 {
|
||||
font-weight: normal;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
.server-item-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 600px !important;
|
||||
}
|
||||
|
||||
.remark {
|
||||
color: #999999;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.divider-title {
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,214 @@
|
||||
<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/self-support/self-support">金久信自营</navigator>
|
||||
</el-breadcrumb-item>
|
||||
<el-breadcrumb-item>填写报价信息</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</view>
|
||||
|
||||
<view class="page-main">
|
||||
<quote-remain-num v-if="reloaded"/>
|
||||
<vk-data-form
|
||||
ref="form1"
|
||||
v-model="form1.data"
|
||||
:action="form1.props.action"
|
||||
:columns="form1.props.columns"
|
||||
:rules="form1.props.rules"
|
||||
:form-type="form1.props.formType"
|
||||
:loading.sync="form1.props.loading"
|
||||
:auto-close="false"
|
||||
:show-cancel="false"
|
||||
label-width="160px"
|
||||
@success="onFormSuccess"
|
||||
>
|
||||
<template v-slot:desc>
|
||||
<span>{{ sheet.desc }}</span>
|
||||
</template>
|
||||
<template v-slot:amount>
|
||||
<el-input v-model="form1.data.amount" placeholder="请输入货款总价" @change="formatNumber"></el-input>
|
||||
</template>
|
||||
<template v-slot:sheetFile="{ row, column, index }">
|
||||
<p v-for="(item, index) in sheet.files" :key="index" class="text-main">
|
||||
<a :href="item" target="_blank">预览:文件{{index + 1}}</a>
|
||||
</p>
|
||||
</template>
|
||||
</vk-data-form>
|
||||
</view>
|
||||
<common-footer></common-footer>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
reloaded: false,
|
||||
// 表单相关开始-----------------------------------------------------------
|
||||
form1: {
|
||||
// 表单请求数据，此处可以设置默认值
|
||||
data: {
|
||||
// radio: 1,
|
||||
// checkbox : [1,2]
|
||||
sheetId: null,
|
||||
amount: null,
|
||||
},
|
||||
// 表单属性
|
||||
props: {
|
||||
// 表单请求地址
|
||||
action: "client/selfSupport/kh/addQuote",
|
||||
// 表单字段显示规则
|
||||
columns: [
|
||||
{key: "sheetFile", title: "询价文件", type: "html"},
|
||||
{key: "desc", title: "产品描述", type: "html"},
|
||||
{key: "amount", title: "货款总价(人民币:元)", type: "html"},
|
||||
{key: "files", title: "附件", type: "file", accept: '.pdf'},
|
||||
{key: "remark", title: "报价单详情", type: "textarea"},
|
||||
],
|
||||
// 表单验证规则
|
||||
rules: {
|
||||
amount: [
|
||||
{required: true, message: "货款总价不能为空", trigger: "change,blur"},
|
||||
]
|
||||
},
|
||||
// add 代表添加 update 代表修改
|
||||
formType: "",
|
||||
// 表单是否在请求中
|
||||
loading: false,
|
||||
// 是否显示表单1 的弹窗
|
||||
show: false
|
||||
}
|
||||
},
|
||||
// 表单相关结束-----------------------------------------------------------
|
||||
sheet: null
|
||||
};
|
||||
},
|
||||
onLoad(options = {}) {
|
||||
console.log(options)
|
||||
const {
|
||||
id
|
||||
} = options
|
||||
if (!id) {
|
||||
vk.navigateTo('/pages/self-support/self-support');
|
||||
return
|
||||
}
|
||||
|
||||
this.enquiryId = id
|
||||
this.form1.data.sheetId = id
|
||||
this.getEnquiryDetail()
|
||||
},
|
||||
computed: {
|
||||
totalPriceStr() {
|
||||
if (this.totalPrice == 0) {
|
||||
return "零元"
|
||||
}
|
||||
return vk.myfn.convertCurrency(this.totalPrice / 100)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onFormSuccess() {
|
||||
vk.redirectTo({url: `/pages/index/index`})
|
||||
},
|
||||
// 提交报价单
|
||||
async submit() {
|
||||
|
||||
const data = await vk.userCenter.getCurrentUserInfo();
|
||||
const {userInfo} = data
|
||||
if (userInfo.remainQuoteNum === 0 || !userInfo.remainQuoteNum) {
|
||||
|
||||
}
|
||||
|
||||
// this.$confirm(`今日报价次数${userInfo.quoteTimes || 0}, 是否继续?`, '提示', {
|
||||
// confirmButtonText: '确定',
|
||||
// cancelButtonText: '取消',
|
||||
// type: 'warning',
|
||||
// center: true
|
||||
// }).then(res => {
|
||||
//
|
||||
// })
|
||||
|
||||
vk.callFunction({
|
||||
url: 'client/enquiry/quote/kh/addQuote',
|
||||
title: '请求中...',
|
||||
// data: {
|
||||
// sheet: this.sheet,
|
||||
// totalPrice: this.totalPrice
|
||||
// },
|
||||
success: (data) => {
|
||||
this.$message({
|
||||
message: "报价成功",
|
||||
type: 'success'
|
||||
})
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
},
|
||||
/**
|
||||
* 获取询价单详情
|
||||
*/
|
||||
getEnquiryDetail() {
|
||||
vk.callFunction({
|
||||
url: 'client/selfSupport/kh/getDetail',
|
||||
title: '请求中...',
|
||||
data: {
|
||||
_id: this.enquiryId
|
||||
},
|
||||
success: (res) => {
|
||||
this.sheet = res
|
||||
}
|
||||
});
|
||||
},
|
||||
formatNumber(e){
|
||||
this.form1.data.amount = parseFloat(this.form1.data.amount).toFixed(2)
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.reloaded = false
|
||||
setTimeout(() => {
|
||||
this.reloaded = true
|
||||
}, 500)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page-main {
|
||||
width: 1200px;
|
||||
margin: 20px auto;
|
||||
background-color: #FFFFFF;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.description {
|
||||
margin-bottom: 40px;
|
||||
width: 800px;
|
||||
}
|
||||
|
||||
.quote {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.quote-form {
|
||||
width: 260px;
|
||||
}
|
||||
|
||||
.form-footer {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
background: #fff;
|
||||
padding-top: 0;
|
||||
text-align: center;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
@@ -1,38 +1,89 @@
|
||||
<template>
|
||||
<view>
|
||||
<top-bar></top-bar>
|
||||
<common-header></common-header>
|
||||
<category-bar></category-bar>
|
||||
<view class="w-1200 m-a">
|
||||
<u-swiper :list="list" :height="380" borderRadius="0"></u-swiper>
|
||||
<view class="flex flex-col">
|
||||
<image src="/static/images/selfSupport/company.jpg" class="w-100p pointer" mode="widthFix"
|
||||
@click="navTo('/pages/index/self-support/companyQuote')"/>
|
||||
<image src="/static/images/selfSupport/product.jpg" class="w-100p pointer mt-20" mode="widthFix"
|
||||
@click="navTo('/pages/index/self-support/productQuote')"/>
|
||||
</view>
|
||||
</view>
|
||||
<common-footer></common-footer>
|
||||
<view>
|
||||
<top-bar></top-bar>
|
||||
<common-header></common-header>
|
||||
<category-bar></category-bar>
|
||||
<view class="w-1200 m-a">
|
||||
<!-- <el-carousel :height="`500px`" :style="{width: '1200px'}" class="m-a">-->
|
||||
<!-- <el-carousel-item v-for="(item, index) in list" :key="index" :style="{width: '1200px'}">-->
|
||||
<!-- <image :src="item.image" mode="scaleToFill" :style="{width: '1200px', height: '500px'}"/>-->
|
||||
<!-- </el-carousel-item>-->
|
||||
<!-- </el-carousel>-->
|
||||
<common-swiper page="self-support-main"/>
|
||||
<view class="flex flex-col">
|
||||
<image :src="companyImg" class="w-100p pointer"
|
||||
style="height: 150px"
|
||||
@click="navTo('/pages/index/self-support/companyQuote')"/>
|
||||
<image :src="productImg" class="w-100p pointer mt-20"
|
||||
style="height: 150px"
|
||||
@click="navTo('/pages/index/self-support/productQuote')"/>
|
||||
<image :src="costImg" class="w-100p pointer mt-20"
|
||||
style="height: 150px"
|
||||
@click="navTo('/pages/index/self-support/costQuote')"/>
|
||||
</view>
|
||||
</view>
|
||||
<common-footer></common-footer>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "selectType",
|
||||
data() {
|
||||
return {
|
||||
list: [
|
||||
{
|
||||
image: '/static/images/selfSupport/swiper.jpg',
|
||||
title: '昨夜星辰昨夜风，画楼西畔桂堂东'
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
navTo(url) {
|
||||
vk.navigateTo(url);
|
||||
name: "selectType",
|
||||
data() {
|
||||
return {
|
||||
list: [
|
||||
{
|
||||
image: '/static/images/selfSupport/swiper.jpg',
|
||||
title: '昨夜星辰昨夜风，画楼西畔桂堂东'
|
||||
},
|
||||
],
|
||||
companyImg: '',
|
||||
productImg: '',
|
||||
costImg: '',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
navTo(url) {
|
||||
vk.navigateTo(url);
|
||||
},
|
||||
async getCompanyImg(){
|
||||
vk.callFunction({
|
||||
url: 'client/album/pub/list',
|
||||
data: {
|
||||
page: 'self-support-company'
|
||||
},
|
||||
success: ({swiper}) => {
|
||||
this.companyImg = swiper[0]
|
||||
}
|
||||
})
|
||||
},
|
||||
async getProductImg(){
|
||||
vk.callFunction({
|
||||
url: 'client/album/pub/list',
|
||||
data: {
|
||||
page: 'self-support-product'
|
||||
},
|
||||
success: ({swiper}) => {
|
||||
this.productImg = swiper[0]
|
||||
}
|
||||
})
|
||||
},
|
||||
async getCostImg(){
|
||||
vk.callFunction({
|
||||
url: 'client/album/pub/list',
|
||||
data: {
|
||||
page: 'self-support-quote'
|
||||
},
|
||||
success: ({swiper}) => {
|
||||
this.costImg = swiper[0]
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
onLoad(){
|
||||
this.getCompanyImg()
|
||||
this.getProductImg()
|
||||
this.getCostImg()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -1,215 +1,514 @@
|
||||
<template>
|
||||
<view>
|
||||
<top-bar></top-bar>
|
||||
<common-header></common-header>
|
||||
<category-bar></category-bar>
|
||||
<view class="w-1200">
|
||||
<u-swiper :list="list" :height="380" borderRadius="0"></u-swiper>
|
||||
<view class="test">
|
||||
<text class="pointer" @click="navTo('/pages/index/self-support/self-support')">自营钢城</text>
|
||||
<text class="pointer" @click="navTo('/pages/index/self-support/selectType')">平台服务</text>
|
||||
<text class="pointer" @click="navTo('/pages/index/shop/shop')">特产商城</text>
|
||||
</view>
|
||||
<view class="tool-bar">
|
||||
<view class="search">
|
||||
<text>交易区域：</text>
|
||||
<el-cascader :options="options" :props="{label: 'name', value: 'code'}" v-model="address"
|
||||
@change="getCompanyList" clearable/>
|
||||
</view>
|
||||
<view class="buy-btn">
|
||||
<el-button type="primary" plain class="empty-bg-plain-btn" :disabled="address.length === 0"
|
||||
@click.native="dialogVisible = true">
|
||||
下单询价>
|
||||
</el-button>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 合作单位/联营单位-->
|
||||
<view class="cooperate">
|
||||
<view class="title">合作单位/联营单位</view>
|
||||
<u-gap height="5" bg-color="#f3f3f3"/>
|
||||
<view class="flex justify-start items-start flex-wrap">
|
||||
<view class="w-25p pointer" v-for="(item, index) in companyList" :key="index">
|
||||
<view class="border bg-white flex flex-col justify-center items-center p-20">
|
||||
<image :src="item.businessCard.logo" class="logo"/>
|
||||
<span class="mt-20 line-1 w-100p text-center">
|
||||
主营: {{ item.businessCard.mainBusiness }}
|
||||
</span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-gap height="5" bg-color="#f3f3f3"/>
|
||||
</view>
|
||||
<view>
|
||||
<top-bar></top-bar>
|
||||
<common-header></common-header>
|
||||
<category-bar></category-bar>
|
||||
|
||||
<view class="w-1200">
|
||||
<view class="test">
|
||||
<text class="pointer active" @click="navTo('/pages/index/self-support/self-support')">自营钢城</text>
|
||||
<text class="pointer" @click="navTo('/pages/index/self-support/selectType')">平台服务</text>
|
||||
<text class="pointer" @click="navTo('/pages/index/shop/shop')">特产商城</text>
|
||||
</view>
|
||||
<common-swiper page="self-support-index"/>
|
||||
<div class="flex justify-between items-center w-1200 m-a">
|
||||
<template v-if="ad32.length">
|
||||
<el-carousel :height="`100px`" :style="{width: ad33.length ? '50%' : '100%'}" class="m-a">
|
||||
<el-carousel-item v-for="(item, index) in ad32" :key="index" :style="{width: '100%'}">
|
||||
<image @click="vk.navigateTo(`/pages/yellowPage/info?id=${item.companyId}`)"
|
||||
class="pointer carousel-img" :src="item.swiper" mode="aspectFill"
|
||||
:style="{width: '100%'}"/>
|
||||
</el-carousel-item>
|
||||
</el-carousel>
|
||||
</template>
|
||||
<template v-if="ad33.length">
|
||||
<el-carousel :height="`100px`" :style="{width: ad34.length ? '50%' : '100%'}" class="m-a">
|
||||
<el-carousel-item v-for="(item, index) in ad33" :key="index" :style="{width: '100%'}">
|
||||
<image @click="vk.navigateTo(`/pages/yellowPage/info?id=${item.companyId}`)"
|
||||
class="pointer carousel-img" :src="item.swiper" mode="aspectFill"
|
||||
:style="{width: '100%'}"/>
|
||||
</el-carousel-item>
|
||||
</el-carousel>
|
||||
</template>
|
||||
</div>
|
||||
<div class="flex justify-between items-center w-1200 m-a">
|
||||
<template v-if="ad34.length">
|
||||
<el-carousel :height="`100px`" :style="{width: ad35.length ? '50%' : '100%'}" class="m-a">
|
||||
<el-carousel-item v-for="(item, index) in ad34" :key="index" :style="{width: '100%'}">
|
||||
<image @click="vk.navigateTo(`/pages/yellowPage/info?id=${item.companyId}`)"
|
||||
class="pointer carousel-img" :src="item.swiper" mode="aspectFill"
|
||||
:style="{width: '100%'}"/>
|
||||
</el-carousel-item>
|
||||
</el-carousel>
|
||||
</template>
|
||||
<template v-if="ad35.length">
|
||||
<el-carousel :height="`100px`" :style="{width: ad35.length ? '50%' : '100%'}" class="m-a">
|
||||
<el-carousel-item v-for="(item, index) in ad35" :key="index" :style="{width: '100%'}">
|
||||
<image @click="vk.navigateTo(`/pages/yellowPage/info?id=${item.companyId}`)"
|
||||
class="pointer carousel-img" :src="item.swiper" mode="aspectFill"
|
||||
:style="{width: '100%'}"/>
|
||||
</el-carousel-item>
|
||||
</el-carousel>
|
||||
</template>
|
||||
</div>
|
||||
<view class="tool-bar">
|
||||
<view class="search">
|
||||
<text>交易区域：</text>
|
||||
<el-cascader :options="options" :props="{label: 'name', value: 'code'}" v-model="address"
|
||||
clearable @change="getCompanyList"/>
|
||||
</view>
|
||||
<!-- 现货市场 end -->
|
||||
<gap height="50"/>
|
||||
<right-bar></right-bar>
|
||||
<common-footer></common-footer>
|
||||
<el-dialog
|
||||
title="下询价单"
|
||||
:visible.sync="dialogVisible"
|
||||
width="60%">
|
||||
<vk-data-upload v-model="files" accept="*">
|
||||
</vk-data-upload>
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="addFiles">确 定</el-button>
|
||||
</el-dialog>
|
||||
<view class="flex justify-end items-start">
|
||||
<view class="flex flex-col justify-center items-center mr-10">
|
||||
<el-button type="primary" plain class="empty-bg-plain-btn" :disabled="address.length === 0"
|
||||
@mouseenter.native="showTips = true"
|
||||
@mouseleave.native="showTips = false"
|
||||
@click.native="openDialog">
|
||||
下单询价>
|
||||
</el-button>
|
||||
<text class="text-main mt-10 text-20" v-if="showTips && address.length === 0">请先选择交易区域</text>
|
||||
</view>
|
||||
<el-button type="primary" @click.native="getList">
|
||||
我的询价
|
||||
</el-button>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 合作单位/联营单位-->
|
||||
<view class="cooperate">
|
||||
<view class="title">合作单位/联营单位</view>
|
||||
<u-gap height="5" bg-color="#f3f3f3"/>
|
||||
<view class="flex justify-start items-start flex-wrap">
|
||||
<view class="w-25p pointer" v-for="(item, index) in companyList" :key="index"
|
||||
@click="navToWithAuth(`/pages/yellowPage/info?id=${item.uid}`)">
|
||||
<view class="border bg-white flex justify-start items-center p-20">
|
||||
<image v-if="item.businessCard" :src="item.businessCard.logo" class="logo"/>
|
||||
<image v-else src="/static/images/no-logo.jpg" class="logo" mode="aspectFill"/>
|
||||
<div class="flex flex-col justify-start items-start ml-20 w-67p">
|
||||
<span class="text-30 font-bold mb-25">{{ item.company.companyName }}</span>
|
||||
<span class="mt-20 line-2 w-100p">
|
||||
主营: {{
|
||||
(item.mainSpotCategory && item.mainSpotCategory.length > 0) ? item.mainSpotCategory.join() : ''
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-gap height="5" bg-color="#f3f3f3"/>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 现货市场 end -->
|
||||
<gap height="50"/>
|
||||
<right-bar></right-bar>
|
||||
<common-footer></common-footer>
|
||||
<el-dialog
|
||||
title="下询价单"
|
||||
:visible.sync="dialogVisible"
|
||||
width="60%">
|
||||
<el-form ref="form" label-width="140px">
|
||||
<el-form-item label="联系人" required>
|
||||
<el-select v-model="name" 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="navToContact">个人中心</text>
|
||||
<text>添加</text>
|
||||
</view>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系方式" required>
|
||||
<el-input v-model="phone" placeholder="请输入联系方式" disabled/>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户名称" required>
|
||||
<el-input v-model="company" placeholder="请输入您的名称"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="询价单附件" required>
|
||||
<vk-data-upload v-model="files" list-type="text" accept="*" :on-preview="previewUpload">
|
||||
</vk-data-upload>
|
||||
<!-- <p class="text-main text-25">平台目前仅支持PDF文档上传，请你谅解！</p>-->
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="flex justify-start items-start">
|
||||
<span>金久信自营说明：</span>
|
||||
<div>
|
||||
<p>1、金久信自营目前以不垫资交易方式为主，询价单请备注付款方式，期限和项目名称；</p>
|
||||
<p>2、你未收到报价可能是你的信用风险评分未达到平台审核标准；</p>
|
||||
<p>3、提交成功后请您注意接听电话和查看平台信息便于快速准确报价和成交签约。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-center items-center">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="addFiles">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<el-dialog title="我的询价单" :visible.sync="showList" width="60%">
|
||||
<el-table :data="list" style="width: 100%">
|
||||
<el-table-column prop="name" label="联系人"/>
|
||||
<el-table-column label="询价区域">
|
||||
<template #default="{row}">
|
||||
{{ row.province.name }}{{ row.city.name }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phone" label="联系方式"/>
|
||||
<el-table-column prop="company" label="企业名称"/>
|
||||
<el-table-column label="附件">
|
||||
<template #default="{row}">
|
||||
<file-type v-for="(item, index) in row.files" :key="index" :item="item"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="_add_time_str" label="询价日期"/>
|
||||
</el-table>
|
||||
<div class="mt-20 text-center">
|
||||
<el-button @click="showList = false">关 闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import UGap from "@/uni_modules/vk-uview-ui/components/u-gap/u-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";
|
||||
import FileType from "../../../components/file-type/file-type.vue";
|
||||
|
||||
export default {
|
||||
components: {UGap},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
address: [],
|
||||
files: [],
|
||||
list: [
|
||||
{
|
||||
image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
|
||||
title: '昨夜星辰昨夜风，画楼西畔桂堂东'
|
||||
},
|
||||
{
|
||||
image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
|
||||
title: '身无彩凤双飞翼，心有灵犀一点通'
|
||||
},
|
||||
{
|
||||
image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
|
||||
title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
|
||||
}
|
||||
],
|
||||
options: [],
|
||||
companyList: []
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
if (options && options.menu) {
|
||||
this.currMenu = options.menu
|
||||
}
|
||||
this.getCompanyList()
|
||||
this.options = provinces.map(item => {
|
||||
item.children = [];
|
||||
return item
|
||||
})
|
||||
this.options.forEach((province, index) => {
|
||||
citys[index].forEach(city => {
|
||||
this.options[index].children.push(city)
|
||||
})
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
menuSelect(e) {
|
||||
this.currMenu = e
|
||||
},
|
||||
navTo(url) {
|
||||
vk.navigateTo(url);
|
||||
},
|
||||
async getCompanyList() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/user/pub/getCompany',
|
||||
data: {
|
||||
isCoop: 1,
|
||||
city: this.address.length > 0 ? [this.address[1]] : []
|
||||
}
|
||||
})
|
||||
this.companyList = rows
|
||||
},
|
||||
async addFiles() {
|
||||
await vk.callFunction({
|
||||
url: 'client/selfSupport/kh/add',
|
||||
data: {
|
||||
files: this.files,
|
||||
city: this.address.length > 0 ? this.address[1] : []
|
||||
}
|
||||
})
|
||||
this.$message({
|
||||
message: '下单成功',
|
||||
type: 'success'
|
||||
})
|
||||
this.dialogVisible = false
|
||||
}
|
||||
components: {FileType, UGap},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
address: [],
|
||||
files: [],
|
||||
options: [],
|
||||
companyList: [],
|
||||
name: null,
|
||||
phone: null,
|
||||
company: null,
|
||||
showList: false,
|
||||
list: [],
|
||||
allChildCate: [],
|
||||
contactList: [],
|
||||
showTips: false,
|
||||
ad32: [],
|
||||
ad33: [],
|
||||
ad34: [],
|
||||
ad35: [],
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
if (options && options.menu) {
|
||||
this.currMenu = options.menu
|
||||
}
|
||||
this.getCategoryTreeData()
|
||||
this.options = provinces.map(item => {
|
||||
item.children = [];
|
||||
return item
|
||||
})
|
||||
this.options.forEach((province, index) => {
|
||||
citys[index].forEach(city => {
|
||||
city.children = []
|
||||
this.options[index].children.push(city)
|
||||
})
|
||||
})
|
||||
this.options.forEach((province, index) => {
|
||||
citys[index].forEach((city, cityIndex) => {
|
||||
areas[index][cityIndex].forEach(area => {
|
||||
this.options[index].children[cityIndex].children.push(area)
|
||||
})
|
||||
})
|
||||
})
|
||||
this.getContactList()
|
||||
const user = vk.getVuex('$user.userInfo')
|
||||
this.company = user.accountType === 2 ? user.company.companyName : user.person.personName
|
||||
this.getUserInfo()
|
||||
this.getAd32()
|
||||
this.getAd33()
|
||||
this.getAd34()
|
||||
this.getAd35()
|
||||
},
|
||||
methods: {
|
||||
getCategoryTreeData() {
|
||||
vk.callFunction({
|
||||
url: 'client/spot/category/pub/getTree',
|
||||
title: '请求中...',
|
||||
data: {},
|
||||
success: (data) => {
|
||||
this.allChildCate = []
|
||||
data.rows.forEach(item => {
|
||||
item.children.forEach(child => {
|
||||
this.allChildCate.push(child)
|
||||
})
|
||||
})
|
||||
this.getCompanyList()
|
||||
}
|
||||
});
|
||||
},
|
||||
menuSelect(e) {
|
||||
this.currMenu = e
|
||||
},
|
||||
navTo(url) {
|
||||
vk.navigateTo(url);
|
||||
},
|
||||
async getUserInfo() {
|
||||
const {userInfo, accountNum} = await vk.callFunction({
|
||||
url: 'user/kh/getMyUserInfo'
|
||||
})
|
||||
this.userInfo = userInfo
|
||||
this.accountNum = accountNum
|
||||
},
|
||||
navToWithAuth(url) {
|
||||
if (!this.userInfo.fadadaConfirm || [-1, 2].includes(this.userInfo.authStatus)) {
|
||||
this.$confirm('您尚未认证, 是否前往个人中心认证?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
vk.navigateTo({url: '/pages/user/user?menu=fadada'});
|
||||
})
|
||||
} else {
|
||||
vk.navigateTo(url);
|
||||
}
|
||||
},
|
||||
openDialog() {
|
||||
if (!this.userInfo.fadadaConfirm || [-1, 2].includes(this.userInfo.authStatus)) {
|
||||
this.$confirm('您尚未认证, 是否前往个人中心认证?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
vk.navigateTo({url: '/pages/user/user?menu=fadada'});
|
||||
})
|
||||
} else {
|
||||
this.dialogVisible = true
|
||||
}
|
||||
},
|
||||
async getCompanyList() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/user/pub/getCompany',
|
||||
data: {
|
||||
isCoop: 1,
|
||||
province: this.address.length > 0 ? [this.address[0]] : []
|
||||
}
|
||||
})
|
||||
this.companyList = rows.map(item => {
|
||||
item.name = item.company.companyName
|
||||
item.mainSpotCategory = []
|
||||
if (item.company && item.company.mainSpotCategoryIds) {
|
||||
this.allChildCate.forEach(child => {
|
||||
if (item.company.mainSpotCategoryIds.includes(child._id)) {
|
||||
item.mainSpotCategory.push(child.name)
|
||||
}
|
||||
})
|
||||
}
|
||||
return item
|
||||
})
|
||||
},
|
||||
async addFiles() {
|
||||
if (!this.name) return this.$message({type: 'error', message: '请输入联系人'})
|
||||
if (!this.phone) return this.$message({type: 'error', message: '请输入联系方式'})
|
||||
if (!this.company) return this.$message({type: 'error', message: '请输入您的企业名称'})
|
||||
if (this.files.length === 0) return this.$message({type: 'error', message: '请上传询价单附件'})
|
||||
if (!vk.getVuex('$user.userInfo.fadadaConfirm') || [-1, 2].includes(vk.getVuex('$user.userInfo.authStatus'))) {
|
||||
this.$confirm('您尚未认证, 是否前往个人中心认证?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
showCancelButton: false,
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
vk.navigateTo({url: '/pages/user/user?menu=fadada'});
|
||||
})
|
||||
this.dialogVisible = false
|
||||
return
|
||||
}
|
||||
let city, province
|
||||
this.options.forEach((provinceItem, index) => {
|
||||
provinceItem.children.forEach(cityItem => {
|
||||
if (cityItem.code === this.address[1]) {
|
||||
city = cityItem
|
||||
province = {code: provinceItem.code, name: provinceItem.name}
|
||||
}
|
||||
})
|
||||
})
|
||||
await vk.callFunction({
|
||||
url: 'client/selfSupport/kh/add',
|
||||
data: {
|
||||
files: this.files,
|
||||
city,
|
||||
province,
|
||||
name: this.name,
|
||||
phone: this.phone,
|
||||
company: this.company,
|
||||
}
|
||||
})
|
||||
await this.$alert('<p style="text-align: center">您已下单成功，感谢您选择金久信</p><p style="text-align: center">请待平台为您提供竭诚服务！</p><p style="text-align: center; color: red">客服电话：400-686-5559</p>', '', {
|
||||
dangerouslyUseHTMLString: true,
|
||||
})
|
||||
|
||||
this.dialogVisible = false
|
||||
},
|
||||
async getList() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/selfSupport/kh/getList',
|
||||
})
|
||||
this.list = rows
|
||||
this.showList = true
|
||||
},
|
||||
async getContactList() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/businessContact/kh/getList',
|
||||
})
|
||||
this.contactList = rows
|
||||
},
|
||||
navToContact() {
|
||||
this.dialogVisible = false
|
||||
this.showList = false
|
||||
vk.navigateTo({url: '/pages/user/user?menu=business-contact'})
|
||||
},
|
||||
selectContact(name) {
|
||||
const contact = this.contactList.find(item => item.name === name)
|
||||
this.phone = contact.phone
|
||||
},
|
||||
previewUpload({url}) {
|
||||
window.open(url)
|
||||
},
|
||||
async getAd32() {
|
||||
this.ad32 = []
|
||||
// if (this.checkProvinceList.length === 0) {
|
||||
const res = await vk.callFunction({
|
||||
url: 'client/ad/pub/getList',
|
||||
data: {
|
||||
adKey: 32,
|
||||
region: this.address ?? null
|
||||
}
|
||||
})
|
||||
if (res.data) this.ad32 = res.data
|
||||
},
|
||||
async getAd33() {
|
||||
this.ad33 = []
|
||||
// if (this.checkProvinceList.length === 0) {
|
||||
const res = await vk.callFunction({
|
||||
url: 'client/ad/pub/getList',
|
||||
data: {
|
||||
adKey: 33,
|
||||
region: this.address ?? null
|
||||
}
|
||||
})
|
||||
if (res.data) this.ad33 = res.data
|
||||
},
|
||||
async getAd34() {
|
||||
this.ad34 = []
|
||||
// if (this.checkProvinceList.length === 0) {
|
||||
const res = await vk.callFunction({
|
||||
url: 'client/ad/pub/getList',
|
||||
data: {
|
||||
adKey: 34,
|
||||
region: this.address ?? null
|
||||
}
|
||||
})
|
||||
if (res.data) this.ad34 = res.data
|
||||
},
|
||||
async getAd35() {
|
||||
this.ad35 = []
|
||||
// if (this.checkProvinceList.length === 0) {
|
||||
const res = await vk.callFunction({
|
||||
url: 'client/ad/pub/getList',
|
||||
data: {
|
||||
adKey: 35,
|
||||
region: this.address ?? null
|
||||
}
|
||||
})
|
||||
if (res.data) this.ad35 = res.data
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.w-1200 {
|
||||
width: 1200px;
|
||||
margin: 20px auto;
|
||||
background-color: #fff;
|
||||
width: 1200px;
|
||||
margin: 20px auto;
|
||||
background-color: #fff;
|
||||
|
||||
.test {
|
||||
height: 50px;
|
||||
color: #ffffff;
|
||||
font-size: 18px;
|
||||
background-color: #bf2b28;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.test {
|
||||
height: 50px;
|
||||
color: #ffffff;
|
||||
font-size: 18px;
|
||||
background-color: #bf2b28;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
text {
|
||||
margin: 0 20px;
|
||||
}
|
||||
|
||||
text:hover {
|
||||
color: #F2CFCE;
|
||||
}
|
||||
text {
|
||||
padding: 0 20px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.tool-bar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 20px;
|
||||
font-size: 16px;
|
||||
|
||||
.search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
text:hover {
|
||||
background-color: #690503
|
||||
}
|
||||
|
||||
.cooperate {
|
||||
.title {
|
||||
text-align: center;
|
||||
color: #bf2b28;
|
||||
font-size: 28px;
|
||||
line-height: 3em;
|
||||
}
|
||||
|
||||
.wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.grid-content {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
flex-direction: column;
|
||||
|
||||
.comments {
|
||||
line-height: 2em;
|
||||
}
|
||||
}
|
||||
|
||||
.bg-purple {
|
||||
border-top: 1px solid #f3f3f3;
|
||||
border-right: 1px solid #f3f3f3;
|
||||
|
||||
.image {
|
||||
width: 140px;
|
||||
}
|
||||
}
|
||||
.active {
|
||||
background-color: #941411
|
||||
}
|
||||
}
|
||||
|
||||
.tool-bar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
padding: 20px;
|
||||
font-size: 16px;
|
||||
|
||||
.search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.cooperate {
|
||||
.title {
|
||||
text-align: center;
|
||||
color: #bf2b28;
|
||||
font-size: 28px;
|
||||
line-height: 3em;
|
||||
}
|
||||
|
||||
.wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.grid-content {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
flex-direction: column;
|
||||
|
||||
.comments {
|
||||
line-height: 2em;
|
||||
}
|
||||
}
|
||||
|
||||
.bg-purple {
|
||||
border-top: 1px solid #f3f3f3;
|
||||
border-right: 1px solid #f3f3f3;
|
||||
|
||||
.image {
|
||||
width: 140px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user