|
|
@@ -34,20 +34,21 @@
|
|
|
<span>操作</span>
|
|
|
</p>
|
|
|
<ul v-if="purchaseManList.content && purchaseManList.content.length">
|
|
|
- <li v-for="(purchaseMan, index) in purchaseManList.content" :class="{'active': purchaseMan.active}">
|
|
|
+ <li v-for="(purchaseMan, index) in purchaseManList.content" :class="{'active': purchaseMan.active}" :key="index" ref="purchaseManList">
|
|
|
<div>{{purchaseMan.date| date}}</div>
|
|
|
<div v-if="purchaseMan.inquiry.enterprise && purchaseMan.inquiry.enterprise.enName">{{purchaseMan.inquiry.enterprise.enName | enterpriseFilter}}</div>
|
|
|
<div v-else>{{purchaseMan.userName | userNameFilter}}</div>
|
|
|
<div :title="purchaseMan.cmpCode">{{purchaseMan.cmpCode || '-'}}</div>
|
|
|
<div :title="purchaseMan.inbrand">{{purchaseMan.inbrand || '-'}}</div>
|
|
|
- <div class="number-content"><img src="/images/applyPurchase/hot-fire.png" alt="" v-if="purchaseMan.offerAmount > 10"><span :style="purchaseMan.offerAmount > 10 ? 'color: #ff9a00': ''">{{purchaseMan.offerAmount || 0}}</span> 条</div>
|
|
|
+ <div class="number-content"><img src="/images/applyPurchase/hot-fire.png" alt="" v-if="purchaseMan.offerAmount > 10">
|
|
|
+ <span :style="purchaseMan.offerAmount > 10 ? 'color: #ff9a00': ''">{{purchaseMan.offerAmount || 0}}</span> 条</div>
|
|
|
<div class="date-content">
|
|
|
<div v-if="purchaseMan.remainingTime > 0">
|
|
|
<span>剩余 </span>
|
|
|
<span v-if="getDay(purchaseMan.remainingTime) > 0" v-text="getDay(purchaseMan.remainingTime)"></span>
|
|
|
<i v-if="getDay(purchaseMan.remainingTime) > 0"> 天 </i>
|
|
|
<span v-if="getDay(purchaseMan.remainingTime) <= 0" v-text="getHours(purchaseMan.remainingTime)"></span>
|
|
|
- <i v-if="getDay(purchaseMan.remainingTime) <= 0" > 小时</i>
|
|
|
+ <i v-if="getDay(purchaseMan.remainingTime) <= 0"> 小时</i>
|
|
|
</div>
|
|
|
<span v-if="!purchaseMan.remainingTime || purchaseMan.remainingTime <= 0">已截止</span>
|
|
|
</div>
|
|
|
@@ -60,21 +61,49 @@
|
|
|
<a title="此为贵公司的求购" v-if="purchaseMan.remainingTime > 0 && (!purchaseMan.quoted || purchaseMan.quoted != 1) && (user.logged && ((purchaseMan.inquiry.enterprise && user.data.enterprise && (purchaseMan.inquiry.enterprise.uu === user.data.enterprise.uu)) || (!user.data.enterprise.uu && purchaseMan.userUU == user.data.userUU && !purchaseMan.inquiry.enterprise)))" style="background: #cccbcb;" @click="sayPriceSeft">我要报价</a>
|
|
|
<a v-if="purchaseMan.remainingTime > 0 && (!purchaseMan.quoted || purchaseMan.quoted != 1) && !(user.logged && ((purchaseMan.inquiry.enterprise && user.data.enterprise && (purchaseMan.inquiry.enterprise.uu === user.data.enterprise.uu)) || (!user.data.enterprise.uu && purchaseMan.userUU == user.data.userUU && !purchaseMan.inquiry.enterprise)))" @click="sayPrice(purchaseMan, index)">我要报价</a>
|
|
|
</div>
|
|
|
+
|
|
|
</div>
|
|
|
+
|
|
|
<div class="expand-content">
|
|
|
<div>
|
|
|
封装：{{purchaseMan.encapsulation || '-'}}
|
|
|
</div>
|
|
|
<div>
|
|
|
- 采购数量：<span>{{purchaseMan.needquantity || '-'}}</span><span v-if="purchaseMan.needquantity">个</span>
|
|
|
+ 采购数量：
|
|
|
+ <span>{{purchaseMan.needquantity || '-'}}</span>
|
|
|
+ <span v-if="purchaseMan.needquantity">个</span>
|
|
|
</div>
|
|
|
<div>
|
|
|
- 单价预算：<span>{{purchaseMan.unitPrice ? (purchaseMan.currency == 'RMB' ? '￥' : '$') + purchaseMan.unitPrice : '-'}}</span>
|
|
|
+ 单价预算：
|
|
|
+ <span>{{purchaseMan.unitPrice ? (purchaseMan.currency == 'RMB' ? '￥' : '$') + purchaseMan.unitPrice : '-'}}</span>
|
|
|
</div>
|
|
|
<div>
|
|
|
生产日期：{{purchaseMan.produceDate || '-'}}
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class="sharecode">
|
|
|
+ <div class="sharecodeR"></div>
|
|
|
+ <div class="sharecodeL" @mouseover="setShowShare(!showShare, index, purchaseMan.id)">
|
|
|
+ <div class="sharecodeT">求<br/>购<br/>分<br/>享</div>
|
|
|
+ <div class="sharecodeBtn" @mouseout="hideShowShare(!showShare, index, purchaseMan.id)">
|
|
|
+ <img src="/images/mobile/@2x/purChase/code.png" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="sharescancodekuang">
|
|
|
+ <div class="sharescancode icon-style" ref="sharescancode" @mouseover="showShowShare(!showShare, index, purchaseMan.id)" @mouseout="hideShowShare(!showShare, index, purchaseMan.id)">
|
|
|
+ <div class="share">
|
|
|
+ <div>
|
|
|
+ <div class="title">求购分享</div>
|
|
|
+ <canvas :class="'qrccode-canvas_'+index" width="98" height="98"></canvas>
|
|
|
+ <input :value="url" readonly>
|
|
|
+ <span :class="'copyLink_'+index" :data-clipboard-text="url">复制链接</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
<!--<div class="say-price">
|
|
|
<div>报价</div>
|
|
|
<div>
|
|
|
@@ -105,21 +134,19 @@
|
|
|
<span>暂无搜索结果</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <say-price :current="currentSayPriceIndex"
|
|
|
- :purchase="purchaseManList"
|
|
|
- @cancelSayPriceAction="cancelSayPrice"
|
|
|
- @resetListAction="resetList"
|
|
|
- @sayPriceIndexAction="setIndex(index)"
|
|
|
- ></say-price>
|
|
|
- <page :total="totalCount" :page-size="pageSize"
|
|
|
- :current="nowPage" v-on:childEvent="listenPage"></page>
|
|
|
+
|
|
|
+ <say-price :current="currentSayPriceIndex" :purchase="purchaseManList" @cancelSayPriceAction="cancelSayPrice" @resetListAction="resetList" @sayPriceIndexAction="setIndex(index)"></say-price>
|
|
|
+ <page :total="totalCount" :page-size="pageSize" :current="nowPage" v-on:childEvent="listenPage"></page>
|
|
|
<div class="com-del-box link-saler-box" v-if="linkBoxIndex > -1">
|
|
|
<div class="title">
|
|
|
<i @click="setLinkBoxIndex(-1)"></i>
|
|
|
</div>
|
|
|
<div class="content">
|
|
|
- <p><i class="fa fa-exclamation-circle"></i>抱歉，暂时无法与买家在线沟通！</p>
|
|
|
- <p>买家联系电话：<span v-text="purchaseManList.content[linkBoxIndex].userTel"></span></p>
|
|
|
+ <p>
|
|
|
+ <i class="fa fa-exclamation-circle"></i>抱歉，暂时无法与买家在线沟通！</p>
|
|
|
+ <p>买家联系电话：
|
|
|
+ <span v-text="purchaseManList.content[linkBoxIndex].userTel"></span>
|
|
|
+ </p>
|
|
|
<div>
|
|
|
<a @click="setLinkBoxIndex(-1)">我知道了</a>
|
|
|
</div>
|
|
|
@@ -128,212 +155,337 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
- import Page from '~components/common/page/pageComponent.vue'
|
|
|
- import SayPrice from './SayPrice.vue'
|
|
|
- export default {
|
|
|
- data () {
|
|
|
- return {
|
|
|
- pageSize: 10,
|
|
|
- nowPage: 1,
|
|
|
- keyWord: '',
|
|
|
- sorting: {},
|
|
|
- currentSayPriceIndex: -1,
|
|
|
- linkBoxIndex: -1
|
|
|
- }
|
|
|
+import Page from '~components/common/page/pageComponent.vue'
|
|
|
+import SayPrice from './SayPrice.vue'
|
|
|
+import Clipboard from 'clipboard'
|
|
|
+let QRCode = require('qrcode')
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ pageSize: 10,
|
|
|
+ nowPage: 1,
|
|
|
+ keyWord: '',
|
|
|
+ sorting: {},
|
|
|
+ currentSayPriceIndex: -1,
|
|
|
+ linkBoxIndex: -1,
|
|
|
+ showShare: false,
|
|
|
+ url: '',
|
|
|
+ Timer: {}
|
|
|
+ }
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ Page,
|
|
|
+ SayPrice
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ date: function(date) {
|
|
|
+ const d = new Date(Number(date))
|
|
|
+ const year = d.getFullYear()
|
|
|
+ const monthTemp = d.getMonth() + 1
|
|
|
+ const month = monthTemp < 10 ? '0' + monthTemp : '' + monthTemp
|
|
|
+ const hour = d.getHours() < 10 ? '0' + d.getHours() : '' + d.getHours()
|
|
|
+ const minutes =
|
|
|
+ d.getMinutes() < 10 ? '0' + d.getMinutes() : '' + d.getMinutes() + ' '
|
|
|
+ const day = d.getDate() < 10 ? '0' + d.getDate() : '' + d.getDate() + ' '
|
|
|
+ return year + '-' + month + '-' + day + ' ' + hour + ':' + minutes
|
|
|
},
|
|
|
- components: {
|
|
|
- Page,
|
|
|
- SayPrice
|
|
|
+ phone: function(str) {
|
|
|
+ return str ? str.substring(0, 3) + '****' + str.substring(7, 11) : '-'
|
|
|
},
|
|
|
- filters: {
|
|
|
- date: function (date) {
|
|
|
- const d = new Date(Number(date))
|
|
|
- const year = d.getFullYear()
|
|
|
- const monthTemp = d.getMonth() + 1
|
|
|
- const month = monthTemp < 10 ? '0' + monthTemp : '' + monthTemp
|
|
|
- const hour = d.getHours() < 10 ? '0' + d.getHours() : '' + d.getHours()
|
|
|
- const minutes = d.getMinutes() < 10 ? '0' + d.getMinutes() : '' + d.getMinutes() + ' '
|
|
|
- const day = d.getDate() < 10 ? '0' + d.getDate() : '' + d.getDate() + ' '
|
|
|
- return year + '-' + month + '-' + day + ' ' + hour + ':' + minutes
|
|
|
- },
|
|
|
- phone: function (str) {
|
|
|
- return str ? (str.substring(0, 3) + '****' + str.substring(7, 11)) : '-'
|
|
|
- },
|
|
|
- enterpriseFilter (str) {
|
|
|
- return str ? str.length > 4 ? str.substring(0, 2) + '**' + str.substring(str.length - 2, str.length) : str : '-'
|
|
|
- },
|
|
|
- userNameFilter (str) {
|
|
|
- return str ? (str.substring(0, 1) + '**') : '-'
|
|
|
- }
|
|
|
+ enterpriseFilter(str) {
|
|
|
+ return str
|
|
|
+ ? str.length > 4
|
|
|
+ ? str.substring(0, 2) +
|
|
|
+ '**' +
|
|
|
+ str.substring(str.length - 2, str.length)
|
|
|
+ : str
|
|
|
+ : '-'
|
|
|
},
|
|
|
- computed: {
|
|
|
- purchaseManList () {
|
|
|
- return this.$store.state.applyPurchase.purchaseManList.purchaseManList.data
|
|
|
- },
|
|
|
- totalCount () {
|
|
|
- return this.purchaseManList.totalElements
|
|
|
- },
|
|
|
- user () {
|
|
|
- return this.$store.state.option.user
|
|
|
- }
|
|
|
+ userNameFilter(str) {
|
|
|
+ return str ? str.substring(0, 1) + '**' : '-'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ storeInfo() {
|
|
|
+ return this.$store.state.shop.storeInfo.store.data
|
|
|
},
|
|
|
- methods: {
|
|
|
- setIndex: function (index) {
|
|
|
- this.currentSayPriceIndex = index
|
|
|
- },
|
|
|
- getDay: function (timeStamp) {
|
|
|
- return Math.floor(timeStamp / (1000 * 60 * 60 * 24))
|
|
|
- },
|
|
|
- getHours: function (timeStamp) {
|
|
|
- return Math.floor((timeStamp / (1000 * 60 * 60)) % 24)
|
|
|
- },
|
|
|
- listenPage: function (page) {
|
|
|
- this.nowPage = page
|
|
|
- this.resetList()
|
|
|
- },
|
|
|
- sayPrice: function (purchaseMan, index) {
|
|
|
-// let _this = this
|
|
|
-// for (let i = 0; i < this.purchaseManList.content.length; i++) {
|
|
|
-// _this.purchaseManList.content[i].active = false
|
|
|
-// }
|
|
|
- if (this.user.logged) {
|
|
|
- if (this.user.data.enterprise.uu) {
|
|
|
- if (this.user.data.enterprise.isVendor && this.user.data.enterprise.isVendor !== '1690') {
|
|
|
-// this.resetSayPrice()
|
|
|
- purchaseMan.active = true
|
|
|
- this.currentSayPriceIndex = index
|
|
|
- } else {
|
|
|
- this.$message.error('抱歉，您需开通卖家功能才可报价')
|
|
|
- }
|
|
|
- } else {
|
|
|
- this.$message.error('个人账户暂不可报价')
|
|
|
- }
|
|
|
+ purchaseManList() {
|
|
|
+ return this.$store.state.applyPurchase.purchaseManList.purchaseManList
|
|
|
+ .data
|
|
|
+ },
|
|
|
+ totalCount() {
|
|
|
+ return this.purchaseManList.totalElements
|
|
|
+ },
|
|
|
+ user() {
|
|
|
+ return this.$store.state.option.user
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ copyurl(index) {
|
|
|
+ let _this = this
|
|
|
+ _this.clipboard = new Clipboard('.copyLink_' + index)
|
|
|
+ _this.clipboard.on('success', e => {
|
|
|
+ // _this.clipboard.destroy()
|
|
|
+ e.clearSelection()
|
|
|
+ _this.$message.success('已复制到剪切板')
|
|
|
+ })
|
|
|
+ _this.clipboard.on('error', e => {
|
|
|
+ _this.$message.error('浏览器不支持自动复制，请手动复制')
|
|
|
+ _this.clipboard.destroy()
|
|
|
+ })
|
|
|
+ document.addEventListener('click', function() {
|
|
|
+ // _this.showShare = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ loadQRcode: function(id, index) {
|
|
|
+ let canvas = document.getElementsByClassName('qrccode-canvas_' + index)[0]
|
|
|
+ var opts = {
|
|
|
+ width: '122'
|
|
|
+ }
|
|
|
+ this.url =
|
|
|
+ window.location.protocol +
|
|
|
+ '//' +
|
|
|
+ window.location.host +
|
|
|
+ '/mobile/share/purChase/' +
|
|
|
+ id
|
|
|
+ QRCode.toCanvas(canvas, this.url, opts, error => {
|
|
|
+ if (error) {
|
|
|
+ console.log(error)
|
|
|
} else {
|
|
|
- this.$router.push('/auth/login?returnUrl=' + window.location.href)
|
|
|
+ console.log('QRcode success')
|
|
|
}
|
|
|
- },
|
|
|
- cancelSayPrice: function () {
|
|
|
- this.purchaseManList.content[this.currentSayPriceIndex].active = false
|
|
|
- this.currentSayPriceIndex = -1
|
|
|
- },
|
|
|
- resetList: function () {
|
|
|
- this.currentSayPriceIndex = -1
|
|
|
- this.$store.dispatch('applyPurchase/loadPurchaseManList', {pageNumber: this.nowPage, pageSize: this.pageSize, keyword: this.keyWord, sorting: !this.sorting || JSON.stringify(this.sorting) === '{}' ? {releaseDate: 'DESC'} : this.sorting, enUU: this.user.data.enterprise ? this.user.data.enterprise.uu : null})
|
|
|
- },
|
|
|
- searchList: function () {
|
|
|
- this.nowPage = 1
|
|
|
- this.resetList()
|
|
|
- },
|
|
|
- sayPriceStop: function () {
|
|
|
- this.$message.error('该求购已截止')
|
|
|
- },
|
|
|
- sayPriceSeft: function () {
|
|
|
- this.$message.error('此为贵公司的求购')
|
|
|
- },
|
|
|
- sortListByParam: function (param) {
|
|
|
- if (this.sorting[param]) {
|
|
|
- if (this.sorting[param] === 'ASC') {
|
|
|
- this.$set(this.sorting, param, 'DESC')
|
|
|
+ })
|
|
|
+ this.copyurl(index)
|
|
|
+ },
|
|
|
+ setShowShare: function(flag, index, id) {
|
|
|
+ clearTimeout(this.Timer[index] ? this.Timer[index] : '')
|
|
|
+ this.$refs.sharescancode[index].style.display = 'block'
|
|
|
+ this.$refs.purchaseManList[index].onmouseout = () => {
|
|
|
+ clearTimeout(this.Timer[index] ? this.Timer[index] : '')
|
|
|
+ this.Timer[index] = setTimeout(() => {
|
|
|
+ this.$refs.sharescancode[index].style.display = 'none'
|
|
|
+ }, 300)
|
|
|
+ }
|
|
|
+
|
|
|
+ this.loadQRcode(id, index)
|
|
|
+ this.showShare = flag
|
|
|
+ },
|
|
|
+ showShowShare(flag, index, id) {
|
|
|
+ clearTimeout(this.Timer[index] ? this.Timer[index] : '')
|
|
|
+ },
|
|
|
+ hideShowShare(flag, index, id) {
|
|
|
+ clearTimeout(this.Timer[index] ? this.Timer[index] : '')
|
|
|
+ this.Timer[index] = setTimeout(() => {
|
|
|
+ this.$refs.sharescancode[index].style.display = 'none'
|
|
|
+ }, 300)
|
|
|
+ },
|
|
|
+ setIndex: function(index) {
|
|
|
+ this.currentSayPriceIndex = index
|
|
|
+ },
|
|
|
+ getDay: function(timeStamp) {
|
|
|
+ return Math.floor(timeStamp / (1000 * 60 * 60 * 24))
|
|
|
+ },
|
|
|
+ getHours: function(timeStamp) {
|
|
|
+ return Math.floor((timeStamp / (1000 * 60 * 60)) % 24)
|
|
|
+ },
|
|
|
+ listenPage: function(page) {
|
|
|
+ this.nowPage = page
|
|
|
+ this.resetList()
|
|
|
+ },
|
|
|
+ sayPrice: function(purchaseMan, index) {
|
|
|
+ // let _this = this
|
|
|
+ // for (let i = 0; i < this.purchaseManList.content.length; i++) {
|
|
|
+ // _this.purchaseManList.content[i].active = false
|
|
|
+ // }
|
|
|
+ if (this.user.logged) {
|
|
|
+ if (this.user.data.enterprise.uu) {
|
|
|
+ if (
|
|
|
+ this.user.data.enterprise.isVendor &&
|
|
|
+ this.user.data.enterprise.isVendor !== '1690'
|
|
|
+ ) {
|
|
|
+ // this.resetSayPrice()
|
|
|
+ purchaseMan.active = true
|
|
|
+ this.currentSayPriceIndex = index
|
|
|
} else {
|
|
|
- this.$delete(this.sorting, param)
|
|
|
+ this.$message.error('抱歉，您需开通卖家功能才可报价')
|
|
|
}
|
|
|
} else {
|
|
|
- this.sorting = {}
|
|
|
- this.$set(this.sorting, param, 'ASC')
|
|
|
+ this.$message.error('个人账户暂不可报价')
|
|
|
}
|
|
|
- this.nowPage = 1
|
|
|
- this.resetList()
|
|
|
- },
|
|
|
- setLinkBoxIndex: function (index) {
|
|
|
- if (!this.user.logged) {
|
|
|
- this.$router.push('/auth/login?returnUrl=' + window.location.href)
|
|
|
+ } else {
|
|
|
+ this.$router.push('/auth/login?returnUrl=' + window.location.href)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ cancelSayPrice: function() {
|
|
|
+ this.purchaseManList.content[this.currentSayPriceIndex].active = false
|
|
|
+ this.currentSayPriceIndex = -1
|
|
|
+ },
|
|
|
+ resetList: function() {
|
|
|
+ this.currentSayPriceIndex = -1
|
|
|
+ this.$store.dispatch('applyPurchase/loadPurchaseManList', {
|
|
|
+ pageNumber: this.nowPage,
|
|
|
+ pageSize: this.pageSize,
|
|
|
+ keyword: this.keyWord,
|
|
|
+ sorting:
|
|
|
+ !this.sorting || JSON.stringify(this.sorting) === '{}'
|
|
|
+ ? { releaseDate: 'DESC' }
|
|
|
+ : this.sorting,
|
|
|
+ enUU: this.user.data.enterprise ? this.user.data.enterprise.uu : null
|
|
|
+ })
|
|
|
+ },
|
|
|
+ searchList: function() {
|
|
|
+ this.nowPage = 1
|
|
|
+ this.resetList()
|
|
|
+ },
|
|
|
+ sayPriceStop: function() {
|
|
|
+ this.$message.error('该求购已截止')
|
|
|
+ },
|
|
|
+ sayPriceSeft: function() {
|
|
|
+ this.$message.error('此为贵公司的求购')
|
|
|
+ },
|
|
|
+ sortListByParam: function(param) {
|
|
|
+ if (this.sorting[param]) {
|
|
|
+ if (this.sorting[param] === 'ASC') {
|
|
|
+ this.$set(this.sorting, param, 'DESC')
|
|
|
} else {
|
|
|
- this.linkBoxIndex = index
|
|
|
+ this.$delete(this.sorting, param)
|
|
|
}
|
|
|
+ } else {
|
|
|
+ this.sorting = {}
|
|
|
+ this.$set(this.sorting, param, 'ASC')
|
|
|
+ }
|
|
|
+ this.nowPage = 1
|
|
|
+ this.resetList()
|
|
|
+ },
|
|
|
+ setLinkBoxIndex: function(index) {
|
|
|
+ if (!this.user.logged) {
|
|
|
+ this.$router.push('/auth/login?returnUrl=' + window.location.href)
|
|
|
+ } else {
|
|
|
+ this.linkBoxIndex = index
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
- .apply-info {
|
|
|
- width: 1190px;
|
|
|
- margin: 0 auto;
|
|
|
- .apply-info-title {
|
|
|
- border-bottom: 1px solid #3975f4;
|
|
|
- >p {
|
|
|
+.apply-info {
|
|
|
+ width: 1190px;
|
|
|
+ margin: 0 auto;
|
|
|
+ .apply-info-title {
|
|
|
+ border-bottom: 1px solid #3975f4;
|
|
|
+ > p {
|
|
|
+ display: inline-block;
|
|
|
+ width: 156px;
|
|
|
+ height: 33px;
|
|
|
+ line-height: 33px;
|
|
|
+ color: #fff;
|
|
|
+ background: #3975f4;
|
|
|
+ font-size: 18px;
|
|
|
+ text-align: center;
|
|
|
+ border: {
|
|
|
+ top-left-radius: 3px;
|
|
|
+ top-right-radius: 3px;
|
|
|
+ }
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+ > span {
|
|
|
+ color: #999;
|
|
|
+ margin-left: 16px;
|
|
|
+ }
|
|
|
+ > div {
|
|
|
+ float: right;
|
|
|
+ height: 32px;
|
|
|
+ line-height: 32px;
|
|
|
+ > input {
|
|
|
+ width: 241px;
|
|
|
+ height: 32px;
|
|
|
+ line-height: 32px;
|
|
|
+ font-size: 13px;
|
|
|
+ border: {
|
|
|
+ top-right-radius: 0;
|
|
|
+ bottom-right-radius: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ > span {
|
|
|
display: inline-block;
|
|
|
- width: 156px;
|
|
|
- height: 33px;
|
|
|
- line-height: 33px;
|
|
|
+ width: 69px;
|
|
|
color: #fff;
|
|
|
background: #3975f4;
|
|
|
- font-size: 18px;
|
|
|
text-align: center;
|
|
|
+ margin: 0 6px 0 -1px;
|
|
|
+ /*vertical-align: middle;*/
|
|
|
border: {
|
|
|
- top-left-radius: 3px;
|
|
|
top-right-radius: 3px;
|
|
|
+ bottom-right-radius: 3px;
|
|
|
}
|
|
|
- margin: 0;
|
|
|
+ cursor: pointer;
|
|
|
}
|
|
|
- >span {
|
|
|
- color: #999;
|
|
|
- margin-left: 16px;
|
|
|
+ > a {
|
|
|
+ background: #ffa200;
|
|
|
+ color: #fff;
|
|
|
+ width: 79px;
|
|
|
+ border-radius: 3px;
|
|
|
+ text-align: center;
|
|
|
+ display: inline-block;
|
|
|
}
|
|
|
- >div {
|
|
|
- float: right;
|
|
|
- height: 32px;
|
|
|
- line-height: 32px;
|
|
|
- >input {
|
|
|
- width: 241px;
|
|
|
- height: 32px;
|
|
|
- line-height: 32px;
|
|
|
- font-size: 13px;
|
|
|
- border: {
|
|
|
- top-right-radius: 0;
|
|
|
- bottom-right-radius: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .apply-info-list {
|
|
|
+ > p {
|
|
|
+ background: #ededed;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ margin: 9px 0 0 0;
|
|
|
+ span {
|
|
|
+ display: inline-block;
|
|
|
+ text-align: center;
|
|
|
+ a {
|
|
|
+ i {
|
|
|
+ color: #333;
|
|
|
+ &.active {
|
|
|
+ color: #5078cb;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
- >span {
|
|
|
- display: inline-block;
|
|
|
- width: 69px;
|
|
|
- color: #fff;
|
|
|
- background: #3975f4;
|
|
|
- text-align: center;
|
|
|
- margin: 0 6px 0 -1px;
|
|
|
- /*vertical-align: middle;*/
|
|
|
- border: {
|
|
|
- top-right-radius: 3px;
|
|
|
- bottom-right-radius: 3px;
|
|
|
- }
|
|
|
- cursor: pointer;
|
|
|
+ &:nth-child(1) {
|
|
|
+ width: 186px;
|
|
|
}
|
|
|
- >a {
|
|
|
- background: #ffa200;
|
|
|
- color: #fff;
|
|
|
- width: 79px;
|
|
|
- border-radius: 3px;
|
|
|
- text-align: center;
|
|
|
- display: inline-block;
|
|
|
+ &:nth-child(2) {
|
|
|
+ width: 106px;
|
|
|
+ }
|
|
|
+ &:nth-child(3) {
|
|
|
+ width: 200px;
|
|
|
+ }
|
|
|
+ &:nth-child(4) {
|
|
|
+ width: 174px;
|
|
|
+ }
|
|
|
+ &:nth-child(5) {
|
|
|
+ width: 152px;
|
|
|
+ }
|
|
|
+ &:nth-child(6) {
|
|
|
+ width: 158px;
|
|
|
+ }
|
|
|
+ &:nth-child(7) {
|
|
|
+ width: 180px;
|
|
|
+ margin-left: 30px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .apply-info-list {
|
|
|
- >p {
|
|
|
- background: #ededed;
|
|
|
- height: 40px;
|
|
|
- line-height: 40px;
|
|
|
- margin: 9px 0 0 0;
|
|
|
- span {
|
|
|
+ > ul {
|
|
|
+ margin-bottom: 29px;
|
|
|
+ > li {
|
|
|
+ position: relative;
|
|
|
+ min-height: 61px;
|
|
|
+ line-height: 61px;
|
|
|
+ border: 1px solid #ededed;
|
|
|
+ > div {
|
|
|
+ overflow-x: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
display: inline-block;
|
|
|
text-align: center;
|
|
|
- a {
|
|
|
- i {
|
|
|
- color: #333;
|
|
|
- &.active {
|
|
|
- color: #5078cb;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ color: #3c3c3c;
|
|
|
+ vertical-align: middle;
|
|
|
&:nth-child(1) {
|
|
|
width: 186px;
|
|
|
}
|
|
|
@@ -354,185 +506,146 @@
|
|
|
}
|
|
|
&:nth-child(7) {
|
|
|
width: 180px;
|
|
|
- margin-left: 30px;
|
|
|
+ margin-left: 32px;
|
|
|
+ float: right;
|
|
|
}
|
|
|
- }
|
|
|
- }
|
|
|
- >ul {
|
|
|
- margin-bottom: 29px;
|
|
|
- > li {
|
|
|
- position: relative;
|
|
|
- min-height: 61px;
|
|
|
- line-height: 61px;
|
|
|
- border: 1px solid #ededed;
|
|
|
- >div {
|
|
|
- overflow-x: hidden;
|
|
|
- text-overflow: ellipsis;
|
|
|
- white-space: nowrap;
|
|
|
- display: inline-block;
|
|
|
- text-align: center;
|
|
|
- color: #3c3c3c;
|
|
|
- vertical-align: middle;
|
|
|
- &:nth-child(1) {
|
|
|
- width: 186px;
|
|
|
- }
|
|
|
- &:nth-child(2) {
|
|
|
- width: 106px;
|
|
|
- }
|
|
|
- &:nth-child(3) {
|
|
|
- width: 200px;
|
|
|
- }
|
|
|
- &:nth-child(4) {
|
|
|
- width: 174px;
|
|
|
- }
|
|
|
- &:nth-child(5) {
|
|
|
- width: 152px;
|
|
|
- }
|
|
|
- &:nth-child(6) {
|
|
|
- width: 158px;
|
|
|
+ &.date-content {
|
|
|
+ span {
|
|
|
+ &:first-child {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #666;
|
|
|
+ }
|
|
|
+ color: #f71026;
|
|
|
}
|
|
|
- &:nth-child(7) {
|
|
|
- width: 180px;
|
|
|
- margin-left: 32px;
|
|
|
- float: right;
|
|
|
+ i {
|
|
|
+ font-style: normal;
|
|
|
}
|
|
|
- &.date-content {
|
|
|
- span {
|
|
|
- &:first-child {
|
|
|
- font-size: 12px;
|
|
|
- color: #666;
|
|
|
- }
|
|
|
- color: #f71026;
|
|
|
- }
|
|
|
- i {
|
|
|
- font-style: normal;
|
|
|
+ }
|
|
|
+ &.number-content {
|
|
|
+ span {
|
|
|
+ color: #5392f9;
|
|
|
+ &.active {
|
|
|
+ color: #ff9a00;
|
|
|
}
|
|
|
}
|
|
|
- &.number-content {
|
|
|
- span {
|
|
|
- color: #5392f9;
|
|
|
- &.active {
|
|
|
- color: #ff9a00;
|
|
|
- }
|
|
|
- }
|
|
|
- >img {
|
|
|
- margin-bottom: 5px;
|
|
|
- margin-right: 2px;
|
|
|
- }
|
|
|
+ > img {
|
|
|
+ margin-bottom: 5px;
|
|
|
+ margin-right: 2px;
|
|
|
}
|
|
|
- &.btn-content {
|
|
|
- >div a {
|
|
|
- display: inline-block;
|
|
|
- width: 71px;
|
|
|
- height: 28px;
|
|
|
- line-height: 28px;
|
|
|
- color: #fff;
|
|
|
- background: #3c7cf5;
|
|
|
- border-radius: 3px;
|
|
|
- cursor: pointer;
|
|
|
- /* &:first-child {
|
|
|
+ }
|
|
|
+ &.btn-content {
|
|
|
+ > div a {
|
|
|
+ display: inline-block;
|
|
|
+ width: 71px;
|
|
|
+ height: 28px;
|
|
|
+ line-height: 28px;
|
|
|
+ color: #fff;
|
|
|
+ background: #3c7cf5;
|
|
|
+ border-radius: 3px;
|
|
|
+ cursor: pointer;
|
|
|
+ /* &:first-child {
|
|
|
background: #ffa200;
|
|
|
float: left;
|
|
|
margin-top: 19px;
|
|
|
}*/
|
|
|
+ }
|
|
|
+ .is-say-price {
|
|
|
+ display: inline-block;
|
|
|
+ color: #39ae05;
|
|
|
+ margin-left: 11px;
|
|
|
+ img {
|
|
|
+ margin-bottom: 2px;
|
|
|
}
|
|
|
- .is-say-price {
|
|
|
- display: inline-block;
|
|
|
- color: #39ae05;
|
|
|
- margin-left: 11px;
|
|
|
- img {
|
|
|
- margin-bottom: 2px;
|
|
|
+ .say-price-history {
|
|
|
+ position: absolute;
|
|
|
+ top: 53px;
|
|
|
+ right: 11px;
|
|
|
+ line-height: normal;
|
|
|
+ width: 198px;
|
|
|
+ height: 0;
|
|
|
+ background: #fff;
|
|
|
+ border: 1px solid #fab89a;
|
|
|
+ z-index: 1;
|
|
|
+ overflow: hidden;
|
|
|
+ transition: height 1s;
|
|
|
+ -moz-transition: height 1s; /* Firefox 4 */
|
|
|
+ -webkit-transition: height 1s; /* Safari 和 Chrome */
|
|
|
+ -o-transition: height 1s; /* Opera */
|
|
|
+ opacity: 0;
|
|
|
+ p {
|
|
|
+ color: #020202;
|
|
|
+ font-weight: bold;
|
|
|
+ margin: 0;
|
|
|
+ &.price-title {
|
|
|
+ background: #fee6db;
|
|
|
+ height: 28px;
|
|
|
+ line-height: 28px;
|
|
|
+ }
|
|
|
+ &.price-level {
|
|
|
+ margin: 6px 0;
|
|
|
+ text-align: left;
|
|
|
+ }
|
|
|
}
|
|
|
- .say-price-history {
|
|
|
- position: absolute;
|
|
|
- top: 53px;
|
|
|
- right: 11px;
|
|
|
- line-height: normal;
|
|
|
- width: 198px;
|
|
|
- height: 0;
|
|
|
- background: #fff;
|
|
|
- border: 1px solid #fab89a;
|
|
|
- z-index: 1;
|
|
|
- overflow: hidden;
|
|
|
- transition: height 1s;
|
|
|
- -moz-transition: height 1s; /* Firefox 4 */
|
|
|
- -webkit-transition: height 1s; /* Safari 和 Chrome */
|
|
|
- -o-transition: height 1s; /* Opera */
|
|
|
- opacity: 0;
|
|
|
- p {
|
|
|
- color: #020202;
|
|
|
- font-weight: bold;
|
|
|
- margin: 0;
|
|
|
- &.price-title {
|
|
|
- background: #fee6db;
|
|
|
- height: 28px;
|
|
|
- line-height: 28px;
|
|
|
+ > div {
|
|
|
+ padding: 9px 12px;
|
|
|
+ > div {
|
|
|
+ display: inline-block;
|
|
|
+ text-align: left;
|
|
|
+ &:nth-child(1) {
|
|
|
+ float: left;
|
|
|
}
|
|
|
- &.price-level {
|
|
|
- margin: 6px 0;
|
|
|
- text-align: left;
|
|
|
+ &:nth-child(2) {
|
|
|
+ margin-left: 32px;
|
|
|
}
|
|
|
- }
|
|
|
- > div {
|
|
|
- padding: 9px 12px;
|
|
|
- > div {
|
|
|
- display: inline-block;
|
|
|
- text-align: left;
|
|
|
- &:nth-child(1) {
|
|
|
- float: left;
|
|
|
+ span {
|
|
|
+ color: #020202;
|
|
|
+ margin: 0;
|
|
|
+ &.red-text {
|
|
|
+ color: #f62d37;
|
|
|
}
|
|
|
- &:nth-child(2) {
|
|
|
- margin-left: 32px;
|
|
|
+ }
|
|
|
+ &.pre-line {
|
|
|
+ display: block;
|
|
|
+ padding: 13px 0;
|
|
|
+ border-bottom: 1px dashed #fee6db;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ul {
|
|
|
+ li {
|
|
|
+ color: #333;
|
|
|
+ height: 22px;
|
|
|
+ line-height: 22px;
|
|
|
+ padding: 0 6px;
|
|
|
+ &:nth-child(odd) {
|
|
|
+ background: #f6f5f4;
|
|
|
}
|
|
|
span {
|
|
|
- color: #020202;
|
|
|
+ color: #333;
|
|
|
+ display: inline-block;
|
|
|
+ text-align: left;
|
|
|
+ width: 50%;
|
|
|
margin: 0;
|
|
|
- &.red-text {
|
|
|
- color: #f62d37;
|
|
|
- }
|
|
|
- }
|
|
|
- &.pre-line {
|
|
|
- display: block;
|
|
|
- padding: 13px 0;
|
|
|
- border-bottom: 1px dashed #fee6db;
|
|
|
}
|
|
|
- }
|
|
|
- ul {
|
|
|
- li {
|
|
|
- color: #333;
|
|
|
- height: 22px;
|
|
|
- line-height: 22px;
|
|
|
- padding: 0 6px;
|
|
|
- &:nth-child(odd) {
|
|
|
- background: #f6f5f4;
|
|
|
- }
|
|
|
+ &:last-child {
|
|
|
span {
|
|
|
- color: #333;
|
|
|
- display: inline-block;
|
|
|
- text-align: left;
|
|
|
- width: 50%;
|
|
|
- margin: 0;
|
|
|
- }
|
|
|
- &:last-child {
|
|
|
- span {
|
|
|
- color: #4290f7;
|
|
|
- }
|
|
|
+ color: #4290f7;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- &:hover {
|
|
|
- .say-price-history {
|
|
|
- opacity: 1;
|
|
|
- /* animation: expand 1s infinite;
|
|
|
+ }
|
|
|
+ &:hover {
|
|
|
+ .say-price-history {
|
|
|
+ opacity: 1;
|
|
|
+ /* animation: expand 1s infinite;
|
|
|
-webkit-animation: expand 1s infinite; !*Safari and Chrome*!
|
|
|
animation-iteration-count: 1;
|
|
|
-webkit-animation-iteration-count: 1;*/
|
|
|
- height: 210px;
|
|
|
- }
|
|
|
+ height: 210px;
|
|
|
}
|
|
|
- /* @keyframes expand {
|
|
|
+ }
|
|
|
+ /* @keyframes expand {
|
|
|
from {bottom: 58px}
|
|
|
to {bottom: auto}
|
|
|
}
|
|
|
@@ -540,217 +653,320 @@
|
|
|
from {bottom: 58px}
|
|
|
to {bottom: auto}
|
|
|
}*/
|
|
|
- }
|
|
|
}
|
|
|
}
|
|
|
- .expand-content {
|
|
|
- display: none;
|
|
|
+ &.sharecode {
|
|
|
position: absolute;
|
|
|
- top: 63px;
|
|
|
- justify-content: space-between;
|
|
|
- padding: 0 236px 0 36px;
|
|
|
- background: #fffbf0;
|
|
|
- height: 48px;
|
|
|
- line-height: 48px;
|
|
|
- color: #020202;
|
|
|
- div {
|
|
|
- display: inline-block;
|
|
|
- span {
|
|
|
- color: #f71026;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ height: 110px;
|
|
|
+ z-index: 99;
|
|
|
+ display: none;
|
|
|
+ .sharecodeR {
|
|
|
+ width: 4px;
|
|
|
+ height: 110px;
|
|
|
+ background: #4290f7;
|
|
|
+ float: right;
|
|
|
+ }
|
|
|
+ .sharecodeL {
|
|
|
+ float: right;
|
|
|
+ margin-right: 1px;
|
|
|
+ }
|
|
|
+ .sharecodeT {
|
|
|
+ padding-top: 5px;
|
|
|
+ margin-top: 2px;
|
|
|
+ width: 28px;
|
|
|
+ height: 68px;
|
|
|
+ background-color: #3c7cf5;
|
|
|
+ border-radius: 2px;
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 14px;
|
|
|
+ word-wrap: break-word;
|
|
|
+ white-space: pre-wrap;
|
|
|
+ line-height: 14px;
|
|
|
+ }
|
|
|
+ .sharecodeBtn {
|
|
|
+ width: 28px;
|
|
|
+ height: 28px;
|
|
|
+ margin-top: 4px;
|
|
|
+ &::after {
|
|
|
+ content: ' ';
|
|
|
+ clear: both;
|
|
|
+ display: inline;
|
|
|
+ visibility: hidden;
|
|
|
+ }
|
|
|
+ img {
|
|
|
+ float: left;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- &:hover {
|
|
|
- border-top: 1px solid #4290f7;
|
|
|
+ }
|
|
|
+ .expand-content {
|
|
|
+ display: none;
|
|
|
+ position: absolute;
|
|
|
+ top: 63px;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 0 236px 0 36px;
|
|
|
+ background: #fffbf0;
|
|
|
+ height: 48px;
|
|
|
+ line-height: 48px;
|
|
|
+ color: #020202;
|
|
|
+ div {
|
|
|
+ display: inline-block;
|
|
|
+ span {
|
|
|
+ color: #f71026;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .sharescancodekuang {
|
|
|
+ width: 100%;
|
|
|
+ height: 220px;
|
|
|
+ position: absolute;
|
|
|
+ top: 110px;
|
|
|
+ left: 0px;
|
|
|
+ background: rgba(0, 0, 0, 0);
|
|
|
+ }
|
|
|
+ .sharescancode {
|
|
|
+ position: absolute;
|
|
|
+ background: url('/images/mobile/@2x/purChase/codebg.png');
|
|
|
+ width: 248px;
|
|
|
+ height: 207px;
|
|
|
+ top: 0px;
|
|
|
+ right: 0px;
|
|
|
+ z-index: 98;
|
|
|
+ display: none;
|
|
|
+ line-height: 14px;
|
|
|
+ canvas {
|
|
|
+ display: block;
|
|
|
+ text-align: center;
|
|
|
+ margin: 0 auto;
|
|
|
+ line-height: 14px;
|
|
|
+ }
|
|
|
+ .title {
|
|
|
+ color: #3c7cf5;
|
|
|
+ font-size: 16px;
|
|
|
+ margin: 21px auto;
|
|
|
+ margin-bottom: 0px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 14px;
|
|
|
+ }
|
|
|
+ div input {
|
|
|
+ display: inline-block;
|
|
|
+ width: 140px;
|
|
|
+ overflow: hidden;
|
|
|
+ height: 35px;
|
|
|
+ vertical-align: middle;
|
|
|
+ margin-left: 14px;
|
|
|
+ line-height: 35px;
|
|
|
+ }
|
|
|
+ div span {
|
|
|
+ display: inline-block;
|
|
|
+ color: #fff;
|
|
|
+ background: #4290f7;
|
|
|
+ height: 36px;
|
|
|
+ line-height: 36px;
|
|
|
+ width: 70px;
|
|
|
+ font-style: normal;
|
|
|
+ vertical-align: middle;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &:hover {
|
|
|
+ border-top: 1px solid #4290f7;
|
|
|
+ border-left: 1px solid #4290f7;
|
|
|
+ border-right: 1px solid #4290f7;
|
|
|
+ .expand-content {
|
|
|
+ display: flex;
|
|
|
+ width: 1190px;
|
|
|
+ z-index: 1;
|
|
|
+ border-bottom: 1px solid #4290f7;
|
|
|
border-left: 1px solid #4290f7;
|
|
|
border-right: 1px solid #4290f7;
|
|
|
- .expand-content {
|
|
|
- display: flex;
|
|
|
- width: 1190px;
|
|
|
- z-index: 1;
|
|
|
- border-bottom: 1px solid #4290f7;
|
|
|
- border-left: 1px solid #4290f7;
|
|
|
- border-right: 1px solid #4290f7;
|
|
|
- left: -1px;
|
|
|
- }
|
|
|
+ left: -1px;
|
|
|
+ }
|
|
|
+ .sharecode {
|
|
|
+ display: block;
|
|
|
}
|
|
|
- .say-price {
|
|
|
- background-color: #e7eef9;
|
|
|
+ }
|
|
|
+ .say-price {
|
|
|
+ background-color: #e7eef9;
|
|
|
+ height: 64px;
|
|
|
+ line-height: 64px;
|
|
|
+ display: none;
|
|
|
+ > div {
|
|
|
+ display: inline-block;
|
|
|
+ position: relative;
|
|
|
height: 64px;
|
|
|
line-height: 64px;
|
|
|
- display: none;
|
|
|
- >div {
|
|
|
- display: inline-block;
|
|
|
- position: relative;
|
|
|
- height: 64px;
|
|
|
- line-height: 64px;
|
|
|
+ input {
|
|
|
+ border-radius: 3px;
|
|
|
+ }
|
|
|
+ &:nth-child(1) {
|
|
|
+ width: 282px;
|
|
|
+ background: url('/images/applyPurchase/say-price.png')no-repeat;
|
|
|
+ text-align: center;
|
|
|
+ margin-right: 44px;
|
|
|
+ }
|
|
|
+ &:nth-child(2) {
|
|
|
+ margin-right: 39px;
|
|
|
input {
|
|
|
- border-radius: 3px;
|
|
|
- }
|
|
|
- &:nth-child(1) {
|
|
|
- width: 282px;
|
|
|
- background: url('/images/applyPurchase/say-price.png')no-repeat;
|
|
|
- text-align: center;
|
|
|
- margin-right: 44px;
|
|
|
+ width: 118px;
|
|
|
+ height: 26px;
|
|
|
+ border: 1px solid #5392f9;
|
|
|
}
|
|
|
- &:nth-child(2) {
|
|
|
- margin-right: 39px;
|
|
|
- input {
|
|
|
- width: 118px;
|
|
|
- height: 26px;
|
|
|
- border: 1px solid #5392f9;
|
|
|
+ select {
|
|
|
+ position: absolute;
|
|
|
+ top: 19px;
|
|
|
+ width: 32px;
|
|
|
+ height: 26px;
|
|
|
+ background: url('/images/applyPurchase/arrow-down.png')no-repeat
|
|
|
+ right center;
|
|
|
+ -webkit-box-shadow: none;
|
|
|
+ -moz-box-shadow: none;
|
|
|
+ box-shadow: none;
|
|
|
+ border: {
|
|
|
+ left: none;
|
|
|
+ top: none;
|
|
|
+ bottom: none;
|
|
|
+ right: 1px solid #5392f9;
|
|
|
+ bottom-left-radius: 4px;
|
|
|
+ top-left-radius: 4px;
|
|
|
}
|
|
|
- select {
|
|
|
- position: absolute;
|
|
|
- top: 19px;
|
|
|
- width: 32px;
|
|
|
- height: 26px;
|
|
|
- background: url('/images/applyPurchase/arrow-down.png')no-repeat right center;
|
|
|
- -webkit-box-shadow: none;
|
|
|
- -moz-box-shadow: none;
|
|
|
- box-shadow: none;
|
|
|
- border: {
|
|
|
- left: none;
|
|
|
- top: none;
|
|
|
- bottom: none;
|
|
|
- right: 1px solid #5392f9;
|
|
|
- bottom-left-radius: 4px;
|
|
|
- top-left-radius: 4px;
|
|
|
- }
|
|
|
- color: #5392f9;
|
|
|
- font: small-caption;
|
|
|
- padding-left: 8px;
|
|
|
- & + input {
|
|
|
- padding-left: 34px;
|
|
|
- }
|
|
|
- }
|
|
|
- div {
|
|
|
- position: absolute;
|
|
|
- top: 19px;
|
|
|
- left: 38px;
|
|
|
- width: 32px;
|
|
|
- height: 26px;
|
|
|
- line-height: 26px;
|
|
|
- text-align: center;
|
|
|
- border: {
|
|
|
- left: none;
|
|
|
- top: none;
|
|
|
- bottom: none;
|
|
|
- right: 1px solid #5392f9;
|
|
|
- bottom-left-radius: 4px;
|
|
|
- top-left-radius: 4px;
|
|
|
- }
|
|
|
- color: #5392f9;
|
|
|
- & + input {
|
|
|
- padding-left: 34px;
|
|
|
- }
|
|
|
+ color: #5392f9;
|
|
|
+ font: small-caption;
|
|
|
+ padding-left: 8px;
|
|
|
+ & + input {
|
|
|
+ padding-left: 34px;
|
|
|
}
|
|
|
}
|
|
|
- &:nth-child(3) {
|
|
|
- margin-right: 37px;
|
|
|
- input {
|
|
|
- width: 32px;
|
|
|
- height: 26px;
|
|
|
- padding: 0 0 0 6px;
|
|
|
+ div {
|
|
|
+ position: absolute;
|
|
|
+ top: 19px;
|
|
|
+ left: 38px;
|
|
|
+ width: 32px;
|
|
|
+ height: 26px;
|
|
|
+ line-height: 26px;
|
|
|
+ text-align: center;
|
|
|
+ border: {
|
|
|
+ left: none;
|
|
|
+ top: none;
|
|
|
+ bottom: none;
|
|
|
+ right: 1px solid #5392f9;
|
|
|
+ bottom-left-radius: 4px;
|
|
|
+ top-left-radius: 4px;
|
|
|
}
|
|
|
- }
|
|
|
- &:nth-child(4) {
|
|
|
- margin-right: 132px;
|
|
|
- input {
|
|
|
- width: 118px;
|
|
|
- height: 26px;
|
|
|
+ color: #5392f9;
|
|
|
+ & + input {
|
|
|
+ padding-left: 34px;
|
|
|
}
|
|
|
}
|
|
|
- &:nth-child(5) {
|
|
|
- span {
|
|
|
- width: 71px;
|
|
|
- height: 28px;
|
|
|
- line-height: 28px;
|
|
|
- text-align: center;
|
|
|
- display: inline-block;
|
|
|
- cursor: pointer;
|
|
|
- &:first-child {
|
|
|
- background: #dedddd;
|
|
|
- margin-right: 10px;
|
|
|
- }
|
|
|
- &:last-child {
|
|
|
- background: #fa4701;
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
- }
|
|
|
+ }
|
|
|
+ &:nth-child(3) {
|
|
|
+ margin-right: 37px;
|
|
|
+ input {
|
|
|
+ width: 32px;
|
|
|
+ height: 26px;
|
|
|
+ padding: 0 0 0 6px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &:nth-child(4) {
|
|
|
+ margin-right: 132px;
|
|
|
+ input {
|
|
|
+ width: 118px;
|
|
|
+ height: 26px;
|
|
|
}
|
|
|
- i {
|
|
|
- color: #e41515;
|
|
|
- position: relative;
|
|
|
- top: 2px;
|
|
|
- right: 3px;
|
|
|
+ }
|
|
|
+ &:nth-child(5) {
|
|
|
+ span {
|
|
|
+ width: 71px;
|
|
|
+ height: 28px;
|
|
|
+ line-height: 28px;
|
|
|
+ text-align: center;
|
|
|
+ display: inline-block;
|
|
|
+ cursor: pointer;
|
|
|
+ &:first-child {
|
|
|
+ background: #dedddd;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+ &:last-child {
|
|
|
+ background: #fa4701;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
+ i {
|
|
|
+ color: #e41515;
|
|
|
+ position: relative;
|
|
|
+ top: 2px;
|
|
|
+ right: 3px;
|
|
|
+ }
|
|
|
}
|
|
|
- &.active {
|
|
|
+ }
|
|
|
+ &.active {
|
|
|
+ border: 1px solid #4290f7;
|
|
|
+ .expand-content {
|
|
|
+ display: flex;
|
|
|
+ width: 1190px;
|
|
|
+ z-index: 1;
|
|
|
border: 1px solid #4290f7;
|
|
|
- .expand-content {
|
|
|
- display: flex;
|
|
|
- width: 1190px;
|
|
|
- z-index: 1;
|
|
|
- border: 1px solid #4290f7;
|
|
|
- left: -1px;
|
|
|
- border-top: none;
|
|
|
- }
|
|
|
- /*.say-price {*/
|
|
|
- /*display: block;*/
|
|
|
- /*}*/
|
|
|
+ left: -1px;
|
|
|
+ border-top: none;
|
|
|
}
|
|
|
+ /*.say-price {*/
|
|
|
+ /*display: block;*/
|
|
|
+ /*}*/
|
|
|
}
|
|
|
}
|
|
|
- .empty{
|
|
|
- text-align: center;
|
|
|
- height: 200px;
|
|
|
- line-height: 200px;
|
|
|
- border: 1px solid #e8e8e8;
|
|
|
- margin-bottom: 10px;
|
|
|
- span {
|
|
|
- color: #999;
|
|
|
- margin-left: 10px;
|
|
|
- }
|
|
|
+ }
|
|
|
+ .empty {
|
|
|
+ text-align: center;
|
|
|
+ height: 200px;
|
|
|
+ line-height: 200px;
|
|
|
+ border: 1px solid #e8e8e8;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ span {
|
|
|
+ color: #999;
|
|
|
+ margin-left: 10px;
|
|
|
}
|
|
|
}
|
|
|
- .page-wrap {
|
|
|
- text-align: right;
|
|
|
- float: none;
|
|
|
+ }
|
|
|
+ .page-wrap {
|
|
|
+ text-align: right;
|
|
|
+ float: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .link-saler-box {
|
|
|
+ width: 289px;
|
|
|
+ height: auto;
|
|
|
+ min-height: auto;
|
|
|
+ border-radius: 2px;
|
|
|
+ .title {
|
|
|
+ background-color: #4290f7;
|
|
|
+ height: 22px;
|
|
|
+ line-height: 22px;
|
|
|
+ margin-bottom: 20px;
|
|
|
}
|
|
|
- .link-saler-box {
|
|
|
- width: 289px;
|
|
|
- height: auto;
|
|
|
- min-height: auto;
|
|
|
- border-radius: 2px;
|
|
|
- .title {
|
|
|
- background-color: #4290f7;
|
|
|
- height: 22px;
|
|
|
- line-height: 22px;
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
- .content {
|
|
|
- p {
|
|
|
- line-height: 20px;
|
|
|
- padding-top: 0;
|
|
|
- i {
|
|
|
- color: #4290f7;
|
|
|
- margin-right: 4px;
|
|
|
- }
|
|
|
- span {
|
|
|
- color: #f62d37;
|
|
|
- }
|
|
|
+ .content {
|
|
|
+ p {
|
|
|
+ line-height: 20px;
|
|
|
+ padding-top: 0;
|
|
|
+ i {
|
|
|
+ color: #4290f7;
|
|
|
+ margin-right: 4px;
|
|
|
}
|
|
|
- div {
|
|
|
- a {
|
|
|
- width: 78px;
|
|
|
- background: #4290f7;
|
|
|
- margin: 18px 0 13px 0;
|
|
|
- border-radius: 2px;
|
|
|
- }
|
|
|
+ span {
|
|
|
+ color: #f62d37;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ div {
|
|
|
+ a {
|
|
|
+ width: 78px;
|
|
|
+ background: #4290f7;
|
|
|
+ margin: 18px 0 13px 0;
|
|
|
+ border-radius: 2px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</style>
|
shenjj@usoftchina.com
