Files
jjx-web-sign-only/pages/store/buyer.vue
T
2026-10-08 18:20:51 +08:00

1005 lines
36 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view class="">
<top-bar></top-bar>
<common-nav></common-nav>
<view class="w-1200">
<el-row :gutter="20">
<el-col :span="6">
<el-menu @select="menuSelect" :default-active="menuIndex" class="el-menu-vertical-demo">
<el-menu-item index="1">
<i class="el-icon-warning-outline"></i>
<span slot="title">询价单列表</span>
</el-menu-item>
<el-menu-item index="0">
<i class="el-icon-edit"></i>
<span slot="title">加工单列表</span>
</el-menu-item>
<el-menu-item index="3">
<i class="el-icon-attract"></i>
<span slot="title">旧货</span>
</el-menu-item>
<el-menu-item index="2">
<i class="el-icon-s-order"></i>
<span slot="title">自营询价单列表</span>
</el-menu-item>
</el-menu>
</el-col>
<el-col :span="18">
<el-card shadow="never" v-if="['0', '1'].includes(menuIndex)">
<el-tabs v-model="activeName" @tab-click="changeStatus">
<el-tab-pane :label="`全部(${allNum})`" name="all">
</el-tab-pane>
<el-tab-pane :label="`待报价(${noQuoteNum})`" name="noQuote"></el-tab-pane>
<el-tab-pane :label="`待选商(${notPickNum})`" name="notPick"></el-tab-pane>
<el-tab-pane :label="`已选商(${pickedNum})`" name="picked"></el-tab-pane>
</el-tabs>
</el-card>
<el-card shadow="never" v-if="['3'].includes(menuIndex)">
<el-tabs v-model="oldSignMethod" @tab-click="changeOldStatus">
<el-tab-pane :label="`全部`" name="all">
</el-tab-pane>
<el-tab-pane :label="`线上签约`" name="0"></el-tab-pane>
<el-tab-pane :label="`线下签约`" name="1"></el-tab-pane>
</el-tabs>
</el-card>
<el-card shadow="never" v-if="['2'].includes(menuIndex)">
<el-tabs v-model="selfStatus" @tab-click="changeSelfStatus">
<el-tab-pane :label="`全部`" name="all">
</el-tab-pane>
<el-tab-pane :label="`待选商`" name="1"></el-tab-pane>
<el-tab-pane :label="`已选商`" name="2"></el-tab-pane>
</el-tabs>
</el-card>
<el-card shadow="never" style="margin-top: 20px;" v-if="['0', '1', '2', '3'].includes(menuIndex)">
<template v-if="menuIndex === '0'">
<view class="transaction-list">
<view class="item" v-for="(item, index) in processList" :key="index">
<view class="info ">
<view class="title">
<view class="name">
<view class="fabu-status pointer"
@click="navTo(`/pages/process/detail?id=${item._id}`)">
<view class="text">{{
item.status === 0 ? '发布中' : '已选商'
}}
</view>
<view class="sjx"></view>
</view>
<span class="item-title pointer"
@click="navTo(`/pages/process/detail?id=${item._id}`)">{{
item.title
}}</span>
<el-tag effect="plain" size="mini" class="el-tag">
{{ item.signMethod === 1 ? '线下签单' : '线上签约' }}
</el-tag>
<view v-if="item.status === 1 && item.signMethod === 1"
class="ml-20 flex justify-start items-center">
<switch-icon theme="outline" size="20" fill="#000000"
strokeLinecap="square"/>
<el-tag size="mini" type="warning" class="pointer"
@click.native="processChangeToOnlineSign(item._id, index)">
切换至线上交易
</el-tag>
</view>
</view>
</view>
<view class="caigou">
<view class="item">
<view class="icon">
<i class="el-icon-shopping-bag-1"></i>
</view>
<view class="infos">
<view class="name">加工量</view>
<view class="unit">{{ item.num }}</view>
</view>
</view>
</view>
<view class="sub-title">
<text>交易编号:{{ item.orderNo }}</text>
<text>发布时间:{{ item._add_time_str }}</text>
</view>
<view class="status">
<view class="icon">
<img src="/static/images/store/choose.png" alt=""
v-if="item.status === 1"/>
<img src="/static/images/store/unchoose.png" alt=""
v-else-if="item.status === 0"/>
</view>
</view>
</view>
<view class="tool">
<view class="btn">
<!-- <el-button size="small" plain style="width: 160px;" v-if="item.status === 0"-->
<!-- @click.native="editEnquiry(item._id)">编辑询价详情-->
<!-- </el-button>-->
<el-button size="small" type="success" style="width: 160px;"
v-if="item.status !== 0 && item.signMethod !== 1 && item.contract"
@click.native="navTo(`/pages/contract/index?tab=${item.contract ? (item.contract.status === 1 ? 1 : (item.contract.status === 2 ) ? 2 : 0) : 0}`)"
>
{{
item.contract ? (item.contract.status === 1 ? '去签署合同' : (item.contract.status === 0) ? '去创建合同' : '查看合同')
: '去创建合同'
}}
</el-button>
</view>
<view class="btn">
<el-button size="small" type="danger" v-if="item.status === 0"
@click.native="showProcessModal(item)"
style="width: 160px;">查看意向合作列表
</el-button>
<el-button size="small" type="success" plain style="width: 160px;" v-else
@click.native="showOtherUser(item)"
>查看交易方
</el-button>
</view>
<view class="btn">
<el-button size="small" type="text" @click.native="showProcessModal(item)"
style="width: 160px;">共收到{{ item.quoteNum }}个报价
</el-button>
</view>
</view>
</view>
<view class="paginatio">
<el-pagination background layout="prev, pager, next" :total="total"
:page-size="pageSize" @current-change="handleCurrentChange">
</el-pagination>
</view>
</view>
</template>
<template v-if="menuIndex === '1'">
<view class="transaction-list">
<view class="item" v-for="(item, index) in enquiryList" :key="index">
<view class="info ">
<view class="title">
<view class="name">
<view class="fabu-status pointer"
@click="navTo(`/pages/enquiry/detail?id=${item._id}`)">
<view class="text">{{
item.status === 0 ? '发布中' : '已选商'
}}
</view>
<view class="sjx pointer"></view>
</view>
<span class="item-title pointer"
@click="navTo(`/pages/enquiry/detail?id=${item._id}`)">{{
item.title
}}</span>
<el-tag effect="plain" size="mini" class="el-tag">
{{ item.signMethod === 1 ? '线下签单' : '线上签约' }}
</el-tag>
<view v-if="item.status === 1 && item.signMethod === 1"
class="ml-20 flex justify-start items-center">
<switch-icon theme="outline" size="20" fill="#000000"
strokeLinecap="square"/>
<el-tag size="mini" type="warning" class="pointer"
@click.native="enquiryChangeToOnlineSign(item._id, index)">
切换至线上交易
</el-tag>
</view>
</view>
</view>
<view class="caigou">
<view class="item">
<view class="icon">
<i class="el-icon-shopping-bag-1"></i>
</view>
<view class="infos">
<view class="name">采购量</view>
<view class="unit">{{
item.productNum
}}
</view>
</view>
</view>
<view class="item" style="margin-left: 100px;">
<view class="icon">
<i class="el-icon-location-outline"></i>
</view>
<view class="infos">
<view class="name">交易地址</view>
<view class="unit">{{ item.fullAddress }}</view>
</view>
</view>
</view>
<view class="sub-title">
<text>交易编号:{{ item.enquiryNo }}</text>
<text>发布时间:{{ item._add_time_str }}</text>
</view>
<view class="status">
<view class="icon">
<img src="/static/images/store/choose.png" alt=""
v-if="[1, 2].includes(item.status)"/>
<img src="/static/images/store/unchoose.png" alt=""
v-if="item.status === 0"/>
</view>
</view>
</view>
<view class="tool">
<view class="btn">
<!-- <el-button size="small" plain style="width: 160px;" v-if="item.status === 0"-->
<!-- @click.native="editEnquiry(item._id)">编辑询价详情-->
<!-- </el-button>-->
<el-button size="small" type="success" style="width: 160px;"
v-if="item.status !== 0 && item.signMethod !== 1 && item.contract"
@click.native="navTo(`/pages/contract/index?tab=${item.contract ? (item.contract.status === 1 ? 1 : (item.contract.status === 2 ) ? 2 : 0) : 0}`)"
>
{{
item.contract ? (item.contract.status === 1 ? '去签署合同' : (item.contract.status === 0) ? '去创建合同' : '查看合同')
: '去创建合同'
}}
</el-button>
</view>
<view class="btn">
<el-button size="small" type="success" style="width: 160px;"
v-if="item.status === 2 && parseInt(item.tradeMethod) === 1"
@click.native="navTo('/pages/order/order')">去订单
</el-button>
</view>
<view class="btn">
<el-button size="small" type="danger" v-if="item.status === 0"
@click.native="showEnquiryModal(item)"
style="width: 160px;">查看意向合作列表
</el-button>
<el-button size="small" type="success" plain style="width: 160px;" v-else
@click.native="showOtherUser(item)">查看交易方
</el-button>
</view>
<view class="btn">
<el-button size="small" type="text" @click.native="showEnquiryModal(item)"
style="width: 160px;">共收到{{ item.quoteNum }}个报价
</el-button>
</view>
</view>
</view>
<view class="paginatio">
<el-pagination background layout="prev, pager, next" :total="total"
:page-size="pageSize" @current-change="handleCurrentChange">
</el-pagination>
</view>
</view>
</template>
<template v-if="menuIndex === '2'">
<view class="transaction-list">
<view class="item" v-for="(item, index) in selfSupportList.rows" :key="index">
<view class="info ">
<view class="title">
<view class="name">
<view class="fabu-status pointer">
<view class="text">{{
item.status === 0 ? '待报价' : (item.status === 1 ? '待选商' : '已选商')
}}
</view>
<view class="sjx pointer"></view>
</view>
</view>
</view>
<view class="caigou">
<view class="item">
<view class="icon">
<i class="el-icon-location-outline"></i>
</view>
<view class="infos">
<view class="name">{{ item.desc ? `产品描述:${item.desc}` : '自营询价' }}</view>
<view class="unit">{{ item.province.name }}{{
item.city.name
}}
</view>
</view>
</view>
</view>
<view class="sub-title">
<text>发布时间:{{ item._add_time_str }}</text>
</view>
<view class="status">
<view class="icon">
<img src="/static/images/store/choose.png" alt=""
v-if="item.status === 2"/>
<img src="/static/images/store/unchoose.png" alt=""
v-if="item.status === 1"/>
</view>
</view>
</view>
<view class="tool">
<el-button size="small" type="success" style="width: 160px;"
v-if="item.status !== 0 && item.signMethod !== 1 && item.contract"
@click.native="navTo(`/pages/contract/index?tab=${item.contract ? (item.contract.status === 1 ? 1 : (item.contract.status === 2 ) ? 2 : 0) : 0}`)"
>
{{
item.contract ? (item.contract.status === 1 ? '去签署合同' : (item.contract.status === 0) ? '去创建合同' : '查看合同')
: '去创建合同'
}}
</el-button>
<el-button size="small" plain style="width: 160px;margin: 10px"
@click.native="showDetail(item)">查看详情
</el-button>
<el-button size="small" type="success" plain style="width: 160px;margin: 10px"
v-if="item.status === 2"
@click.native="showOtherUser(item)">查看交易方
</el-button>
</view>
</view>
<view class="paginatio">
<el-pagination background layout="prev, pager, next" :total="selfSupportList.total"
:page-size="pageSize" @current-change="handleCurrentChange">
</el-pagination>
</view>
</view>
</template>
<template v-if="menuIndex === '3'">
<view class="transaction-list">
<view class="item" v-for="(item, index) in oldList" :key="index">
<view class="info pointer" @click="navTo(`/pages/index/old/detail?id=${item._id}`)">
<view class="title">
<view class="name">
<view class="fabu-status">
<view class="text">{{
item.status === 0 ? '发布中' : '已选商'
}}
</view>
<view class="sjx"></view>
</view>
<span class="item-title">{{
item.title
}}</span>
<template v-if="item.type !== 3">
<el-tag effect="plain" size="mini" class="el-tag">
{{ item.signMethod === 0 ? '线上签约' : '线下签单' }}
</el-tag>
</template>
</view>
</view>
<view class="caigou">
<view class="item">
<view class="icon">
<i class="el-icon-shopping-bag-1"></i>
</view>
<view class="infos">
<view class="name">类型</view>
<view class="unit">{{
item.typeStr
}}
</view>
</view>
</view>
<view class="item" style="margin-left: 100px;">
<view class="icon">
<i class="el-icon-location-outline"></i>
</view>
<view class="infos">
<view class="name">交易地址</view>
<view class="unit"
v-if="item.addressRegion && item.addressRegion.province">
{{
item.addressRegion.province.name
}}{{
item.addressRegion.city.name
}}{{ item.addressRegion.area.name }}{{ item.addressDetail }}
</view>
</view>
</view>
</view>
<view class="sub-title">
<text>交易编号:{{ item._id }}</text>
<text>发布时间:{{ item._add_time_str }}</text>
</view>
</view>
<view class="tool">
<el-button size="mini" type="success" style="width: 160px;margin: 10px"
v-if="item.status !== 0 && item.signMethod !== 1 && item.contract && item.contract.status === 1"
@click.native="$jump('/pages/contract/index?tab=1')">
签署合同
</el-button>
<el-button size="mini" type="success" style="width: 160px;margin: 10px"
v-if="item.status !== 0 && item.signMethod !== 1 && item.contract && item.contract.status === 2"
@click.native="$jump('/pages/contract/index?tab=2')">
查看合同
</el-button>
<el-button size="mini" type="success" style="width: 160px;margin: 10px"
v-if="item.status !== 0 && item.signMethod !== 1 && (!item.contract || item.contract.status === 0)"
@click.native="$jump('/pages/contract/index?tab=0')">
合同待创建
</el-button>
<el-button size="small" plain style="width: 160px;margin: 10px"
@click.native="navTo(`/pages/index/old/detail?id=${item._id}`)">查看详情
</el-button>
<el-button size="small" type="success" plain style="width: 160px;margin: 10px"
v-if="item.status === 2"
@click.native="showOtherUser(item)">查看交易方
</el-button>
</view>
</view>
<view class="paginatio">
<el-pagination background layout="prev, pager, next" :total="total"
:page-size="pageSize" @current-change="handleCurrentChange">
</el-pagination>
</view>
</view>
</template>
</el-card>
<enquiry-data v-else/>
</el-col>
</el-row>
</view>
<common-footer></common-footer>
<enquiry-modal ref="enquiryModal"/>
<process-modal ref="processModal"/>
<self-support-modal ref="selfSupportModal"/>
</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 {
Agreement,
Switch as SwitchIcon
} from "@icon-park/vue";
import EnquiryModal from "./components/enquiryModal.vue";
import ProcessModal from "./components/processModal.vue";
import EnquiryData from "./components/enquiryData.vue";
import selfSupport from "../index/self-support/self-support.vue";
import SelfSupportModal from "./components/selfSupportModal.vue";
export default {
computed: {
selfSupport() {
return selfSupport
}
},
components: {
SelfSupportModal,
EnquiryData,
ProcessModal,
EnquiryModal,
Agreement,
SwitchIcon
},
data() {
return {
provinceData: provinces,
cityData: citys,
areaData: areas,
activeName: 'all',
value: '',
menuIndex: '1',
formData: {
status: 0,
tradeMethod: null
},
tableData: {},
pageSize: 10,
enquiryList: [],
processList: [],
selfSupportList: {},
total: 0,
notPickNum: 0,
pickedNum: 0,
noQuoteNum: 0,
allNum: 0,
oldList: [],
oldSignMethod: 'all',
selfStatus: 'all',
}
},
onLoad(options) {
if (!vk.getVuex('$user.userInfo.mobile')) {
this.$confirm('请先绑定手机号', '提示', {
confirmButtonText: '确定',
showCancelButton: false,
type: 'warning'
}).then(() => {
vk.redirectTo(`/pages/auth/login/wechat?state=jjx_` + vk.getVuex('$user.userInfo.accountType'))
}).catch(() => {
vk.redirectTo(`/pages/auth/login/wechat?state=jjx_` + vk.getVuex('$user.userInfo.accountType'))
})
return
}
if (options.menuIndex) {
this.menuIndex = String(options.menuIndex)
}
if (this.menuIndex === '1') this.getEnquiryList()
else if (this.menuIndex === '0') this.getProcessList()
else if (this.menuIndex === '2') this.getSelfSupportList()
},
methods: {
navTo(url) {
vk.navigateTo({
url
})
},
menuSelect(e) {
this.menuIndex = String(e)
this.formData.status = Number(e)
this.handleCurrentChange(1)
},
handleCurrentChange(page) {
if (this.menuIndex === '1') this.getEnquiryList(page)
else if (this.menuIndex === '0') this.getProcessList(page)
else if (this.menuIndex === '2') this.getSelfSupportList(page)
else if (this.menuIndex === '3') this.getOldList(page)
},
changeStatus() {
if (this.menuIndex === '1') this.getEnquiryList(1)
else if (this.menuIndex === '0') this.getProcessList(1)
else if (this.menuIndex === '2') this.getSelfSupportList(1)
else if (this.menuIndex === '3') this.getOldList(1)
},
changeOldStatus() {
this.getOldList(1)
},
changeSelfStatus() {
this.getSelfSupportList(1)
},
getOldList(pageIndex = 1) {
vk.callFunction({
url: 'client/old/kh/getList',
data: {
quoteUid: vk.getVuex('$user.userInfo._id'),
pageIndex,
pageSize: this.pageSize,
signMethod: this.oldSignMethod === 'all' ? null : this.oldSignMethod,
buyerOnly: true
},
success: (res) => {
this.oldList = res.rows.map(item => {
if (item.type === 0) item.typeStr = '拍卖'
else if (item.type === 1) item.typeStr = '采购'
else if (item.type === 2) {
item.typeStr = '租赁'
if (item.rentType === 0) item.typeStr += '-承租'
else item.typeStr += '-出租'
} else if (item.type === 3) item.typeStr = '物资回收'
if (item.addressRegion && item.addressRegion.length > 0)
item.address = item?.addressRegion[0]?.name + item?.addressRegion[1]?.name + item?.addressRegion[2]?.name + item.addressDetail
return item
})
this.total = res.total
}
})
},
getEnquiryList(pageIndex = 1) {
vk.callFunction({
url: 'client/enquiry/sheet/kh/getList',
title: '加载中...',
data: {
userId: vk.getVuex('$user.userInfo._id'),
pageIndex,
pageSize: this.pageSize,
status: this.activeName
},
success: (res) => {
this.enquiryList = res.rows.map(val => {
let str = ''
val.productNum = ''
if (val.productList !== undefined && val.productList.length > 0 && val.productList[0].addressRegion !== undefined && val.productList[0].addressRegion.length > 0) {
let provinceIndex = 0, cityIndex = 0, areaIndex = 0
this.provinceData.forEach((item, index) => {
if (parseInt(val.productList[0].addressRegion[0]) === parseInt(item.code)) {
provinceIndex = index
str = item.name
}
})
this.cityData[provinceIndex].forEach((item, index) => {
if (parseInt(val.productList[0].addressRegion[1]) === parseInt(item.code)) {
cityIndex = index
str += `-${item.name}`
}
})
this.areaData[provinceIndex][cityIndex].forEach((item, index) => {
if (parseInt(val.productList[0].addressRegion[2]) === parseInt(item.code)) {
areaIndex = index
str += `-${item.name}`
}
})
// str += val.productList[0].addressDetail
}
const productNumList = []
val.productList.forEach((item, index) => {
if (item.procureNumber) productNumList.push(item.procureNumber + item.procureUnit)
})
val.productNum = productNumList.join('/')
val.fullAddress = str
return val
})
this.total = res.total
this.allNum = res.all
this.notPickNum = res.notPickNum
this.noQuoteNum = res.noQuoteNum
this.pickedNum = res.pickedNum
this.quoteNum = res.quoteNum
}
})
},
getProcessList(pageIndex = 1) {
vk.callFunction({
url: 'client/process/sheet/pub/getList',
title: '加载中...',
data: {
isUser: true,
userId: vk.getVuex('$user.userInfo._id'),
pageIndex,
pageSize: this.pageSize,
status: this.activeName
},
success: (res) => {
this.processList = res.rows
this.total = res.total
this.allNum = res.all
this.notPickNum = res.notPickNum
this.pickedNum = res.pickedNum
this.quoteNum = res.quoteNum
this.noQuoteNum = res.noQuoteNum
}
})
},
async getSelfSupportList(pageIndex = 1) {
const data = await vk.callFunction({
url: 'client/selfSupport/kh/getList',
data: {
pageIndex,
pageSize: this.pageSize,
status: this.selfStatus === 'all' ? null : this.selfStatus,
}
})
this.selfSupportList = data
this.showList = true
},
showEnquiryModal(item) {
this.$refs.enquiryModal.open(item)
},
showProcessModal(item) {
this.$refs.processModal.open(item)
},
editEnquiry(id) {
vk.navigateTo({
url: `/pages/enquiry/release?id=${id}`
})
},
enquiryChangeToOnlineSign(id, index) {
this.$confirm('确认将该订单转为线上签订吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async () => {
await vk.callFunction({
url: ' client/enquiry/sheet/kh/changeToOnlineSign',
title: '加载中...',
data: {
id
}
})
this.$confirm('切换成功,是否去创建合同?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
vk.navigateTo({url: '/pages/contract/index'});
})
this.enquiryList[index].signMethod = 0
})
},
processChangeToOnlineSign(id, index) {
this.$confirm('确认将该订单转为线上签订吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async () => {
await vk.callFunction({
url: ' client/process/sheet/kh/changeToOnlineSign',
title: '加载中...',
data: {
id
}
})
this.$confirm('切换成功,是否去创建合同?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
vk.navigateTo({url: '/pages/contract/index'});
})
this.enquiryList[index].signMethod = 0
})
},
showOtherUser(item) {
if (item.otherUser) {
this.$confirm(`交易方联系方式:${item.otherUser.company.mobile ?? item.otherUser.person.mobile}`, '', {
cancelButtonText: '关闭',
showConfirmButton: false
})
} else {
this.$confirm(`交易方未留下联系方式`, '', {
cancelButtonText: '关闭',
showConfirmButton: false
})
}
},
showDetail(info) {
this.$refs.selfSupportModal.open(info)
}
}
}
</script>
<style scoped lang="scss">
.w-1200 {
width: 1200px;
margin: 20px auto;
}
.contract-list {
background-color: #FFFFFF;
padding: 10px 20px 20px;
}
.transaction-list {
display: flex;
flex-direction: column;
.item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 0;
border-bottom: 1px solid #f3f3f3;
.info {
position: relative;
border-right: 1px solid #f3f3f3;
flex: 1;
.name {
display: flex;
font-size: 16px;
font-weight: bold;
line-height: 1.6em;
align-items: center;
.fabu-status {
margin-right: 20px;
font-weight: normal;
display: flex;
width: 95px;
.text {
padding: 0 10px 0 20px;
font-size: 13px;
color: #fff;
background-color: #A92924;
}
.sjx {
border: 12px solid;
border-color: #A92924 #ffffff #A92924 #A92924;
position: relative;
}
// .text{
// color: #fff;
// background-color: #A92924
// }
}
.item-title {
width: 200px;
}
.buyer,
.seller {
font-size: 14px;
font-weight: normal;
display: flex;
margin: 0 30px;
}
.el-tag {
margin-left: 10px;
}
}
.caigou {
display: flex;
align-items: center;
.item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 0;
border: none;
.icon {
display: flex;
justify-content: center;
align-items: center;
margin: 10px;
background-color: #f3f3f3;
padding: 10px;
border-radius: 100px;
.el-icon-shopping-bag-1,
.el-icon-location-outline {
font-size: 30px;
}
}
.infos {
display: flex;
flex-direction: column;
.unit {
color: #A92924
}
}
}
}
.sub-title {
color: #999999;
text {
margin-right: 60px;
}
}
.action {
padding: 10px 0;
display: flex;
flex-direction: row;
align-items: center;
.btn-buy,
.btn-close {
color: #A92924;
}
}
.status {
position: absolute;
top: 0;
right: 0;
.icon {
margin: 0 20px;
img {
width: 80px;
}
}
}
}
.tool {
display: flex;
width: 200px;
align-items: center;
justify-content: space-around;
flex-direction: column;
.btn {
margin: 5px 0;
}
.price {
margin: 0 20px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.red {
font-size: 16px;
color: #A92924;
font-weight: bold;
}
}
}
}
}
.paginatio {
margin: 20px auto;
display: flex;
justify-content: center;
}
.contract-box {
display: flex;
justify-content: space-between;
border-bottom: solid 1px #e8e8e8;
padding: 10rpx 0;
}
.contract-left {
}
.contract-right {
text-align: right;
font-size: 13px;
}
.trade-method {
display: flex;
margin-bottom: 20px;
border-bottom: solid 2px #f4f4f4;
}
.trade-method-item {
cursor: pointer;
font-size: 18px;
margin-right: 15px;
height: 40px;
line-height: 40px;
}
.trade-method-item.active {
color: #A92924;
border-bottom: solid 2px #A92924;
}
.contract-left-top {
display: flex;
align-items: center;
}
.contract-product {
margin: 0 10px;
}
.contract-left-center {
height: 40px;
display: flex;
justify-content: flex-start;
align-items: flex-start;
color: #999999;
font-size: 12px;
flex-direction: column;
margin-top: 5px;
}
.contract-left-bottom {
display: flex;
}
.contract-status {
display: flex;
}
.contract-status-tag {
margin-left: 2px;
}
.sign {
padding: 20px 20px 20px 25px;
font-size: 14px;
.icon {
line-height: 18px;
}
}
.search {
display: flex;
.p {
margin-right: 10px;
}
}
.el-select .el-input {
width: 130px;
}
.input-with-select .el-input-group__prepend {
background-color: #fff;
}
</style>