|
|
@@ -0,0 +1,685 @@
|
|
|
+<template>
|
|
|
+ <div class="productDetails">
|
|
|
+ <div class="product">
|
|
|
+ <div class="over top clearfix">
|
|
|
+ <div class="icon" :class="chooseItem.standard ? 'standed' : 'istanded'"></div>
|
|
|
+ <div class="text">
|
|
|
+ {{chooseItem.code}}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="over list">
|
|
|
+ <span class="name">品牌:</span>
|
|
|
+ <span>{{chooseItem.brandNameEn}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="over list">
|
|
|
+ <span class="name">类目(产品名称):</span>
|
|
|
+ <span>{{chooseItem.kindNameCn}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="over list clearfix">
|
|
|
+ <div class="pull-left">
|
|
|
+ <span class="name">型号:</span>
|
|
|
+ <span>{{chooseItem.code}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="pull-right">
|
|
|
+ <span class="name">可拆卖:</span>
|
|
|
+ <div class="progress-wrapper" :class="{active: chooseItem.breakUp}" @click="changeBreakUp()">
|
|
|
+ <div class="progress-btn"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="list clearfix">
|
|
|
+ <div class="pull-left">
|
|
|
+ <span class="name">规格:</span>
|
|
|
+ <div class="specInput input">
|
|
|
+ <input type="text" placeholder="请输入规格" v-model="chooseItem.spec" maxlength="40"/>
|
|
|
+ <img src="/images/mobile/product/close_icon.png" @click="deleteText('spec')"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="pull-right">
|
|
|
+ <span class="name">库存:</span>
|
|
|
+ <input type="tel" placeholder="1" v-model="chooseItem.reserve" class="input reserveInput" maxlength="9" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="list clearfix">
|
|
|
+ <div class="pull-left">
|
|
|
+ <span class="name">包装:</span>
|
|
|
+ <div class="selectInput" @click="showdropmenu('pack')">
|
|
|
+ <span>{{chooseItem.packaging || '无包装信息'}}</span>
|
|
|
+ <img src="/images/mobile/product/drop_icon.png"/>
|
|
|
+ <ul :class="{active : showDrop === 'pack' }">
|
|
|
+ <li v-for="item in packObj" @click.stop="choosePack(item)">{{item}}</li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="pull-right">
|
|
|
+ <span class="name">生产日期:</span>
|
|
|
+ <input type="text" placeholder="2018-02-05" v-model="chooseItem.produceDate" class="input dateInput" maxlength="10" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="list clearfix">
|
|
|
+ <div class="pull-left">
|
|
|
+ <span class="name">最小包装数:</span>
|
|
|
+ <input type="tel" placeholder="请输入最小包装数" v-model="chooseItem.minPackQty" class="input minPackQtyInput" maxlength="6" @blur="minBuyQtyBlur()"/>
|
|
|
+ </div>
|
|
|
+ <div class="pull-right">
|
|
|
+ <span class="name">最小起订量:</span>
|
|
|
+ <input type="tel" placeholder="请输入最小起订量" v-model="chooseItem.minBuyQty" class="input minBuyQtyInput" maxlength="6" @blur="minBuyQtyBlur()" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="list clearfix">
|
|
|
+ <div class="pull-left">
|
|
|
+ <span class="name">销售方式:</span>
|
|
|
+ <div class="selectInput selectInput2" @click="showdropmenu('store')">
|
|
|
+ <span v-if="chooseItem.storeInfoOms">{{chooseItem.storeInfoOms}}</span>
|
|
|
+ <span v-else>{{chooseItem.storeid === '33069557578d44e69bd91ad12d28a8d4' ? '寄售' : '自营'}}</span>
|
|
|
+ <img src="/images/mobile/product/drop_icon.png"/>
|
|
|
+ <ul :class="{active : showDrop === 'store' }">
|
|
|
+ <li v-for="item in storeObj" @click.stop="chooseStore(item)">{{item}}</li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="pull-right">
|
|
|
+ <span class="name">交期:</span>
|
|
|
+ <input type="tel" placeholder="天数" v-model="chooseItem.minDelivery" class="input startInput" maxlength="3" @blur="minDeliveryBlur()" />
|
|
|
+ -
|
|
|
+ <input type="tel" placeholder="天数" v-model="chooseItem.maxDelivery" class="input endInput" maxlength="3" @blur="minDeliveryBlur()"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="list" style="border-bottom: 0px">
|
|
|
+ <span class="name">自定义标签:</span>
|
|
|
+ <div class="labelInput input">
|
|
|
+ <input type="text" v-model="chooseItem.tag" placeholder="请输入标签名字" maxlength="20"/>
|
|
|
+ <img src="/images/mobile/product/close_icon.png" @click="deleteText('label')" @blur="tagBlur()"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="pscList-top clearfix">
|
|
|
+ <div class="pull-left">梯度/pcs</div>
|
|
|
+ <div class="pull-right">单价</div>
|
|
|
+ </div>
|
|
|
+ <ul class="prices">
|
|
|
+ <li v-for="(item, index) in chooseItem.prices" v-bind:key="index">
|
|
|
+ <div class="clearfix">
|
|
|
+ <div class="pull-left">
|
|
|
+ <input type="number" placeholder="数量" class="otherNumber" v-model.lazy="item.start" :disabled="index === 0" :readonly="index === 0" @blur="startpriceBlur(item, index)" maxlength="9"/>
|
|
|
+ <label v-if="index !== chooseItem.prices.length - 1">-</label>
|
|
|
+ <label v-if="index === chooseItem.prices.length - 1">以上</label>
|
|
|
+ <input type="number" placeholder="数量" class="otherNumber" v-model.lazy="item.end" v-if="index !== chooseItem.prices.length - 1" @blur="endpriceBlur(item, index)" maxlength="9"/>
|
|
|
+ </div>
|
|
|
+ <div class="pull-right">
|
|
|
+ <template v-if="chooseItem.currencyName == 'RMB'">
|
|
|
+ <input class="priceM" type="tel" placeholder="单价(¥)" v-model="item.rMBPrice" @blur="rMBPriceBlur(item)"/>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <input class="priceM" type="tel" placeholder="单价($)" v-model="item.rMBPrice" @blur="rMBPriceBlur(item)"/>
|
|
|
+ </template>
|
|
|
+ <span @click="miuPrice(index)"><img src="/images/mobile/product/mui_icon.png"/></span>
|
|
|
+ <span @click="addPrice()"><img src="/images/mobile/product/add_icon.png"/></span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <div class="button clearfix">
|
|
|
+ <div class="save pull-left" @click="save()">保存</div>
|
|
|
+ <div class="cancel pull-right" @click="goLastPage()">取消</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="GetchooseItem && false"></div>
|
|
|
+ <remind-box :title="collectResult" :timeoutCount="timeoutCount"></remind-box>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ function deepCopy(target) {
|
|
|
+ if (typeof target !== 'object') return
|
|
|
+ // 判断目标类型，来创建返回值
|
|
|
+ var newObj = target instanceof Array ? [] : {}
|
|
|
+ for (var item in target) {
|
|
|
+ // 只复制元素自身的属性，不复制原型链上的
|
|
|
+ if (target.hasOwnProperty(item)) {
|
|
|
+ newObj[item] = typeof target[item] === 'object' ? deepCopy(target[item]) : target[item]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return newObj
|
|
|
+ }
|
|
|
+ import { RemindBox } from '~components/mobile/common'
|
|
|
+ export default {
|
|
|
+ name: 'productDetails',
|
|
|
+ layout: 'mobile',
|
|
|
+ components: {
|
|
|
+ RemindBox
|
|
|
+ },
|
|
|
+ // middleware: 'authenticated',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ collectResult: '',
|
|
|
+ timeoutCount: 0,
|
|
|
+ specinput: '',
|
|
|
+ timedate: '',
|
|
|
+ chooseItem: {},
|
|
|
+ showDrop: '',
|
|
|
+ storeObj: ['寄售', '自营'],
|
|
|
+ packObj: ['Bulk-散装', 'Reel-卷装', 'Tape/Reel-编带', 'Tray-盘装', 'Tube-管装', '盒装', '袋装', '罐装', '瓶装', '桶装', '箱装', '其他']
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ GetchooseItem() {
|
|
|
+ this.chooseItem = deepCopy(this.$store.state.product.brand.onSaleDetails.data)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ changeBreakUp() {
|
|
|
+ this.chooseItem.breakUp = !this.chooseItem.breakUp
|
|
|
+ this.minBuyQtyBlur()
|
|
|
+ },
|
|
|
+ showdropmenu(str) {
|
|
|
+ this.showDrop = str
|
|
|
+ },
|
|
|
+ // 选择销售方式
|
|
|
+ chooseStore(item) {
|
|
|
+ this.chooseItem.storeInfoOms = item
|
|
|
+ this.showDrop = ''
|
|
|
+ },
|
|
|
+ // 选择包装
|
|
|
+ choosePack(item) {
|
|
|
+ this.showDrop = ''
|
|
|
+ this.chooseItem.packaging = item
|
|
|
+ },
|
|
|
+ // 清空规格
|
|
|
+ deleteText(ty) {
|
|
|
+ if (ty === 'spec') {
|
|
|
+ this.chooseItem.spec = ''
|
|
|
+ } else {
|
|
|
+ this.chooseItem.tag = ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 最低起订量失去焦点操作
|
|
|
+ minBuyQtyBlur() {
|
|
|
+ if (this.chooseItem.minPackQty <= 0) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '包装数必须是大于0的整数'
|
|
|
+ this.chooseItem.minPackQty = 1
|
|
|
+ } else if (this.chooseItem.minBuyQty <= 0) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '起订量必须是大于0的整数'
|
|
|
+ this.chooseItem.minBuyQty = 1
|
|
|
+ } else if (!this.chooseItem.breakUp && this.chooseItem.minBuyQty % this.chooseItem.minPackQty !== 0) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '不可拆卖时，起订量必须是包装数量的倍数'
|
|
|
+ if (this.chooseItem.minPackQty > this.chooseItem.minBuyQty) {
|
|
|
+ this.chooseItem.minBuyQty = this.chooseItem.minPackQty
|
|
|
+ } else {
|
|
|
+ this.chooseItem.minBuyQty = this.chooseItem.minBuyQty - this.chooseItem.minBuyQty % this.chooseItem.minPackQty
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.chooseItem.prices[0].start = this.chooseItem.minBuyQty
|
|
|
+ },
|
|
|
+ // 自定义标签失去焦点操作
|
|
|
+ tagBlur() {
|
|
|
+ if (!this.chooseItem.tag) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '自定义标签不能为空'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ addPrice() {
|
|
|
+ if (this.chooseItem.prices.length === 3) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '批次最多只能有三个分段'
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ let copy = Object.assign({}, this.chooseItem.prices[this.chooseItem.prices.length - 1], {
|
|
|
+ end: ''
|
|
|
+ })
|
|
|
+ this.chooseItem.prices[this.chooseItem.prices.length - 1] = copy
|
|
|
+ this.chooseItem.prices.push({
|
|
|
+ end: '',
|
|
|
+ rMBNTPrice: '',
|
|
|
+ rMBPrice: '',
|
|
|
+ start: ''
|
|
|
+ })
|
|
|
+ },
|
|
|
+ miuPrice(index) {
|
|
|
+ if (index === 0) {
|
|
|
+ if (this.chooseItem.prices.length === 3) {
|
|
|
+ this.chooseItem.prices[0].rMBPrice = this.chooseItem.prices[1].rMBPrice
|
|
|
+ this.chooseItem.prices[0].end = this.chooseItem.prices[1].end
|
|
|
+ this.chooseItem.prices[1].start = this.chooseItem.prices[2].start
|
|
|
+ this.chooseItem.prices[1].rMBPrice = this.chooseItem.prices[2].rMBPrice
|
|
|
+ this.chooseItem.prices[1].end = '9999999999'
|
|
|
+ this.chooseItem.prices.splice(2, 1)
|
|
|
+ } else {
|
|
|
+ index++
|
|
|
+ this.chooseItem.prices[0].rMBPrice = this.chooseItem.prices[1].rMBPrice
|
|
|
+ this.chooseItem.prices[0].end = '9999999999'
|
|
|
+ this.chooseItem.prices.splice(index, 1)
|
|
|
+ }
|
|
|
+ } else if (index === 1) {
|
|
|
+ if (this.chooseItem.prices.length === 3) {
|
|
|
+ this.chooseItem.prices[1].rMBPrice = this.chooseItem.prices[2].rMBPrice
|
|
|
+ this.chooseItem.prices[1].end = '9999999999'
|
|
|
+ this.chooseItem.prices.splice(2, 1)
|
|
|
+ } else {
|
|
|
+ this.chooseItem.prices[0].end = '9999999999'
|
|
|
+ this.chooseItem.prices.splice(index, 1)
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.chooseItem.prices[1].end = '9999999999'
|
|
|
+ this.chooseItem.prices.splice(index, 1)
|
|
|
+ }
|
|
|
+ console.log(this.chooseItem.prices)
|
|
|
+ },
|
|
|
+ // 开始价格阶段失去焦点
|
|
|
+ startpriceBlur(item, index) {
|
|
|
+ if (index > 0) {
|
|
|
+ if (item.start <= this.chooseItem.prices[index - 1].start) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '输入值会导致梯度重叠，请重新修改'
|
|
|
+ item.start = ''
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ if (index === 2) {
|
|
|
+ this.chooseItem.prices[index - 1].end = item.start - 1
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ if (item.start > item.end) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = `输入值必须小于${item.end}`
|
|
|
+ item.start = ''
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ this.chooseItem.prices[index - 1].end = item.start - 1
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 结束价格阶段失去焦点
|
|
|
+ endpriceBlur(item, index) {
|
|
|
+ if (Math.abs(item.end) + 1 >= this.chooseItem.prices[index + 1].end) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = `输入值不能大于${this.chooseItem.prices[index + 1].end - 1}`
|
|
|
+ item.end = ''
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ this.chooseItem.prices[index + 1].start = Math.abs(item.end) + 1
|
|
|
+ },
|
|
|
+ // 交期失去焦点
|
|
|
+ minDeliveryBlur() {
|
|
|
+ if (this.chooseItem.minDelivery > this.chooseItem.maxDelivery) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = `最短交期应小于等于最长交期`
|
|
|
+ this.chooseItem.maxDelivery = ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 单价失去焦点
|
|
|
+ rMBPriceBlur(item) {
|
|
|
+ if (!/^[0-9]+([.]{1}[1-9]{1,6})?$/.test(item.rMBPrice)) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '单价只能输入数字'
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ item.rMBPrice = item.rMBPrice.toString()
|
|
|
+ let splits = item.rMBPrice.split('.')
|
|
|
+ if (splits[0].length >= 4) {
|
|
|
+ splits[0] = splits[0].substr(0, 4)
|
|
|
+ item.rMBPrice = splits[0]
|
|
|
+ }
|
|
|
+ if (splits[1]) {
|
|
|
+ item.rMBPrice = splits[0] + splits[1]
|
|
|
+ }
|
|
|
+ if (splits[1] && splits[1].length >= 6) {
|
|
|
+ splits[1] = splits[0].substr(0, 6)
|
|
|
+ item.rMBPrice = splits[0] + splits[1]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 保存
|
|
|
+ save() {
|
|
|
+ if (!this.chooseItem.reserve) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '库存'
|
|
|
+ return false
|
|
|
+ } else if (!this.chooseItem.tag) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '自定义标签不能为空'
|
|
|
+ return false
|
|
|
+ } else if (!this.chooseItem.produceDate) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '请填写生产日期'
|
|
|
+ return false
|
|
|
+ } else if (!/^\d{4}[-/]\d{2}[-/]\d{2}$/.test(this.chooseItem.produceDate)) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '请输入正确的生产日期'
|
|
|
+ return false
|
|
|
+ } else {
|
|
|
+ let isHas = false
|
|
|
+ for (let i = 0; i < this.chooseItem.prices.length; i++) {
|
|
|
+ if (!this.chooseItem.prices[i].start || !this.chooseItem.prices[i].end) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '分段数量必须填写'
|
|
|
+ isHas = true
|
|
|
+ break
|
|
|
+ } else if (Math.abs(this.chooseItem.prices[i].start) > Math.abs(this.chooseItem.prices[i].end)) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '存在分段的起始值大于分段的结束值'
|
|
|
+ isHas = true
|
|
|
+ break
|
|
|
+ } else if (Math.abs(this.chooseItem.prices[i].rMBPrice) <= 0) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '单价必须是大于0的数字'
|
|
|
+ isHas = true
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (isHas === true) {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (this.chooseItem.storeid === '33069557578d44e69bd91ad12d28a8d4') {
|
|
|
+ this.chooseItem.selfSale = 1
|
|
|
+ } else {
|
|
|
+ this.chooseItem.selfSale = 2
|
|
|
+ }
|
|
|
+ this.$http.put('/trade/goods', this.chooseItem).then(res => {
|
|
|
+ if (res.data.success) {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = '保存成功'
|
|
|
+ setTimeout(() => {
|
|
|
+ this.goLastPage()
|
|
|
+ }, 300)
|
|
|
+ } else {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = res.data.message
|
|
|
+ }
|
|
|
+ }, err => {
|
|
|
+ this.timeoutCount++
|
|
|
+ this.collectResult = err.response.data
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .productDetails {
|
|
|
+ background: #fff;
|
|
|
+ margin: .2rem 0.2rem 0;
|
|
|
+ padding: 0.9rem 0 1.2rem 0;
|
|
|
+ .product {
|
|
|
+ /*background: #fff;*/
|
|
|
+ /*margin: .2rem 0.2rem 0;*/
|
|
|
+ /*padding-bottom: 0.3rem;*/
|
|
|
+ /*max-height: 8rem;*/
|
|
|
+ /*overflow-y: auto;*/
|
|
|
+ .top {
|
|
|
+ height: 0.88rem;
|
|
|
+ line-height: 0.88rem;
|
|
|
+ border-bottom: 1px solid #d3d3d3;
|
|
|
+ margin: 0 0.24rem;
|
|
|
+ .icon {
|
|
|
+ width: 0.6rem;
|
|
|
+ height: 0.36rem;
|
|
|
+ line-height: 0.36rem;
|
|
|
+ margin-top: 0.27rem;
|
|
|
+ float: left;
|
|
|
+ background-size: 100%;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ margin-right: 0.12rem;
|
|
|
+ text-align: center;
|
|
|
+ &.istanded{
|
|
|
+ background-image: url('/images/mobile/@2x/istanded.png')
|
|
|
+ }
|
|
|
+ &.standed{
|
|
|
+ background-image: url('/images/mobile/@2x/standed.png')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .text {
|
|
|
+ font-size: 0.28rem;
|
|
|
+ color: #1a58dd;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .list {
|
|
|
+ &.over {
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+ font-size: 0.28rem;
|
|
|
+ color: #333;
|
|
|
+ margin: 0 0.2rem 0;
|
|
|
+ border-bottom: 1px dotted #d3d3d3;
|
|
|
+ line-height: 0.84rem;
|
|
|
+ height: 0.84rem;
|
|
|
+ span.name {
|
|
|
+ color: #666;
|
|
|
+ margin-right: 0.1rem;
|
|
|
+ }
|
|
|
+ .pull-left {
|
|
|
+ width: 50%;
|
|
|
+ }
|
|
|
+ .progress-wrapper {
|
|
|
+ width: .68rem;
|
|
|
+ height: .32rem;
|
|
|
+ border-radius: 0.32rem;
|
|
|
+ position: relative;
|
|
|
+ display: inline-block;
|
|
|
+ vertical-align: top;
|
|
|
+ margin-left: 0.3rem;
|
|
|
+ margin-top: 0.26rem;
|
|
|
+ background: #f1f3f7;
|
|
|
+ .progress-btn {
|
|
|
+ position: absolute;
|
|
|
+ height: 0.28rem;
|
|
|
+ width: 0.28rem;
|
|
|
+ border-radius: 50%;
|
|
|
+ left: 0.01rem;
|
|
|
+ top: 0.01rem;
|
|
|
+ background: #fff;
|
|
|
+ box-shadow: 0 0 5px #000;
|
|
|
+ }
|
|
|
+ &.active {
|
|
|
+ background: #22ac38;
|
|
|
+ .progress-btn {
|
|
|
+ left: 0.37rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .input {
|
|
|
+ height: 0.5rem;
|
|
|
+ line-height: 0.5rem;
|
|
|
+ margin-top: 0.16rem;
|
|
|
+ border: 1px solid #d2d2d2;
|
|
|
+ border-radius: 2px;
|
|
|
+ text-indent: .12rem;
|
|
|
+ }
|
|
|
+ .specInput {
|
|
|
+ vertical-align: top;
|
|
|
+ display: inline-block;
|
|
|
+ width: 2.4rem;
|
|
|
+ text-indent: 0;
|
|
|
+ input {
|
|
|
+ width: 2.02rem;
|
|
|
+ color: #999;
|
|
|
+ font-size: .24rem;
|
|
|
+ height: 0.46rem;
|
|
|
+ vertical-align: top;
|
|
|
+ text-indent: 0.12rem;
|
|
|
+ }
|
|
|
+ img {
|
|
|
+ width: 0.32rem;
|
|
|
+ height: 0.32rem;
|
|
|
+ vertical-align: top;
|
|
|
+ margin-top: 0.06rem;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .dateInput {
|
|
|
+ vertical-align: top;
|
|
|
+ display: inline-block;
|
|
|
+ width: 2rem;
|
|
|
+ }
|
|
|
+ .reserveInput {
|
|
|
+ width: 1.4rem;
|
|
|
+ }
|
|
|
+ .minBuyQtyInput {
|
|
|
+ width: 1.26rem;
|
|
|
+ }
|
|
|
+ .minPackQtyInput {
|
|
|
+ width: 1.56rem;
|
|
|
+ }
|
|
|
+ .startInput, .endInput {
|
|
|
+ text-indent: 0;
|
|
|
+ text-align: center;
|
|
|
+ width: 1rem;
|
|
|
+ }
|
|
|
+ .selectInput {
|
|
|
+ display: inline-block;
|
|
|
+ position: relative;
|
|
|
+ vertical-align: top;
|
|
|
+ height: 0.5rem;
|
|
|
+ line-height: 0.5rem;
|
|
|
+ margin-top: 0.18rem;
|
|
|
+ border: 1px solid #d2d2d2;
|
|
|
+ border-radius: 2px;
|
|
|
+ width: 2.4rem;
|
|
|
+ text-indent: 0.12rem;
|
|
|
+ img {
|
|
|
+ position: absolute;
|
|
|
+ width: 0.17rem;
|
|
|
+ height: 0.11rem;
|
|
|
+ right:0.1rem;
|
|
|
+ top: 0.17rem;
|
|
|
+ }
|
|
|
+ &.selectInput2 {
|
|
|
+ width: 1.56rem;
|
|
|
+ }
|
|
|
+ span {
|
|
|
+ height: 0.5rem;
|
|
|
+ line-height: 0.5rem;
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ ul {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: .5rem;
|
|
|
+ z-index: 12;
|
|
|
+ width: 100%;
|
|
|
+ max-height: 3rem;
|
|
|
+ overflow-y: auto;
|
|
|
+ display: none;
|
|
|
+ li {
|
|
|
+ text-indent: 0px;
|
|
|
+ width: 100%;
|
|
|
+ background: #666;
|
|
|
+ color: rgba(255, 255, 255, 0.89);
|
|
|
+ text-align: center;
|
|
|
+ font-size: .3rem;
|
|
|
+ }
|
|
|
+ &.active {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .labelInput {
|
|
|
+ display: inline-block;
|
|
|
+ vertical-align: top;
|
|
|
+ width: 5.1rem;
|
|
|
+ text-indent: 0;
|
|
|
+ input {
|
|
|
+ width: 4.7rem;
|
|
|
+ color: #999;
|
|
|
+ font-size: .24rem;
|
|
|
+ height: 0.44rem;
|
|
|
+ vertical-align: top;
|
|
|
+ text-indent: 0.12rem;
|
|
|
+ }
|
|
|
+ img {
|
|
|
+ vertical-align: top;
|
|
|
+ display: inline-block;
|
|
|
+ margin-top: 0.06rem;
|
|
|
+ height: 0.32rem;
|
|
|
+ width: 0.32rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .pscList-top {
|
|
|
+ margin: 0 0.2rem 0;
|
|
|
+ height: 0.5rem;
|
|
|
+ line-height: 0.5rem;
|
|
|
+ background: #e5e5e5;
|
|
|
+ font-size: 0.28rem;
|
|
|
+ color: #666;
|
|
|
+ border-radius: 3px;
|
|
|
+ .pull-left {
|
|
|
+ margin-left: 0.2rem
|
|
|
+ }
|
|
|
+ .pull-right {
|
|
|
+ margin-right: 0.2rem
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ul.prices{
|
|
|
+ margin: 0.2rem 0.2rem 0;
|
|
|
+ padding-bottom: 0.2rem;
|
|
|
+ .clearfix {
|
|
|
+ margin-bottom: 0.14rem;
|
|
|
+ font-size: 0.24rem;
|
|
|
+ color: #666;
|
|
|
+ .priceM {
|
|
|
+ width: 1.6rem;
|
|
|
+ height: 0.5rem;
|
|
|
+ border: 1px solid #d2d2d2;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 0.5rem;
|
|
|
+ border-radius: 3px;
|
|
|
+ }
|
|
|
+ span {
|
|
|
+ width: 0.34rem;
|
|
|
+ height: 0.34rem;
|
|
|
+ margin-top: 0.08rem;
|
|
|
+ display: inline-block;
|
|
|
+ vertical-align: top;
|
|
|
+ &:nth-of-type(1){
|
|
|
+ margin: 0.08rem 0.2rem 0;
|
|
|
+ }
|
|
|
+ img {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .firstNumber {
|
|
|
+ width: 0.4rem;
|
|
|
+ background: #eeeeee;
|
|
|
+ height: 0.5rem;
|
|
|
+ border:1px solid #d2d2d2;
|
|
|
+ border-radius: 3px;
|
|
|
+ line-height: 0.5rem;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 0.24rem;
|
|
|
+ }
|
|
|
+ .otherNumber {
|
|
|
+ width: 1.6rem;
|
|
|
+ background: #eeeeee;
|
|
|
+ height: 0.5rem;
|
|
|
+ border:1px solid #d2d2d2;
|
|
|
+ border-radius: 3px;
|
|
|
+ line-height: 0.5rem;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 0.24rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .button {
|
|
|
+ margin: 0rem 0.2rem 0;
|
|
|
+ div{
|
|
|
+ width: 3.2rem;
|
|
|
+ height: 0.62rem;
|
|
|
+ color: #fff;
|
|
|
+ border-radius: 5px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 0.62rem;
|
|
|
+ font-size: 0.3rem;
|
|
|
+ }
|
|
|
+ .save {
|
|
|
+ background: #3f84f6;
|
|
|
+ }
|
|
|
+ .cancel {
|
|
|
+ background: #b5b5b5
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
shenjj
