20261008
This commit is contained in:
@@ -0,0 +1,444 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-sticky offset-top="0" customNavHeight="0">
|
||||
<!-- 顶部 -->
|
||||
<uititle title="信誉实力考察"></uititle>
|
||||
</u-sticky>
|
||||
<view class="p-30">
|
||||
<view v-for="(item, index) in configList" :key="index"
|
||||
class="server-item my-20" :class="{'text-main': contentList.includes(index)}">
|
||||
<u-checkbox-group>
|
||||
<u-checkbox :name="index" :checked="contentList.includes(index)" @change="changeCheck(index, $event)">
|
||||
</u-checkbox>
|
||||
<view class="flex flex-col justify-start items-start ml-15 text-25">
|
||||
<view class="flex flex-col justify-start items-start mb-20">
|
||||
<view class="font-bold">{{ item.name }}</view>
|
||||
<view class="mt-15">
|
||||
<text>业务编号:</text>
|
||||
<text v-if="item.contentIndex !== null">{{
|
||||
item.contents[item.contentIndex].code
|
||||
}}
|
||||
</text>
|
||||
</view>
|
||||
<view class="server-item-content" style="line-height: 50rpx">
|
||||
<text class="mr-15 mb-10">服务项目:</text>
|
||||
<u-icon label-size="25rpx"
|
||||
:label="getServiceLabel(item)"
|
||||
name="arrow-down" label-pos="left" @click="selectContent(index)"/>
|
||||
</view>
|
||||
<text class="mt-15">金额:</text>
|
||||
<view class="mt-15" v-if="item.contentIndex !== null && item.amountIndex !== null">
|
||||
{{ item.contents[item.contentIndex].amountList[item.amountIndex].amount }}元/次
|
||||
</view>
|
||||
<view class="mt-15" v-else>
|
||||
元/次
|
||||
</view>
|
||||
</view>
|
||||
<text class="remark text-25" style="line-height: 30rpx">备注: {{ item.remark }}</text>
|
||||
</view>
|
||||
</u-checkbox-group>
|
||||
</view>
|
||||
|
||||
<view class="card">
|
||||
<u-form ref="form" :model="form" label-width="180rpx" :label-style="{fontSize: '25rpx'}">
|
||||
<view v-for="(item, companyIndex) in companyList" :key="companyIndex">
|
||||
<u-form-item label="个人/企业全称" required>
|
||||
<u-input v-model="companyList[companyIndex].name"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="个人身份证/企业信用代码 " required>
|
||||
<u-input v-model="companyList[companyIndex].code"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="个人/单位所在地:" required @click.native="showAddress(companyIndex)">
|
||||
<u-input v-model="companyList[companyIndex].region" readonly placeholder="点击选择区域"
|
||||
style="pointer-events:none"/>
|
||||
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||
</u-form-item>
|
||||
<u-form-item label="个人/单位详细地址:" required>
|
||||
<u-input v-model="companyList[companyIndex].address" placeholder="请输入详细地址"/>
|
||||
</u-form-item>
|
||||
<view class="ml-20">
|
||||
<u-button type="primary" size="small" plain @click.native="removeCompany(companyIndex)"
|
||||
:disabled="companyList.length === 1">删除该对象
|
||||
</u-button>
|
||||
</view>
|
||||
</view>
|
||||
<u-divider/>
|
||||
<u-form-item label="本次服务费用小计:">
|
||||
<view class="flex justify-between items-start mb-20 w-100p">
|
||||
<view class="flex justify-end items-center">
|
||||
<text>￥{{ amount ? amount.toFixed(2) : 0 }}</text>
|
||||
<view class="ml-20">
|
||||
<u-button type="primary" size="mini" @click.native="addCompany">增加考察对象
|
||||
</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-form-item>
|
||||
<u-form-item label="接收文件电子邮箱:" required>
|
||||
<u-input v-model="email"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="接收文件微信:" required>
|
||||
<u-input v-model="wechat"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="接收文件寄件地址" required @click.native="showReceiveAddress">
|
||||
<u-input v-model="region" readonly placeholder="点击选择区域" style="pointer-events:none"/>
|
||||
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||
</u-form-item>
|
||||
<u-form-item label="详细地址:" required>
|
||||
<u-input v-model="receiveAddress" placeholder="请输入详细地址"/>
|
||||
</u-form-item>
|
||||
<p class="text-main text-25 text-center" style="margin-bottom: 80rpx">接收文件电子邮箱/ 接收文件微信/
|
||||
接收文件寄件地址,以上三项选填一项即可</p>
|
||||
<u-form-item label="申请人:" required>
|
||||
<u-input v-model="requestName"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="业务联系人:" required>
|
||||
<u-input v-model="contactName"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="业务咨询联系方式:" required>
|
||||
<u-input v-model="contact"/>
|
||||
</u-form-item>
|
||||
<view class="mt-40 flex justify-center items-center text-25">
|
||||
<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 text-25 mt-40">
|
||||
<el-checkbox v-model="agree">我已阅读并同意</el-checkbox>
|
||||
<span class="text-main font-bold" @click="show = true">《金久信自营交易协议》</span>
|
||||
</view>
|
||||
<view class="mt-40 flex justify-center items-center text-25">
|
||||
<u-button type="primary" @click="newOrder"
|
||||
:disabled="companyList.length === 0 || !companyList[0].name || !agree">
|
||||
立即支付
|
||||
</u-button>
|
||||
</view>
|
||||
</u-form>
|
||||
</view>
|
||||
</view>
|
||||
<AddressSelect ref="AddressSelect" @confirm="regionConfirm"/>
|
||||
<AddressSelect ref="ReceiveAddress" @confirm="regionReceiveConfirm"/>
|
||||
<u-picker :show="showPicker" :columns="amountList" keyName="title"
|
||||
@cancel="showPicker = false" @close="showPicker = false" closeOnClickOverlay
|
||||
@confirm="confirm"></u-picker>
|
||||
<u-popup closeable :show="show"
|
||||
round="10"
|
||||
mode="center"
|
||||
:custom-style="{width: '80%'}"
|
||||
@close="show = false">
|
||||
<view style="height: 60vh; overflow-y: scroll" class="p-25">
|
||||
<u-parse :content="agreement"></u-parse>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uititle from "@/components/common/title.vue";
|
||||
import AddressSelect from "@/components/AddressSelect.vue";
|
||||
|
||||
export default {
|
||||
name: "companyQuote",
|
||||
components: {AddressSelect, uititle},
|
||||
data() {
|
||||
return {
|
||||
form: {},
|
||||
configList: [],
|
||||
checkList: [],
|
||||
contentList: [],
|
||||
addressIndex: [[null, null, null]],
|
||||
addressDetail: '',
|
||||
receiveAddressIndex: [null, null, null],
|
||||
receiveAddressDetail: '',
|
||||
clickedCompanyIndex: null,
|
||||
companyList: [
|
||||
{
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
address: '',
|
||||
region: '',
|
||||
}
|
||||
],
|
||||
email: '',
|
||||
wechat: '',
|
||||
receiveAddressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
receiveAddress: '',
|
||||
requestName: '',
|
||||
contactName: '',
|
||||
contact: '',
|
||||
agreement: '',
|
||||
agree: false,
|
||||
showPicker: false,
|
||||
amountList: [],
|
||||
selectedAmountList: [],
|
||||
clickedContentIndex: 0,
|
||||
region: '',
|
||||
show: false
|
||||
}
|
||||
},
|
||||
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.contentIndex = null
|
||||
item.amountIndex = null
|
||||
return item
|
||||
})
|
||||
}
|
||||
},
|
||||
changeCheck(itemIndex, checked) {
|
||||
this.configList.forEach((item, index) => {
|
||||
if (index !== itemIndex || !checked) {
|
||||
item.contentIndex = null
|
||||
item.amountIndex = null
|
||||
}
|
||||
})
|
||||
this.contentList = checked ? [itemIndex] : []
|
||||
this.selectedAmountList = []
|
||||
},
|
||||
addCompany() {
|
||||
this.companyList.push({
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
region: ''
|
||||
})
|
||||
},
|
||||
removeCompany(index) {
|
||||
if (this.companyList.length === 1) return
|
||||
this.companyList.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.email && !this.wechat && !this.receiveAddressRegion.province) return this.$message({
|
||||
message: '请选择接收文件地址/微信/邮箱',
|
||||
type: 'error'
|
||||
})
|
||||
for (let i = 0; i < this.companyList.length; i++) {
|
||||
if (!this.companyList[i].name) return this.$message({
|
||||
message: '请填写考察公司/个人名称',
|
||||
type: 'error'
|
||||
})
|
||||
if (!this.companyList[i].code) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写考察公司/个人统一信用代码',
|
||||
})
|
||||
if (!this.companyList[i].address) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写公司/个人地址',
|
||||
})
|
||||
if (!this.companyList[i].addressRegion.province) 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: '请填写联系人电话',
|
||||
})
|
||||
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/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
|
||||
},
|
||||
confirm({indexs}) {
|
||||
this.selectedAmountList = indexs
|
||||
this.showPicker = false
|
||||
this.configList[this.clickedContentIndex].contentIndex = indexs[0]
|
||||
this.configList[this.clickedContentIndex].amountIndex = indexs[1]
|
||||
},
|
||||
selectContent(index) {
|
||||
if (!this.contentList.includes(index)) return this.$message.error('请先勾选服务')
|
||||
this.clickedContentIndex = index
|
||||
this.amountList = [this.configList[index].contents, this.configList[index].contents[0].amountList]
|
||||
this.showPicker = true
|
||||
},
|
||||
getServiceLabel(item) {
|
||||
if (item.contentIndex === null || item.amountIndex === null) {
|
||||
return '点击选择'
|
||||
}
|
||||
const content = item.contents[item.contentIndex]
|
||||
const amount = content.amountList[item.amountIndex]
|
||||
return `${content.title},${amount.title}`
|
||||
},
|
||||
showAddress(index) {
|
||||
this.clickedCompanyIndex = index
|
||||
this.$refs.AddressSelect.open(this.companyList[index].addressRegion);
|
||||
},
|
||||
regionConfirm({province, city, area}) {
|
||||
this.companyList[this.clickedCompanyIndex].addressRegion = {province, city, area}
|
||||
this.companyList[this.clickedCompanyIndex].region = `${province.name} ${city.name} ${area.name}`
|
||||
},
|
||||
showReceiveAddress() {
|
||||
this.$refs.ReceiveAddress.open(this.receiveAddress);
|
||||
},
|
||||
regionReceiveConfirm({province, city, area}) {
|
||||
this.receiveAddressRegion = {province, city, area}
|
||||
this.region = `${province.name} ${city.name} ${area.name}`
|
||||
},
|
||||
},
|
||||
onLoad() {
|
||||
const userInfo = vk.getStorageSync('uni_id_user_info')
|
||||
// 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
|
||||
} else {
|
||||
this.requestName = userInfo.person.personName
|
||||
this.contactName = userInfo.person.personName
|
||||
this.contact = userInfo.person.personName
|
||||
this.email = userInfo.person.mobile
|
||||
}
|
||||
this.getAgreement()
|
||||
this.getConfigList()
|
||||
},
|
||||
computed: {
|
||||
amount() {
|
||||
let tmpAmount = 0
|
||||
this.configList.forEach((item, index) => {
|
||||
if (this.contentList.includes(index)) {
|
||||
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 {
|
||||
align-items: center;
|
||||
margin-top: 15rpx;
|
||||
display: inline-block;
|
||||
word-break: break-all;
|
||||
white-space: normal;
|
||||
width: 600rpx !important;
|
||||
}
|
||||
|
||||
.remark {
|
||||
color: #999999;
|
||||
font-weight: normal;
|
||||
display: inline-block;
|
||||
width: 600rpx !important;
|
||||
word-break: break-all;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.divider-title {
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,451 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-sticky offset-top="0" customNavHeight="0">
|
||||
<!-- 顶部 -->
|
||||
<uititle title="造价询价服务"></uititle>
|
||||
</u-sticky>
|
||||
<view class="p-30">
|
||||
<view v-for="(item, index) in configList" :key="index"
|
||||
class="server-item my-20" :class="{'text-main': contentList.includes(index)}">
|
||||
<u-checkbox-group>
|
||||
<u-checkbox @change="changeCheck(index, item.name)">
|
||||
</u-checkbox>
|
||||
<view class="flex flex-col justify-start items-start ml-15">
|
||||
<view class="flex flex-col justify-start items-start text-30 mb-20">
|
||||
<view class="font-bold">{{ item.name }}</view>
|
||||
<view class="mt-15">
|
||||
<text>业务编号:</text>
|
||||
<text v-if="item.contentIndex !== null">{{
|
||||
item.contents[item.contentIndex].code
|
||||
}}
|
||||
</text>
|
||||
</view>
|
||||
<view class="server-item-content">
|
||||
<text class="mr-15">服务服务项目:</text>
|
||||
<u-icon v-if="configList[index].contentIndex === null"
|
||||
label="点击选择"
|
||||
name="arrow-down" label-pos="left" @click="selectContent(index)"/>
|
||||
<view class="flex flex-col justify-start items-start text-25" v-else>
|
||||
<text class="my-10">{{ item.contents[item.contentIndex].title }}</text>
|
||||
<text>{{ item.contents[item.contentIndex].amountList[item.amountIndex].title }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<text class="remark text-25">备注: {{ item.remark }}</text>
|
||||
</view>
|
||||
</u-checkbox-group>
|
||||
</view>
|
||||
|
||||
<view class="card">
|
||||
<u-form ref="form" :model="form" label-width="140rpx">
|
||||
<view v-for="(item, companyIndex) in productList" :key="companyIndex">
|
||||
<u-form-item label="产品明细" required>
|
||||
<u-upload
|
||||
accept="file"
|
||||
:fileList="files"
|
||||
@afterRead="afterRead($event, companyIndex)"
|
||||
@delete="deletePic($event)"
|
||||
name="1"
|
||||
multiple
|
||||
:maxCount="10"
|
||||
></u-upload>
|
||||
</u-form-item>
|
||||
<u-form-item label="产品应用地址" required @click.native="showAddress(companyIndex)">
|
||||
<u-input v-model="productList[companyIndex].region" readonly placeholder="点击选择区域"
|
||||
style="pointer-events:none"/>
|
||||
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||
</u-form-item>
|
||||
<u-form-item label="产品应用详细地址:" required>
|
||||
<u-input v-model="productList[companyIndex].address" placeholder="请输入详细地址"/>
|
||||
</u-form-item>
|
||||
</view>
|
||||
<u-divider/>
|
||||
<u-form-item label="接收文件电子邮箱:" required>
|
||||
<u-input v-model="email"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="接收文件微信:" required>
|
||||
<u-input v-model="wechat"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="接收文件寄件地址" required @click.native="showReceiveAddress">
|
||||
<u-input v-model="region" readonly placeholder="点击选择区域" style="pointer-events:none"/>
|
||||
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||
</u-form-item>
|
||||
<u-form-item label="详细地址:" required>
|
||||
<u-input v-model="receiveAddress" placeholder="请输入详细地址"/>
|
||||
</u-form-item>
|
||||
<p class="text-main text-25 text-center" style="margin-bottom: 80rpx">接收文件电子邮箱/ 接收文件微信/
|
||||
接收文件寄件地址,以上三项选填一项即可</p>
|
||||
<u-form-item label="申请人:" required>
|
||||
<u-input v-model="requestName"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="业务联系人:" required>
|
||||
<u-input v-model="contactName"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="业务咨询联系方式:" required>
|
||||
<u-input v-model="contact"/>
|
||||
</u-form-item>
|
||||
<view class="mt-40 flex justify-center items-center text-25">
|
||||
<view class="ml-35">客服联系方式: 400-686-5559</view>
|
||||
</view>
|
||||
<view class="flex justify-start items-center text-25 mt-40">
|
||||
<el-checkbox v-model="agree">我已阅读并同意</el-checkbox>
|
||||
<span class="text-main font-bold" @click="show = true">《金久信自营交易协议》</span>
|
||||
</view>
|
||||
<view class="mt-40 flex justify-center items-center text-25">
|
||||
<u-button type="primary" @click="newOrder"
|
||||
:disabled="!productList[0].files.length === 0 || !agree">
|
||||
立即提交
|
||||
</u-button>
|
||||
</view>
|
||||
</u-form>
|
||||
</view>
|
||||
</view>
|
||||
<AddressSelect ref="AddressSelect" @confirm="regionConfirm"/>
|
||||
<AddressSelect ref="ReceiveAddress" @confirm="regionReceiveConfirm"/>
|
||||
<!-- <u-picker :show="showPicker" :columns="amountList" keyName="title"-->
|
||||
<!-- @cancel="showPicker = false" @close="showPicker = false" closeOnClickOverlay-->
|
||||
<!-- @confirm="confirm"></u-picker>-->
|
||||
<u-popup closeable :show="showPicker"
|
||||
round="10"
|
||||
mode="center"
|
||||
:custom-style="{width: '80%'}"
|
||||
@close="showPicker = false">
|
||||
<view style="height: 60vh; overflow-y: scroll">
|
||||
<view class="flex flex-col p-20 border-bottom" v-for="(item, index) in amountList[0]" :key="index">
|
||||
<text class="font-bold text-30">{{ item.title }}</text>
|
||||
<view class="border rounded p-20 my-15" @click="confirm({indexs: [index, amountIndex]})"
|
||||
v-for="(amount, amountIndex) in item.amountList" :key="amountIndex">
|
||||
{{ amount.title }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
<u-popup closeable :show="show"
|
||||
round="10"
|
||||
mode="center"
|
||||
:custom-style="{width: '80%'}"
|
||||
@close="show = false">
|
||||
<view style="height: 60vh; overflow-y: scroll" class="p-25">
|
||||
<u-parse :content="agreement"></u-parse>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uititle from "@/components/common/title.vue";
|
||||
import AddressSelect from "@/components/AddressSelect.vue";
|
||||
import dayjs from "dayjs";
|
||||
|
||||
export default {
|
||||
name: "companyQuote",
|
||||
components: {AddressSelect, uititle},
|
||||
data() {
|
||||
return {
|
||||
form: {},
|
||||
configList: [],
|
||||
checkList: [],
|
||||
contentList: [],
|
||||
addressIndex: [[null, null, null]],
|
||||
addressDetail: '',
|
||||
receiveAddressIndex: [null, null, null],
|
||||
receiveAddressDetail: '',
|
||||
clickedCompanyIndex: null,
|
||||
productList: [
|
||||
{
|
||||
files: [],
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
address: '',
|
||||
region: '',
|
||||
}
|
||||
],
|
||||
email: '',
|
||||
wechat: '',
|
||||
receiveAddressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
receiveAddress: '',
|
||||
requestName: '',
|
||||
contactName: '',
|
||||
contact: '',
|
||||
agreement: '',
|
||||
agree: false,
|
||||
showPicker: false,
|
||||
amountList: [],
|
||||
selectedAmountList: [],
|
||||
contentNameList: [],
|
||||
clickedContentIndex: 0,
|
||||
region: '',
|
||||
files: [],
|
||||
show: false
|
||||
}
|
||||
},
|
||||
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
|
||||
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.productList.push({
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
region: ''
|
||||
})
|
||||
},
|
||||
removeCompany(index) {
|
||||
if (this.productList.length === 1) return
|
||||
this.productList.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(amount._index)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
if (amountList.length === 0) return this.$message({
|
||||
message: '请至少选择一项服务',
|
||||
type: 'error'
|
||||
})
|
||||
if (!this.email && !this.wechat && !this.receiveAddressRegion.province) return this.$message({
|
||||
message: '请选择接收文件地址/微信/邮箱',
|
||||
type: 'error'
|
||||
})
|
||||
for (let i = 0; i < this.productList.length; i++) {
|
||||
if (this.productList[i].files.length === 0) return this.$message({
|
||||
message: '请上传产品明细',
|
||||
type: 'error'
|
||||
})
|
||||
if (!this.productList[i].address) return this.$message({
|
||||
type: 'error',
|
||||
message: '请填写产品取样地址',
|
||||
})
|
||||
if (!this.productList[i].addressRegion.province) 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: '请填写联系人电话',
|
||||
})
|
||||
const {data} = await vk.callFunction({
|
||||
url: 'client/selfSupport/kh/addOrder',
|
||||
title: '提交中...',
|
||||
data: {
|
||||
type: 2,
|
||||
amountList,
|
||||
contentList: this.productList,
|
||||
receiveAddressRegion: this.receiveAddressRegion,
|
||||
email: this.email,
|
||||
wechat: this.wechat,
|
||||
receiveAddress: this.receiveAddress,
|
||||
requestName: this.requestName,
|
||||
contactName: this.contactName,
|
||||
contact: this.contact,
|
||||
}
|
||||
})
|
||||
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
|
||||
},
|
||||
confirm({indexs}) {
|
||||
this.configList[this.clickedContentIndex].contentIndex = indexs[0]
|
||||
this.configList[this.clickedContentIndex].amountIndex = indexs[1]
|
||||
this.showPicker = false
|
||||
},
|
||||
selectContent(index) {
|
||||
this.clickedContentIndex = index
|
||||
let content = this.configList[index].contents[0].amountList
|
||||
if (content.length > 7) content = content.slice(0, 7) + "\n" + content.slice(7)
|
||||
this.amountList = [this.configList[index].contents, content]
|
||||
this.showPicker = true
|
||||
},
|
||||
showAddress(index) {
|
||||
this.clickedCompanyIndex = index
|
||||
this.$refs.AddressSelect.open(this.productList[index].addressRegion);
|
||||
},
|
||||
regionConfirm({province, city, area}) {
|
||||
this.productList[this.clickedCompanyIndex].addressRegion = {province, city, area}
|
||||
this.productList[this.clickedCompanyIndex].region = `${province.name} ${city.name} ${area.name}`
|
||||
},
|
||||
showReceiveAddress() {
|
||||
this.$refs.ReceiveAddress.open(this.receiveAddress);
|
||||
},
|
||||
regionReceiveConfirm({province, city, area}) {
|
||||
this.receiveAddressRegion = {province, city, area}
|
||||
this.region = `${province.name} ${city.name} ${area.name}`
|
||||
},
|
||||
afterRead({file}, index) {
|
||||
for (let i = 0; i < file.length; i++) {
|
||||
const item = file[i]
|
||||
uniCloud.uploadFile({
|
||||
filePath: item.url,
|
||||
cloudPath: dayjs().format('YYYY/MM/DD') + '/' + item.name,
|
||||
success: ({fileID}) => {
|
||||
uniCloud.getTempFileURL({
|
||||
fileList: [fileID]
|
||||
}).then(res => {
|
||||
this.files.push({url: res.fileList[0].tempFileURL})
|
||||
this.productList[index].files.push(res.fileList[0].tempFileURL)
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
deletePic({index}) {
|
||||
console.log(index)
|
||||
this.files.splice(index, 1)
|
||||
this.productList[0].files.splice(index, 1)
|
||||
},
|
||||
},
|
||||
onLoad() {
|
||||
const userInfo = vk.getStorageSync('uni_id_user_info')
|
||||
// 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
|
||||
} else {
|
||||
this.requestName = userInfo.person.personName
|
||||
this.contactName = userInfo.person.personName
|
||||
this.contact = userInfo.person.personName
|
||||
this.email = userInfo.person.mobile
|
||||
}
|
||||
this.getAgreement()
|
||||
this.getConfigList()
|
||||
},
|
||||
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.productList.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 {
|
||||
align-items: center;
|
||||
margin-top: 15rpx;
|
||||
display: inline-block;
|
||||
word-break: break-all;
|
||||
white-space: normal;
|
||||
width: 600rpx !important;
|
||||
}
|
||||
|
||||
.remark {
|
||||
color: #999999;
|
||||
font-weight: normal;
|
||||
display: inline-block;
|
||||
width: 600rpx !important;
|
||||
word-break: break-all;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.divider-title {
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,49 @@
|
||||
<template>
|
||||
<view class="wrap">
|
||||
<!-- 吸顶 -->
|
||||
<u-sticky offset-top="0" customNavHeight="0">
|
||||
<!-- 顶部 -->
|
||||
<uititle title="我的询价"></uititle>
|
||||
</u-sticky>
|
||||
<view class="p-30">
|
||||
<view v-for="(item, index) in list" :key="index" class="card mb-20 text-25">
|
||||
<view class="mb-15">联系人：{{ item.name }}</view>
|
||||
<view class="mb-15">询价区域：{{ item.province.name }}{{ item.city.name }}</view>
|
||||
<view class="mb-15">联系方式：{{ item.phone }}</view>
|
||||
<view class="mb-15">企业名称：{{ item.company }}</view>
|
||||
<view class="mb-15">询价日期：{{ item._add_time_str }}</view>
|
||||
<template v-if="item.files">
|
||||
<view class="mb-15">附件列表</view>
|
||||
<file-type v-for="(item0, index0) in item.files" :key="index0" :item="item0"/>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uititle from "@/components/common/title.vue";
|
||||
import FileType from "@/components/file-type/file-type.vue";
|
||||
|
||||
export default {
|
||||
name: "list",
|
||||
components: {FileType, uititle},
|
||||
data() {
|
||||
return {
|
||||
list: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getList() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/selfSupport/kh/getList',
|
||||
})
|
||||
this.list = rows
|
||||
this.showList = true
|
||||
},
|
||||
},
|
||||
onLoad() {
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,179 @@
|
||||
<template>
|
||||
<view class="wrap">
|
||||
<!-- 吸顶 -->
|
||||
<u-sticky offset-top="0" customNavHeight="0">
|
||||
<!-- 顶部 -->
|
||||
<uititle title="金久信自营下询价单"></uititle>
|
||||
</u-sticky>
|
||||
<view class="bg-white p-30">
|
||||
<u-form ref="form" label-width="100px">
|
||||
<u-form-item label="联系人" required @click.native="showPicker = true">
|
||||
<!-- <u-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>-->
|
||||
<!-- </u-select>-->
|
||||
<u-input v-model="name" placeholder="点击选择联系人" style="pointer-events:none" readonly/>
|
||||
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||
</u-form-item>
|
||||
<u-form-item label="联系方式" required>
|
||||
<u-input v-model="phone" placeholder="请输入联系方式" disabled/>
|
||||
</u-form-item>
|
||||
<u-form-item label="用户名称" required>
|
||||
<u-input v-model="company" placeholder="请输入您的用户名称"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="询价单附件" required>
|
||||
<u-upload
|
||||
accept="file"
|
||||
:fileList="files"
|
||||
@afterRead="afterRead"
|
||||
@delete="deletePic"
|
||||
multiple
|
||||
:maxCount="10"
|
||||
width="70"
|
||||
height="70"
|
||||
></u-upload>
|
||||
<!-- <vk-data-upload v-model="files" accept="*" list-type="text">-->
|
||||
<!-- </vk-data-upload>-->
|
||||
</u-form-item>
|
||||
<template v-if="files && files.length">
|
||||
<view v-for="(item, index) in files" :key="index" class="mr-10 mb-10 text-main text-25"
|
||||
@click="previewFile(item)">在线查看文件{{ index + 1 }}
|
||||
</view>
|
||||
</template>
|
||||
<!-- <p class="text-red text-25 mt-10">平台目前仅支持PDF文档上传，请你谅解！</p>-->
|
||||
</u-form>
|
||||
<view class="mt-20 flex justify-center items-center">
|
||||
<view>
|
||||
<u-button size="small" color="#A92924" text="取消" plain
|
||||
@click="back"></u-button>
|
||||
</view>
|
||||
<view class="ml-20">
|
||||
<u-button size="small" color="#A92924" text="提交"
|
||||
@click="addFiles"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-picker :show="showPicker" :columns="[contactList]" keyName="name"
|
||||
@cancel="showPicker = false" @close="showPicker = false" closeOnClickOverlay
|
||||
@confirm="confirmContact"></u-picker>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uiheader from "@/components/index/header.vue";
|
||||
import uititle from "@/components/common/title.vue";
|
||||
import dayjs from "dayjs";
|
||||
import md5 from "js-md5";
|
||||
|
||||
export default {
|
||||
name: "make",
|
||||
components: {uititle, uiheader},
|
||||
data() {
|
||||
return {
|
||||
files: [],
|
||||
name: null,
|
||||
phone: null,
|
||||
company: null,
|
||||
contactList: [],
|
||||
showPicker: false,
|
||||
province: null,
|
||||
city: null,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
navToContact() {
|
||||
uni.setStorageSync('user_tab', 8)
|
||||
uni.switchTab({
|
||||
url: '/pages/user/user?tab=8'
|
||||
})
|
||||
},
|
||||
async getContactList() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/businessContact/kh/getList',
|
||||
})
|
||||
this.contactList = rows
|
||||
},
|
||||
confirmContact({value}) {
|
||||
this.name = value[0].name
|
||||
this.phone = value[0].phone
|
||||
this.showPicker = false
|
||||
},
|
||||
afterRead({file}) {
|
||||
for (let i = 0; i < file.length; i++) {
|
||||
const item = file[i]
|
||||
// if (item.type !== 'application/pdf') {
|
||||
// uni.showToast({
|
||||
// title: '请上传PDF文件',
|
||||
// icon: 'none'
|
||||
// })
|
||||
// return
|
||||
// }
|
||||
const suffix = item.name.split('.').pop()
|
||||
uniCloud.uploadFile({
|
||||
filePath: item.url,
|
||||
cloudPath: dayjs().format('YYYY/MM/DD') + '/' + md5(item.name + Date.now().toString()) + `.${suffix}`,
|
||||
success: ({fileID}) => {
|
||||
uniCloud.getTempFileURL({
|
||||
fileList: [fileID]
|
||||
}).then(res => {
|
||||
this.files.push({
|
||||
url: res.fileList[0].tempFileURL,
|
||||
name: item.name
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
deletePic({index}) {
|
||||
this.files.splice(index, 1)
|
||||
},
|
||||
back() {
|
||||
uni.navigateBack()
|
||||
},
|
||||
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: '请上传询价单附件'})
|
||||
await vk.callFunction({
|
||||
url: 'client/selfSupport/kh/add',
|
||||
data: {
|
||||
files: this.files.map(item => item.url),
|
||||
city: this.city,
|
||||
province: this.province,
|
||||
name: this.name,
|
||||
phone: this.phone,
|
||||
company: this.company,
|
||||
}
|
||||
})
|
||||
this.$message({
|
||||
message: '下单成功',
|
||||
type: 'success'
|
||||
})
|
||||
uni.navigateBack()
|
||||
},
|
||||
previewFile(item) {
|
||||
window.location.href = item.url
|
||||
}
|
||||
},
|
||||
onLoad({province, city}) {
|
||||
this.province = JSON.parse(province)
|
||||
this.city = JSON.parse(city)
|
||||
this.getContactList()
|
||||
const user = uni.getStorageSync('uni_id_user_info')
|
||||
this.company = user.accountType === 2 ? user.company.companyName : user.person.personName
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,288 @@
|
||||
<template>
|
||||
<view class="wrap">
|
||||
<!-- 吸顶 -->
|
||||
<u-sticky offset-top="0" customNavHeight="0">
|
||||
<!-- 顶部 -->
|
||||
<uititle title="报价单"></uititle>
|
||||
</u-sticky>
|
||||
<quote-remain-num v-if="reloaded"/>
|
||||
<view class="layout layout-title m-top-20">填写报价信息</view>
|
||||
<view class="layout layout-publish m-top-20 bg-white">
|
||||
<view class="card-title m-top-30">询价文件</view>
|
||||
<view class="flex justify-start items-start flex-wrap">
|
||||
<file-type v-for="(item, index) in sheet.files" :key="index" :item="item"/>
|
||||
</view>
|
||||
<view class="card-title m-top-30">报价信息</view>
|
||||
<view class="group flex align-center m-top-30">
|
||||
<view class="lb need m-right-20 w-25p">货款总价:</view>
|
||||
<view class="vl flex-1">
|
||||
<u--input
|
||||
@blur="formatter"
|
||||
placeholder="请输入货款总价"
|
||||
border="surround"
|
||||
v-model="formData.amount"
|
||||
suffixIcon="元"
|
||||
suffixIconStyle="font-size: 24rpx;color: #909399"
|
||||
></u--input>
|
||||
</view>
|
||||
</view>
|
||||
<view class="group flex items-start m-top-30">
|
||||
<view class="lb m-right-20 w-25p mt-20">报价单详情:</view>
|
||||
<view class="vl flex-1">
|
||||
<u-textarea
|
||||
placeholder="请输入报价单详情"
|
||||
border="surround"
|
||||
v-model="formData.remark"
|
||||
suffixIconStyle="font-size: 24rpx;color: #909399"
|
||||
></u-textarea>
|
||||
</view>
|
||||
</view>
|
||||
<view class="card-title m-top-30">附件信息</view>
|
||||
<view class="group m-top-20">
|
||||
<!-- <view class="lb m-right-20">附件内容:</view>-->
|
||||
<!-- <view class="flex justify-between align-center m-top-20">-->
|
||||
<!-- <view class="lbx flex-1">上传自有报价单图片或文档，支持jpg/png/word/excel。</view>-->
|
||||
<!-- <view class="download">报价单样板下载</view>-->
|
||||
<!-- </view>-->
|
||||
<view class="m-top-30">
|
||||
<u-upload
|
||||
:fileList="formData.files"
|
||||
@afterRead="afterRead"
|
||||
@delete="deletePic"
|
||||
accept="file"
|
||||
:maxCount="10"
|
||||
multiple
|
||||
:previewImage="false"
|
||||
>
|
||||
<view class="w-100p">
|
||||
<view>
|
||||
<u-button size="mini" type="primary">点击上传</u-button>
|
||||
</view>
|
||||
<view class="mt-10 flex justify-between items-center w-100p" @click="delFiles(index)"
|
||||
v-for="(item, index) in fileNameList" :key="index">
|
||||
<text>{{ item }}</text>
|
||||
<u-icon name="trash"/>
|
||||
</view>
|
||||
</view>
|
||||
</u-upload>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-button class="public-btn m-top-30" text="提交报价" @click="submit"></u-button>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uititle from '@/components/common/title'
|
||||
import dayjs from "dayjs";
|
||||
import QuoteRemainNum from "@/components/quote-remain-num/quote-remain-num.vue";
|
||||
import md5 from "js-md5";
|
||||
import FileType from "@/components/file-type/file-type.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
FileType,
|
||||
QuoteRemainNum,
|
||||
uititle,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
enquiryId: null,
|
||||
sheet: null,
|
||||
formData: {
|
||||
amount: '',
|
||||
files: [],
|
||||
remark: '',
|
||||
supplierExt: '',
|
||||
},
|
||||
reloaded: false,
|
||||
fileNameList: []
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handTag(val) {
|
||||
val.checked = !val.checked
|
||||
},
|
||||
afterRead({file}) {
|
||||
for (let i = 0; i < file.length; i++) {
|
||||
const item = file[i]
|
||||
if (item.type !== 'application/pdf') {
|
||||
uni.showToast({
|
||||
title: '请上传PDF文件',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
uniCloud.uploadFile({
|
||||
filePath: item.url,
|
||||
cloudPath: dayjs().format('YYYY/MM/DD') + '/' + md5(item.name + Date.now().toString()) + '.pdf',
|
||||
success: ({fileID}) => {
|
||||
uniCloud.getTempFileURL({
|
||||
fileList: [fileID]
|
||||
}).then(res => {
|
||||
this.formData.files.push(res.fileList[0].tempFileURL)
|
||||
this.fileNameList.push(item.name)
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
deletePic({index}) {
|
||||
this.formData.files.splice(index, 1)
|
||||
},
|
||||
async submit() {
|
||||
if (!this.formData.totalPrice) return this.$message.error('请填写金额')
|
||||
// if (this.formData.files.length > 0) this.formData.files = this.formData.files.map(item => item.url)
|
||||
vk.callFunction({
|
||||
url: 'client/selfSupport/kh/addQuote',
|
||||
title: '请求中...',
|
||||
data: {
|
||||
sheetId: this.enquiryId,
|
||||
...this.formData
|
||||
},
|
||||
success: (data) => {
|
||||
this.$message({
|
||||
message: "报价成功",
|
||||
type: 'success'
|
||||
})
|
||||
uni.navigateBack()
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 获取询价单详情
|
||||
*/
|
||||
getEnquiryDetail() {
|
||||
vk.callFunction({
|
||||
url: 'client/selfSupport/kh/getDetail',
|
||||
title: '请求中...',
|
||||
data: {
|
||||
_id: this.enquiryId
|
||||
},
|
||||
success: (res) => {
|
||||
this.sheet = res
|
||||
}
|
||||
});
|
||||
},
|
||||
delFiles(index){
|
||||
this.formData.files.splice(index, 1)
|
||||
this.fileNameList.splice(index, 1)
|
||||
},
|
||||
formatter(val){
|
||||
this.formData.totalPrice = parseFloat(val).toFixed(2)
|
||||
},
|
||||
},
|
||||
onLoad({id}) {
|
||||
this.enquiryId = id
|
||||
this.getEnquiryDetail()
|
||||
},
|
||||
onShow() {
|
||||
this.reloaded = false
|
||||
setTimeout(() => {
|
||||
this.reloaded = true
|
||||
}, 500)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.layout-title {
|
||||
padding: 20rpx 30rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
color: #A92924;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
position: relative;
|
||||
padding-left: 20rpx;
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
line-height: 48rpx;
|
||||
color: #A92924;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
z-index: 9;
|
||||
margin-top: -14rpx;
|
||||
content: '';
|
||||
width: 4rpx;
|
||||
height: 28rpx;
|
||||
background: #A92924;
|
||||
}
|
||||
}
|
||||
|
||||
.public-btn {
|
||||
width: 80%;
|
||||
margin-top: 60rpx;
|
||||
color: #ffffff;
|
||||
background: #A92924;
|
||||
}
|
||||
|
||||
.layout-publish {
|
||||
margin: 20rpx 30rpx;
|
||||
padding: 50rpx 30rpx;
|
||||
border-radius: 18rpx;
|
||||
}
|
||||
|
||||
.tag-title {
|
||||
font-size: 26rpx;
|
||||
line-height: 40rpx;
|
||||
color: #000000;
|
||||
|
||||
.limit {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.tag-box {
|
||||
padding: 20rpx 0;
|
||||
|
||||
.item {
|
||||
padding: 6rpx 10rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 32rpx;
|
||||
color: #555555;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #A92924;
|
||||
}
|
||||
}
|
||||
|
||||
.lb, .fix {
|
||||
position: relative;
|
||||
font-size: 26rpx;
|
||||
line-height: 40rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.lbx {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.download {
|
||||
padding: 8rpx 20rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 36rpx;
|
||||
color: #A92924;
|
||||
border: 1px solid #A92924;
|
||||
}
|
||||
|
||||
.need::before {
|
||||
position: absolute;
|
||||
left: -16rpx;
|
||||
top: 50%;
|
||||
z-index: 9;
|
||||
margin-top: -12rpx;
|
||||
content: '*';
|
||||
color: #A92924;
|
||||
font-size: 32rpx;
|
||||
line-height: 1;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,530 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-sticky offset-top="0" customNavHeight="0">
|
||||
<!-- 顶部 -->
|
||||
<uititle title="检测产品"></uititle>
|
||||
</u-sticky>
|
||||
<view class="p-30">
|
||||
<view class="flex justify-end items-center text-main pointer my-20 " @click="demoDownload">示例下载</view>
|
||||
<view v-for="(item, index) in configList" :key="index"
|
||||
class="server-item my-20" :class="{'text-main': contentList.includes(index)}">
|
||||
<u-checkbox-group>
|
||||
<u-checkbox @change="changeCheck(index, item.name)">
|
||||
</u-checkbox>
|
||||
<view class="flex flex-col justify-start items-start ml-15">
|
||||
<view class="flex flex-col justify-start items-start text-30 mb-20">
|
||||
<view class="font-bold">{{ item.name }}</view>
|
||||
<view class="mt-15">
|
||||
<text>业务编号:</text>
|
||||
<text v-if="item.contentIndex !== null">{{
|
||||
item.contents[item.contentIndex].code
|
||||
}}
|
||||
</text>
|
||||
</view>
|
||||
<view class="server-item-content">
|
||||
<text class="mr-15">服务服务项目:</text>
|
||||
<u-icon v-if="configList[index].contentIndex === null"
|
||||
label="点击选择"
|
||||
name="arrow-down" label-pos="left" @click="selectContent(index)"/>
|
||||
<view class="flex flex-col justify-start items-start text-25" v-else>
|
||||
<text class="my-10">{{ item.contents[item.contentIndex].title }}</text>
|
||||
<text>{{ item.contents[item.contentIndex].amountList[item.amountIndex].title }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<text class="mt-15">金额:</text>
|
||||
<view class="mt-15" v-if="configList[index].contentIndex !== null">
|
||||
{{
|
||||
item.contents[item.contentIndex].amountList[item.amountIndex].amount
|
||||
}}元/次
|
||||
</view>
|
||||
<view class="mt-15" v-else>
|
||||
元/次
|
||||
</view>
|
||||
</view>
|
||||
<text class="remark text-25 my-15">备注: {{ item.remark }}</text>
|
||||
<u-button type="primary" size="small"
|
||||
@click="addToAmountList(index, configList[index].contentIndex, item.amountIndex)"
|
||||
:disabled="item.amountIndex === null">
|
||||
添加
|
||||
</u-button>
|
||||
</view>
|
||||
</u-checkbox-group>
|
||||
</view>
|
||||
|
||||
<view class="card">
|
||||
<u-form ref="form" :model="form" label-width="180rpx">
|
||||
<view v-for="(item, companyIndex) in productList" :key="companyIndex">
|
||||
<u-form-item label="检测产品" required>
|
||||
<u-input v-model="productList[companyIndex].name"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="检测内容" required>
|
||||
{{ contentNameList.join() }}
|
||||
</u-form-item>
|
||||
<u-form-item label="取样所在地" required @click.native="showAddress(companyIndex)">
|
||||
<u-input v-model="productList[companyIndex].region" readonly placeholder="点击选择区域"
|
||||
style="pointer-events:none"/>
|
||||
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||
</u-form-item>
|
||||
<u-form-item label="取样详细地址:" required>
|
||||
<u-input v-model="productList[companyIndex].address" placeholder="请输入详细地址"/>
|
||||
</u-form-item>
|
||||
<view class="ml-20">
|
||||
<u-button type="primary" size="mini" plain @click.native="removeCompany(companyIndex)"
|
||||
:disabled="productList.length === 1">删除该对象
|
||||
</u-button>
|
||||
</view>
|
||||
</view>
|
||||
<u-divider/>
|
||||
<u-form-item label="本次服务费用小计:">
|
||||
<view class="flex justify-between items-start mb-20 w-100p">
|
||||
<view class="flex justify-end items-center">
|
||||
<text>￥{{ amount ? amount.toFixed(2) : 0 }}</text>
|
||||
<view class="ml-20">
|
||||
<u-button type="primary" size="mini" @click.native="addCompany">增加考察对象
|
||||
</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-form-item>
|
||||
<u-form-item label="接收文件电子邮箱:" required>
|
||||
<u-input v-model="email"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="接收文件微信:" required>
|
||||
<u-input v-model="wechat"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="接收文件寄件地址" required @click.native="showReceiveAddress">
|
||||
<u-input v-model="region" readonly placeholder="点击选择区域" style="pointer-events:none"/>
|
||||
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||
</u-form-item>
|
||||
<u-form-item label="详细地址:" required>
|
||||
<u-input v-model="receiveAddress" placeholder="请输入详细地址"/>
|
||||
</u-form-item>
|
||||
<p class="text-main text-25 text-center" style="margin-bottom: 80rpx">接收文件电子邮箱/ 接收文件微信/
|
||||
接收文件寄件地址,以上三项选填一项即可</p>
|
||||
<u-form-item label="申请人:" required>
|
||||
<u-input v-model="requestName"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="业务联系人:" required>
|
||||
<u-input v-model="contactName"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="业务咨询联系方式:" required>
|
||||
<u-input v-model="contact"/>
|
||||
</u-form-item>
|
||||
<u-form-item label="备注:">
|
||||
<u-input v-model="remark"/>
|
||||
</u-form-item>
|
||||
<view class="mt-20">
|
||||
<view>已选项目:</view>
|
||||
<view v-for="(item, index) in amountList" :key="index" class="mt-20 flex justify-start items-center">
|
||||
<view>
|
||||
<u-button type="primary" size="small" @click="removeFromAmountList(index)">删除</u-button>
|
||||
</view>
|
||||
<view class="ml-20 text-25" v-if="configList[item.index]">
|
||||
<text>{{ configList[item.index].name }} --</text>
|
||||
<text>{{ configList[item.index].contents[item.contentIndex].title }} --</text>
|
||||
<text>{{
|
||||
configList[item.index].contents[item.contentIndex].amountList[item.amountIndex].title
|
||||
}},{{ configList[item.index].contents[item.contentIndex].amountList[item.amountIndex].amount }}元
|
||||
</text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="mt-40 flex justify-center items-center text-25">
|
||||
<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 text-25 mt-40">
|
||||
<el-checkbox v-model="agree">我已阅读并同意</el-checkbox>
|
||||
<span class="text-main font-bold" @click="show = true">《金久信自营交易协议》</span>
|
||||
</view>
|
||||
<view class="mt-40 flex justify-center items-center text-25">
|
||||
<u-button type="primary" @click="newOrder"
|
||||
:disabled="productList.length === 0 || !productList[0].name || !agree">
|
||||
立即支付
|
||||
</u-button>
|
||||
</view>
|
||||
</u-form>
|
||||
</view>
|
||||
</view>
|
||||
<AddressSelect ref="AddressSelect" @confirm="regionConfirm"/>
|
||||
<AddressSelect ref="ReceiveAddress" @confirm="regionReceiveConfirm"/>
|
||||
<!-- <u-picker :show="showPicker" :columns="amountItemList" keyName="title"-->
|
||||
<!-- @cancel="showPicker = false" @close="showPicker = false" closeOnClickOverlay-->
|
||||
<!-- @confirm="confirm"></u-picker>-->
|
||||
<u-popup closeable :show="showPicker"
|
||||
round="10"
|
||||
mode="center"
|
||||
:custom-style="{width: '80%'}"
|
||||
@close="showPicker = false">
|
||||
<view style="height: 60vh; overflow-y: scroll">
|
||||
<view class="flex flex-col p-20 border-bottom" v-for="(item, index) in amountItemList[0]" :key="index">
|
||||
<text class="font-bold text-30">{{ item.title }}</text>
|
||||
<view class="border rounded p-20 my-15 flex justify-between items-center"
|
||||
:class="[amountList.find(amount => amount.index === index && amount.contentIndex === amountIndex) ? 'amount-active' : '']"
|
||||
@click="confirm({indexs: [index, amountIndex]})"
|
||||
v-for="(amount, amountIndex) in item.amountList" :key="amountIndex">
|
||||
<text>{{ amount.title }}</text>
|
||||
<text class="text-24"
|
||||
v-if="amountList.find(amount => amount.index === index && amount.contentIndex === amountIndex)">已选择
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
<u-popup closeable :show="show"
|
||||
round="10"
|
||||
mode="center"
|
||||
:custom-style="{width: '80%'}"
|
||||
@close="show = false">
|
||||
<view style="height: 60vh; overflow-y: scroll" class="p-25">
|
||||
<u-parse :content="agreement"></u-parse>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uititle from "@/components/common/title.vue";
|
||||
import AddressSelect from "@/components/AddressSelect.vue";
|
||||
|
||||
export default {
|
||||
name: "companyQuote",
|
||||
components: {AddressSelect, uititle},
|
||||
data() {
|
||||
return {
|
||||
form: {},
|
||||
configList: [],
|
||||
checkList: [],
|
||||
contentList: [],
|
||||
addressIndex: [[null, null, null]],
|
||||
addressDetail: '',
|
||||
receiveAddressIndex: [null, null, null],
|
||||
receiveAddressDetail: '',
|
||||
clickedCompanyIndex: null,
|
||||
productList: [
|
||||
{
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
address: '',
|
||||
region: '',
|
||||
}
|
||||
],
|
||||
email: '',
|
||||
wechat: '',
|
||||
receiveAddressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
receiveAddress: '',
|
||||
requestName: '',
|
||||
contactName: '',
|
||||
contact: '',
|
||||
remark: '',
|
||||
agreement: '',
|
||||
agree: false,
|
||||
showPicker: false,
|
||||
amountList: [],
|
||||
amountItemList: [],
|
||||
selectedAmountList: [],
|
||||
contentNameList: [],
|
||||
clickedContentIndex: 0,
|
||||
region: '',
|
||||
show: false,
|
||||
}
|
||||
},
|
||||
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
|
||||
})
|
||||
}
|
||||
},
|
||||
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.productList.push({
|
||||
name: '',
|
||||
code: '',
|
||||
addressRegion: {
|
||||
province: null,
|
||||
city: null,
|
||||
area: null,
|
||||
},
|
||||
region: ''
|
||||
})
|
||||
},
|
||||
removeCompany(index) {
|
||||
if (this.productList.length === 1) return
|
||||
this.productList.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(amount._index)
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
if (this.amountList.length === 0) return this.$message({
|
||||
message: '请至少选择一项服务',
|
||||
type: 'error'
|
||||
})
|
||||
if (!this.email && !this.wechat && !this.receiveAddressRegion.province) return this.$message({
|
||||
message: '请选择接收文件地址/微信/邮箱',
|
||||
type: 'error'
|
||||
})
|
||||
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.productList[i].addressRegion.province) 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: '请填写联系人电话',
|
||||
})
|
||||
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/shop/pay?id=${data}`
|
||||
})
|
||||
},
|
||||
showAgreement() {
|
||||
this.$confirm(`<div style="width: 95vw">${this.agreement}</div>`, '金久信自营交易协议', {
|
||||
cancelButtonText: '关闭',
|
||||
showConfirmButton: false,
|
||||
dangerouslyUseHTMLString: true,
|
||||
})
|
||||
},
|
||||
async getAgreement() {
|
||||
const res = await vk.callFunction({
|
||||
url: 'client/dict/pub/getDetail',
|
||||
data: {
|
||||
id: '65885d4c09664c1c8d8e8476'
|
||||
},
|
||||
})
|
||||
this.agreement = res.content
|
||||
},
|
||||
confirm({indexs}) {
|
||||
if (this.amountList.find(amount => amount.index === indexs[0] && amount.contentIndex === indexs[1])) return
|
||||
uni.showToast({
|
||||
title: '已选择',
|
||||
icon: 'none'
|
||||
})
|
||||
this.configList[this.clickedContentIndex].contentIndex = indexs[0]
|
||||
this.configList[this.clickedContentIndex].amountIndex = indexs[1]
|
||||
this.showPicker = false
|
||||
console.log(this.configList)
|
||||
},
|
||||
selectContent(index) {
|
||||
console.log(this.configList[index].contents)
|
||||
this.clickedContentIndex = index
|
||||
this.amountItemList = [this.configList[index].contents, this.configList[index].contents[0].amountList]
|
||||
this.showPicker = true
|
||||
},
|
||||
showAddress(index) {
|
||||
this.clickedCompanyIndex = index
|
||||
this.$refs.AddressSelect.open(this.productList[index].addressRegion);
|
||||
},
|
||||
regionConfirm({province, city, area}) {
|
||||
this.productList[this.clickedCompanyIndex].addressRegion = {province, city, area}
|
||||
this.productList[this.clickedCompanyIndex].region = `${province.name} ${city.name} ${area.name}`
|
||||
},
|
||||
showReceiveAddress() {
|
||||
this.$refs.ReceiveAddress.open(this.receiveAddress);
|
||||
},
|
||||
regionReceiveConfirm({province, city, area}) {
|
||||
this.receiveAddressRegion = {province, city, area}
|
||||
this.region = `${province.name} ${city.name} ${area.name}`
|
||||
},
|
||||
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)
|
||||
},
|
||||
demoDownload() {
|
||||
vk.callFunction({
|
||||
url: 'client/dict/pub/getDetail',
|
||||
data: {
|
||||
id: '6588648da7c432e4a360bb34'
|
||||
},
|
||||
success: res => {
|
||||
window.location.href = res.content
|
||||
// window.open(res.content)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
const userInfo = vk.getStorageSync('uni_id_user_info')
|
||||
// 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
|
||||
} else {
|
||||
this.requestName = userInfo.person.personName
|
||||
this.contactName = userInfo.person.personName
|
||||
this.contact = userInfo.person.personName
|
||||
this.email = userInfo.person.mobile
|
||||
}
|
||||
this.getAgreement()
|
||||
this.getConfigList()
|
||||
},
|
||||
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>
|
||||
|
||||
<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 {
|
||||
align-items: center;
|
||||
margin-top: 15rpx;
|
||||
display: inline-block;
|
||||
word-break: break-all;
|
||||
white-space: normal;
|
||||
width: 600rpx !important;
|
||||
}
|
||||
|
||||
.remark {
|
||||
color: #999999;
|
||||
font-weight: normal;
|
||||
display: inline-block;
|
||||
width: 600rpx !important;
|
||||
word-break: break-all;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.divider-title {
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.amount-active {
|
||||
background-color: #fdd7d6;
|
||||
border-color: #a92924;
|
||||
color: #a92924
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,302 @@
|
||||
<template>
|
||||
<view class="wrap">
|
||||
<!-- 吸顶 -->
|
||||
<u-sticky offset-top="0" customNavHeight="0">
|
||||
<!-- 顶部 -->
|
||||
<uiheader></uiheader>
|
||||
<!-- 搜索栏 -->
|
||||
<!-- <cmsearch></cmsearch>-->
|
||||
<!-- 轮播图-传值:list="数组" -->
|
||||
<cmswiper page="self-support-index" height="280rpx"></cmswiper>
|
||||
<view class="bar">
|
||||
<text class="active">自营钢城</text>
|
||||
<text class="" @click="$jump('/pages/self/supportIndex')">平台服务</text>
|
||||
<text class="" @click="$jump('/pages/shop/shop')">特产商城</text>
|
||||
</view>
|
||||
<!-- 选择器 -->
|
||||
<view class="layout-select flex justify-start align-center bg-white">
|
||||
<u-icon name="map" color="#A92924" size="18"></u-icon>
|
||||
<text class="text" @click="showAddress">交易区域：</text>
|
||||
<view class="ip all text-center" @click="showAddress">
|
||||
{{ address.province ? `${address.province.name} ${address.city.name}` : '全国' }}
|
||||
</view>
|
||||
<view class="mx-20" @click="showAddress">
|
||||
<u-icon name="arrow-down-fill"/>
|
||||
</view>
|
||||
<u-icon name="reload" v-if="address.province" @click="reload"/>
|
||||
</view>
|
||||
<!-- 统计 -->
|
||||
<view class="layout-total flex justify-between align-center">
|
||||
<view class="total">
|
||||
共
|
||||
<text class="red">{{ companyList.length }}</text>
|
||||
个合作商
|
||||
</view>
|
||||
<view class="flex justify-end items-center">
|
||||
<view class="link" @click="makeOrder">下单询价></view>
|
||||
<view class="link-plain ml-20" @click="$jump('/pages/self/list')">我的询价</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-sticky>
|
||||
|
||||
<!-- 列表数据 -->
|
||||
<view class="layout-self flex justify-between flex-wrap bg-white">
|
||||
<view class="item" v-for="(item, index) in companyList" :key="index" @click="detailLink(item._id)">
|
||||
<view class="company flex justify-center align-center flex-nowrap">
|
||||
<view class="icon">
|
||||
<image class="radius" :src="item.businessCard.logo" mode=""
|
||||
v-if="item.businessCard && item.businessCard.logo"></image>
|
||||
<image class="radius" src="/static/img/no-logo.jpg" mode="" v-else></image>
|
||||
</view>
|
||||
<view class="text flex-1 p-left-20 text-single">{{ item.name }}</view>
|
||||
</view>
|
||||
<view class="main text-single m-top-10">
|
||||
主营：{{ item.mainSpotCategory.join() }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 没有数据 -->
|
||||
<cmempty></cmempty>
|
||||
<AddressSelect ref="AddressSelect" @confirm="regionConfirm"/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uiheader from '@/components/index/header'
|
||||
import cmsearch from '@/components/common/search'
|
||||
import cmempty from '@/components/common/empty'
|
||||
import cmswiper from '@/components/common/swiper'
|
||||
import AddressSelect from "@/components/AddressSelect.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AddressSelect,
|
||||
uiheader,
|
||||
cmsearch,
|
||||
cmempty,
|
||||
cmswiper,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLogin: false,
|
||||
allChildCate: [],
|
||||
companyList: [],
|
||||
address: {
|
||||
province: null,
|
||||
city: null,
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
showAddress() {
|
||||
this.$refs.AddressSelect.open(this.address);
|
||||
},
|
||||
regionConfirm({province, city, area}) {
|
||||
this.address = {province, city, area}
|
||||
this.getCompanyList()
|
||||
},
|
||||
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()
|
||||
}
|
||||
});
|
||||
},
|
||||
async getCompanyList() {
|
||||
const {rows} = await vk.callFunction({
|
||||
url: 'client/user/pub/getCompany',
|
||||
data: {
|
||||
isCoop: 1,
|
||||
province: this.address.province ? [this.address.province.code] : []
|
||||
}
|
||||
})
|
||||
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
|
||||
})
|
||||
},
|
||||
reload() {
|
||||
this.address = {
|
||||
province: null,
|
||||
city: null
|
||||
}
|
||||
this.getCompanyList()
|
||||
},
|
||||
makeOrder() {
|
||||
if (!this.address.province) return this.$message({type: 'error', message: '请选择交易区域'})
|
||||
this.$jump(`/pages/self/make?province=${JSON.stringify(this.address.province)}&city=${JSON.stringify(this.address.city)}`)
|
||||
},
|
||||
detailLink(id) {
|
||||
vk.navigateTo(`/pages/yellow/detail?id=${id}`)
|
||||
},
|
||||
},
|
||||
onLoad() {
|
||||
this.getCategoryTreeData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.layout-select {
|
||||
// width: 690rpx;
|
||||
height: 68rpx;
|
||||
padding: 0 30rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 40rpx;
|
||||
color: #101010;
|
||||
|
||||
.text {
|
||||
color: #A92924;
|
||||
}
|
||||
|
||||
.ip {
|
||||
position: relative;
|
||||
//width: 180rpx;
|
||||
height: 40rpx;
|
||||
padding: 0 10rpx;
|
||||
overflow: hidden;
|
||||
border: 1px solid #f2f2f2;
|
||||
}
|
||||
|
||||
//.all {
|
||||
// width: 70rpx !important;
|
||||
//}
|
||||
.down::after {
|
||||
position: absolute;
|
||||
right: 10rpx;
|
||||
top: 50%;
|
||||
z-index: 9;
|
||||
content: '';
|
||||
margin-top: -6rpx;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 12rpx solid transparent;
|
||||
border-right: 12rpx solid transparent;
|
||||
border-top: 12rpx solid #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.layout-total {
|
||||
height: 60rpx;
|
||||
padding: 10rpx 30rpx;
|
||||
background: #F5F9FA;
|
||||
|
||||
.total {
|
||||
font-size: 24rpx;
|
||||
line-height: 40rpx;
|
||||
color: #101010;
|
||||
}
|
||||
|
||||
.link {
|
||||
padding: 0 12rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 44rpx;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
background: #A92924;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.link-plain {
|
||||
padding: 0 12rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 44rpx;
|
||||
color: #A92924;
|
||||
text-align: center;
|
||||
border-radius: 8rpx;
|
||||
border: 1px solid #A92924;
|
||||
}
|
||||
}
|
||||
|
||||
.layout-self {
|
||||
padding: 20rpx 30rpx;
|
||||
|
||||
.item {
|
||||
position: relative;
|
||||
width: 50%;
|
||||
height: 160rpx;
|
||||
padding: 20rpx 10rpx;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 1px solid #f2f2f2;
|
||||
|
||||
.main {
|
||||
height: 36rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 36rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.company {
|
||||
width: 100%;
|
||||
height: 64rpx;
|
||||
|
||||
.icon {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
|
||||
.text {
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
line-height: 48rpx;
|
||||
color: #101010;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item:nth-child(2n+1) {
|
||||
border-right: 1px solid #f2f2f2;
|
||||
}
|
||||
}
|
||||
|
||||
.red {
|
||||
color: #A92924 !important;
|
||||
}
|
||||
|
||||
.bar {
|
||||
//height: 50px;
|
||||
color: #ffffff;
|
||||
font-size: 25rpx;
|
||||
background-color: #bf2b28;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
text {
|
||||
padding: 20rpx;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
text:hover {
|
||||
background-color: #941411
|
||||
}
|
||||
|
||||
.active {
|
||||
background-color: #941411
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-sticky offset-top="0" customNavHeight="0">
|
||||
<!-- 顶部 -->
|
||||
<uititle title="平台服务"></uititle>
|
||||
</u-sticky>
|
||||
<cmswiper page="self-support-main" height="280rpx"></cmswiper>
|
||||
<image :src="companyImg" class="w-100p mb-20" mode="widthFix"
|
||||
@click="$jump('/pages/self/companyQuote')"/>
|
||||
<image :src="productImg" class="w-100p mb-20" mode="widthFix"
|
||||
@click="$jump('/pages/self/productQuote')"/>
|
||||
<image :src="costImg" class="w-100p mb-20" mode="widthFix"
|
||||
@click="$jump('/pages/self/costQuote')"/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uititle from "@/components/common/title.vue";
|
||||
import cmswiper from "@/components/common/swiper.vue";
|
||||
|
||||
export default {
|
||||
name: "suportIndex",
|
||||
components: {cmswiper, uititle},
|
||||
data() {
|
||||
return {
|
||||
companyImg: '',
|
||||
productImg: '',
|
||||
costImg: '',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
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]
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
onShow() {
|
||||
this.getCompanyImg()
|
||||
this.getProductImg()
|
||||
this.getCostImg()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user