|
|
@@ -0,0 +1,929 @@
|
|
|
+<template>
|
|
|
+ <div class="material-wrapper">
|
|
|
+ <div class="order-nav">
|
|
|
+ <div :class="activeType === '' ? 'active': ''" @click="ChangeList('')"><span>公司产品库</span></div>
|
|
|
+ <div :class="activeType === 'mine' ? 'active' : ''" @click="ChangeList('mine')"><span>我的产品库</span></div>
|
|
|
+ </div>
|
|
|
+ <div class="search-content">
|
|
|
+ <input type="text" placeholder="请输入您要查找的品牌或型号" v-model="seekKeyword" @keyup.13="searchSeek">
|
|
|
+ <span @click="searchSeek" >
|
|
|
+ <i class="iconfont icon-sousuo"></i>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="scrollContent" id="provider-wrapper">
|
|
|
+ <div class="providerList" v-for="(item, index) in GetEnterpriseListData">
|
|
|
+ <div class="top">
|
|
|
+ <div class="icon" :class="item.standard ? 'standed' : 'istanded'"></div>
|
|
|
+ <div class="text" style="width: 4.3rem">
|
|
|
+ {{item.pcmpcode}}
|
|
|
+ </div>
|
|
|
+ <div class="text" style="width: 1rem;color: #666;font-size: 0.28rem">
|
|
|
+ {{item.goods && item.goods.selfSale ? '寄售' : '自营' || '-'}}
|
|
|
+ </div>
|
|
|
+ <div class="text" style="width: 1rem;color: #666;font-size: 0.28rem">
|
|
|
+ {{item.goods && item.goods.autoPublish ? '已上架' : '已下架' }}
|
|
|
+ </div>
|
|
|
+ <!-- <div class="pms">
|
|
|
+ {{item.storeid === '33069557578d44e69bd91ad12d28a8d4' ? '寄售' : '自营'}}
|
|
|
+ </div>-->
|
|
|
+ <!--<img class="store-type" v-if="item.goods && item.goods.storeid === '33069557578d44e69bd91ad12d28a8d4'" src="/images/mobile/product/consignment.png" alt="">-->
|
|
|
+ <!--<img class="store-type" src="/images/mobile/product/self.png" alt="" v-else >=-->
|
|
|
+ <img class="store-type" src="/images/mobile/product/mine_icon.png" v-if="item.addProductPerson"/>
|
|
|
+ </div>
|
|
|
+ <div class="middle">
|
|
|
+ <div class="list" style="height: 0.46rem;">
|
|
|
+ <div class="fl">
|
|
|
+ <div class="name">品牌：</div>
|
|
|
+ <div class="text">{{item.pbranden || item.pbrand || '-'}}</div>
|
|
|
+ </div>
|
|
|
+ <!--<div class="fr">-->
|
|
|
+ <!--<div class="button" @click="update(item)">编辑</div>-->
|
|
|
+ <!--<div class="button" @click="offProduct(item, index)">下架</div>-->
|
|
|
+ <!--</div>-->
|
|
|
+ </div>
|
|
|
+ <div class="list">
|
|
|
+ <div class="name">物料名称：</div>
|
|
|
+ <div class="text">{{item.kind || item.kinden || '-'}}</div>
|
|
|
+ <!--<div class="fr">-->
|
|
|
+ <!--<div class="textinfo" v-if="item.goods && item.goods.breakUp">可拆卖</div>-->
|
|
|
+ <!--</div>-->
|
|
|
+ </div>
|
|
|
+ <div class="list">
|
|
|
+ <div class="name">规格：</div>
|
|
|
+ <div class="text">{{item.spec || '-'}}</div>
|
|
|
+ </div>
|
|
|
+ <div class="list">
|
|
|
+ <div class="fl">
|
|
|
+ <div class="name">包装方式：</div>
|
|
|
+ <div class="text">{{item.packaging || '无包装信息'}}</div>
|
|
|
+ </div>
|
|
|
+ <div class="fr">
|
|
|
+ <div class="name">库存：</div>
|
|
|
+ <div class="text">{{item.erpReserve || '-'}}</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="list">
|
|
|
+ <div class="fl">
|
|
|
+ <div class="name">最小包装数：</div>
|
|
|
+ <div class="text">{{item.minPackQty || '暂无包装信息'}}</div>
|
|
|
+ </div>
|
|
|
+ <div class="fr">
|
|
|
+ <div class="name">成本单价：</div>
|
|
|
+ <div class="text">{{item.price || '-'}}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="list">
|
|
|
+ <div class="fl">
|
|
|
+ <div class="name">最小起订量：</div>
|
|
|
+ <div class="text">{{item.goods && item.goods.minBuyQty || '-'}}</div>
|
|
|
+ </div>
|
|
|
+ <div class="fr">
|
|
|
+ <div class="name">交期(天)：</div>
|
|
|
+ <div class="text" v-if="item.goods && item.goods.b2cMaxDelivery && (item.goods.b2cMaxDelivery != item.goods.b2cMinDelivery)" v-text="item.goods.b2cMinDelivery + '-'+ item.goods.b2cMaxDelivery"></div>
|
|
|
+ <div class="text" v-if="item.goods && item.goods.b2cMaxDelivery && (item.goods.b2cMaxDelivery == item.goods.b2cMinDelivery)" v-text="item.goods.b2cMinDelivery"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--<div class="list">-->
|
|
|
+ <!--<div class="name">生产日期：</div>-->
|
|
|
+ <!--<div class="text" :title="item.produceDate">{{item.produceDate || '-'}}</div>-->
|
|
|
+ <!--</div>-->
|
|
|
+
|
|
|
+ <div class="list">
|
|
|
+ <div class="name left">价格梯度：</div>
|
|
|
+ <div class="table left">
|
|
|
+ <ul>
|
|
|
+ <li class="title">
|
|
|
+ <div>分段数量/PCS</div>
|
|
|
+ <div>分段单价</div>
|
|
|
+ </li>
|
|
|
+ <template v-if="item.goods">
|
|
|
+ <li v-for="price in item.goods.prices">
|
|
|
+ <div>{{price.start}}+</div>
|
|
|
+ <div v-if="item.currencyName == 'RMB'">¥{{price.rMBPrice}}</div>
|
|
|
+ <div v-else>${{price.rMBPrice}}</div>
|
|
|
+ </li>
|
|
|
+ </template>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="clearfix">
|
|
|
+ <div class="pull-right add" @click="addProtoperson(item)" :class="{noadd: item.addProductPerson}">加入个人产品</div>
|
|
|
+ <div class="pull-right look" @click="toAddpro(item)">编辑上架</div>
|
|
|
+ <div class="pull-right look" @click="updateMateriel(item)">编辑物料</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <remind-box :title="collectResult" :timeoutCount="timeoutCount"></remind-box>
|
|
|
+ <pull-up :fixId="'provider-wrapper'" :searchMore="isSearchSearchingMore" :allPage="EnterprisePage" :page="seekPage" @pullUpAction="getMoreSearch"></pull-up>
|
|
|
+ <!-- 编辑物料 -->
|
|
|
+ <div class="update-materiel" v-if="showMateriel">
|
|
|
+ <div class="mobile-nav">
|
|
|
+ <div class="mobile-header mobile-center-header">
|
|
|
+ <a @click="showMateriel = false"><i class="iconfont icon-fanhui"></i></a>
|
|
|
+ <p>编辑物料</p>
|
|
|
+ <p class="en-name">
|
|
|
+ <img :src="`/images/mobile/center/${user.data.enterprise && user.data.enterprise.uu ? 'en' : 'self'}.png`" alt="">{{currentEnName}}
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="update-materiel-wrapper" @click="clearInfo()">
|
|
|
+ <!--<div class="clearfix">-->
|
|
|
+ <!--<div class="update-materiel-wrapper-image pull-left">-->
|
|
|
+ <!--<img :src="cmpImg || '/images/mobile/openStore/upload.png'" style='width: 1.1rem; height: 1.1rem;display:block;margin: 0.2rem auto'/>-->
|
|
|
+ <!--<input type="file" class="com-input" @change="update" accept="image/jpeg,image/jpg,image/gif,image/bmp,image/png,.pdf" />-->
|
|
|
+ <!--<span style="position: relative">点击上传</span>-->
|
|
|
+ <!--</div>-->
|
|
|
+ <!--<div class="uploadImgBtn pull-left">上传图片<input type="file" class="com-input" @change="update" accept="image/jpeg,image/jpg,image/gif,image/bmp,image/png,.pdf" /></div>-->
|
|
|
+ <!--<span class="uploadImgInfo pull-left">图片上传须知</span>-->
|
|
|
+ <!--</div>-->
|
|
|
+ <template v-if="MaterielItem.standard === 1">
|
|
|
+ <img class="imgUrl" src="/images/mobile/@2x/productDetail/Strand.png" />
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <img class="imgUrl" src="/images/mobile/@2x/productDetail/isStrand.png" />
|
|
|
+ </template>
|
|
|
+ <div class="update-materiel-wrapper-list clearfix" :class="{'overHidden': MaterielItem.standard === 1}">
|
|
|
+ <div class="name pull-left"><a class="red">*</a>品牌：</div>
|
|
|
+ <template v-if="MaterielItem.standard === 1">
|
|
|
+ {{MaterielItem.pbranden}}
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <div class="input pull-left clearfix" :class="{'overHidden': MaterielItem.standard === 1}">
|
|
|
+ <input type="text" v-model="MaterielItem.pbranden" placeholder="请勿填中文符号" @blur.stop="checkBrand" @input.stop="onBrandChange"/>
|
|
|
+ <ul class="similar brand-similar-list" v-show="showSimilarBrandList && MaterielItem.pbranden">
|
|
|
+ <li v-for="sBrand in similarBrand" @click.stop="setBrand(sBrand.nameEn)">{{sBrand.nameEn}}</li>
|
|
|
+ </ul>
|
|
|
+ <i class="iconfont icon-guanbi1" @click.stop="MaterielItem.pbranden = ''"></i>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ <div class="update-materiel-wrapper-list clearfix" :class="{'overHidden': MaterielItem.standard === 1}">
|
|
|
+ <div class="name pull-left"><a class="red">*</a>物料名称：</div>
|
|
|
+ <template v-if="MaterielItem.standard === 1">
|
|
|
+ {{MaterielItem.kind}}
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <div class="input pull-left clearfix" style="width: 4.09rem">
|
|
|
+ <!--<input type="text" v-model="MaterielItem.kind" @blur="checkCode" @input="onCodeChange" placeholder="请勿填中文符号">-->
|
|
|
+ <input type="text" placeholder="请输入物料名称" v-model="MaterielItem.kind"/>
|
|
|
+ <i class="iconfont icon-guanbi1" @click.stop="MaterielItem.kind = ''"></i>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ <div class="update-materiel-wrapper-list clearfix">
|
|
|
+ <div class="name pull-left"><a class="red">*</a>型号：</div>
|
|
|
+ <template v-if="MaterielItem.standard === 1">
|
|
|
+ {{MaterielItem.pcmpcode}}
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <div class="input pull-left clearfix">
|
|
|
+ <input type="text" v-model="MaterielItem.pcmpcode" @blur.stop="checkCode" @input.stop="onCodeChange" placeholder="请勿填中文符号">
|
|
|
+ <ul class="similar" v-show="showSimilarCodeList && MaterielItem.pcmpcode">
|
|
|
+ <li v-for="sCode in similarCode" @click.stop="setCode(sCode.code)">{{sCode.code}}</li>
|
|
|
+ </ul>
|
|
|
+ <!--<input type="text" placeholder="请输入型号" v-model="MaterielItem.pcmpcode"/>-->
|
|
|
+ <i class="iconfont icon-guanbi1" @click.stop="MaterielItem.pcmpcode = ''"></i>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ <div class="update-materiel-wrapper-list clearfix">
|
|
|
+ <div class="name pull-left"><a class="red" style="opacity: 0">*</a>规格：</div>
|
|
|
+ <div class="input pull-left clearfix">
|
|
|
+ <input type="text" placeholder="请输入规格" v-model="MaterielItem.spec" @blur="checkSpec" @input="onSpecInput" maxlength="50"/>
|
|
|
+ <i class="iconfont icon-guanbi1" @click.stop="MaterielItem.spec = ''"></i>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="update-materiel-wrapper-controll clearfix">
|
|
|
+ <div class="pull-left" @click.stop="saveMateriel()">保存</div>
|
|
|
+ <div class="pull-right" @click.stop="saveMateriel('a')">取消</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import { RemindBox, PullUp } from '~components/mobile/common'
|
|
|
+ export default {
|
|
|
+ layout: 'mobile',
|
|
|
+ middleware: 'authenticated',
|
|
|
+ name: 'mobileProduct',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ activeType: '',
|
|
|
+ collectResult: '',
|
|
|
+ timeoutCount: 0,
|
|
|
+ isSearchSearchingMore: false, // 是否请求状态
|
|
|
+ EnterprisePage: 0, // 总页数
|
|
|
+ GetEnterpriseListData: [], // 当前数据源
|
|
|
+ seekPage: 1, // 当前页数
|
|
|
+ seekKeyword: '', // 搜索关键字
|
|
|
+ MaterielItem: {}, // 当前选择编辑物料对象 或者 编辑上下架对象
|
|
|
+ showMateriel: false, // 编辑物料弹窗
|
|
|
+ showSimilarCodeList: false, // 型号选择框
|
|
|
+ showSimilarBrandList: false, // 品牌选择框
|
|
|
+ similarBrand: [],
|
|
|
+ similarCode: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getResourceProvidor()
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ // 是否展示空数据
|
|
|
+ StateNone() {
|
|
|
+ return this.GetEnterpriseListData.length === 0 && this.EnterprisePage === 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 获取当前企业产品库
|
|
|
+ GetEnterpriseList: function() {
|
|
|
+ let params = {
|
|
|
+ _status: 'all',
|
|
|
+ count: 20,
|
|
|
+ isStandard: true,
|
|
|
+ keyword: this.seekKeyword || '',
|
|
|
+ page: this.seekPage,
|
|
|
+ sorting: { id: 'DESC' },
|
|
|
+ type: 'nStandard'
|
|
|
+ }
|
|
|
+ return this.$http.get('/trade/products', { params })
|
|
|
+ },
|
|
|
+ // 获取当前个人产品库
|
|
|
+ GetPersonList: function(cb) {
|
|
|
+ let params = {
|
|
|
+ _status: 'all',
|
|
|
+ count: 20,
|
|
|
+ isStandard: true,
|
|
|
+ keyword: this.seekKeyword || '',
|
|
|
+ page: this.seekPage,
|
|
|
+ sorting: { id: 'DESC' },
|
|
|
+ type: 'all'
|
|
|
+ }
|
|
|
+ return this.$http.get('/trade/products/person', { params })
|
|
|
+ },
|
|
|
+ ChangeList(_tp) {
|
|
|
+ this.activeType = _tp
|
|
|
+ this.seekPage = 0
|
|
|
+ this.GetEnterpriseListData = []
|
|
|
+ this.getResourceProvidor()
|
|
|
+ },
|
|
|
+ getResourceProvidor: function() {
|
|
|
+ if (this.activeType === '') {
|
|
|
+ this.GetEnterpriseList().then(res => {
|
|
|
+ this.GetEnterpriseListData = this.GetEnterpriseListData.concat(res.data.content)
|
|
|
+ this.EnterprisePage = res.data.totalPages
|
|
|
+ this.isSearchSearchingMore = false
|
|
|
+ })
|
|
|
+ } else if (this.activeType === 'mine') {
|
|
|
+ this.GetPersonList().then(res => {
|
|
|
+ this.GetEnterpriseListData = this.GetEnterpriseListData.concat(res.data.content)
|
|
|
+ this.EnterprisePage = res.data.totalPages
|
|
|
+ this.isSearchSearchingMore = false
|
|
|
+ })
|
|
|
+ } else if (this.providerType === 'onLine') {
|
|
|
+ this.GetOnlineList().then(res => {
|
|
|
+ this.GetEnterpriseListData = this.GetEnterpriseListData.concat(res.data.content)
|
|
|
+ this.EnterprisePage = res.data.totalPages
|
|
|
+ this.isSearchSearchingMore = false
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getMoreSearch: function () {
|
|
|
+ this.seekPage++
|
|
|
+ this.isSearchSearchingMore = true
|
|
|
+ this.getResourceProvidor()
|
|
|
+ },
|
|
|
+ searchSeek: function() {
|
|
|
+ this.ChangeList(this.activeType)
|
|
|
+ },
|
|
|
+ addProtoperson: function(item) {
|
|
|
+ if (item.addProductPerson) {
|
|
|
+ this.collectResult = '已在个人产品库'
|
|
|
+ this.timeoutCount++
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ this.$http.post('/trade/products/person', [item.id])
|
|
|
+ .then(response => {
|
|
|
+ this.collectResult = '绑定成功'
|
|
|
+ this.timeoutCount++
|
|
|
+ this.seekPage = 1
|
|
|
+ this.GetEnterpriseListData.splice(0, this.GetEnterpriseListData.length)
|
|
|
+ this.GetEnterpriseListData = null
|
|
|
+ this.GetEnterpriseListData = []
|
|
|
+ this.reloadData()
|
|
|
+ }, () => {
|
|
|
+ this.collectResult = '绑定失败'
|
|
|
+ this.timeoutCount++
|
|
|
+ })
|
|
|
+ },
|
|
|
+ toAddpro(list) {},
|
|
|
+ // 编辑物料
|
|
|
+ updateMateriel(item) {
|
|
|
+ this.MaterielItem = item
|
|
|
+ this.$item = this.baseUtils.deepCopy(item)
|
|
|
+ this.cmpImg = item.cmpImg || ''
|
|
|
+ // this.MaterielItem.cmpImg = item.cmpImg || ''
|
|
|
+ this.showMateriel = true
|
|
|
+ },
|
|
|
+ // 编辑物料保存按钮
|
|
|
+ saveMateriel(str) {
|
|
|
+ if (str) {
|
|
|
+ let _key1 = Object.keys(this.$item)
|
|
|
+ let _key2 = Object.keys(this.MaterielItem)
|
|
|
+ for (let i = 0; i < _key1.length; i++) {
|
|
|
+ this.MaterielItem[_key2[i]] = this.$item[_key1[i]]
|
|
|
+ }
|
|
|
+ this.showMateriel = false
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (this.MaterielItem.pbranden === '') {
|
|
|
+ this.setRemindText('品牌不能为空')
|
|
|
+ return
|
|
|
+ } else if (this.MaterielItem.kind === '') {
|
|
|
+ this.setRemindText('物料名称不能为空')
|
|
|
+ return
|
|
|
+ } else if (this.MaterielItem.pcmpcode === '') {
|
|
|
+ this.setRemindText('型号不能为空')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.MaterielItem.pcmpcode = this.MaterielItem.pcmpcode
|
|
|
+ this.MaterielItem.pbranden = this.MaterielItem.pbranden
|
|
|
+ let item = {
|
|
|
+ id: this.MaterielItem.id,
|
|
|
+ kind : this.MaterielItem.kind,
|
|
|
+ pbranden: this.MaterielItem.pbranden,
|
|
|
+ pcmpcode: this.MaterielItem.pcmpcode,
|
|
|
+ spec: this.MaterielItem.spec,
|
|
|
+ url: ''
|
|
|
+ }
|
|
|
+ this.$http.post('/trade/products/update/product?attachUrl=', item).then(res => {
|
|
|
+ if (res.data.success) {
|
|
|
+ this.setRemindText('修改成功')
|
|
|
+ this.showMateriel = false
|
|
|
+ this.page = 1
|
|
|
+ this.GetEnterpriseListData = null
|
|
|
+ this.GetEnterpriseListData = []
|
|
|
+ this.getResourceProvidor()
|
|
|
+ } else {
|
|
|
+ this.setRemindText(res.data.message)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ clearInfo() {
|
|
|
+ this.showSimilarCodeList = false
|
|
|
+ this.showSimilarBrandList = false
|
|
|
+ },
|
|
|
+ checkBrand: function () {
|
|
|
+ // this.MaterielItem.brand = this.MaterielItem.brand && this.MaterielItem.brand !== ''
|
|
|
+ if (!this.MaterielItem.pbranden || this.MaterielItem.pbranden === '') {
|
|
|
+ this.setRemindText('品牌不能为空')
|
|
|
+ }
|
|
|
+ return this.MaterielItem.pbranden
|
|
|
+ },
|
|
|
+ checkCode: function () {
|
|
|
+ if (!this.MaterielItem.pcmpcode || this.MaterielItem.pcmpcode === '') {
|
|
|
+ this.setRemindText('型号不能为空')
|
|
|
+ }
|
|
|
+ return this.MaterielItem.pcmpcode
|
|
|
+ },
|
|
|
+ onCodeChange: function () {
|
|
|
+ this.MaterielItem.pcmpcode = this.MaterielItem.pcmpcode.trim()
|
|
|
+ if ((/[^\x00-\xff]/g).test(this.MaterielItem.pcmpcode)) {
|
|
|
+ let chineseIndex = -1
|
|
|
+ for (let i = 0; i < this.MaterielItem.pcmpcode.length; i++) {
|
|
|
+ if ((/[^\x00-\xff]/g).test(this.MaterielItem.pcmpcode.charAt(i))) {
|
|
|
+ chineseIndex = i
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.MaterielItem.pcmpcode = this.baseUtils.cutOutString(this.MaterielItem.pcmpcode, chineseIndex)
|
|
|
+ } else if (this.MaterielItem.pcmpcode && this.baseUtils.getRealLen(this.MaterielItem.pcmpcode) > 100) {
|
|
|
+ this.MaterielItem.pcmpcode = this.baseUtils.cutOutString(this.MaterielItem.pcmpcode, 100)
|
|
|
+ } else {
|
|
|
+ this.getSimilarCode()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onBrandChange: function () {
|
|
|
+ this.MaterielItem.pbranden = this.MaterielItem.pbranden.trim()
|
|
|
+ if ((/[^\x00-\xff]/g).test(this.MaterielItem.pbranden)) {
|
|
|
+ let chineseIndex = -1
|
|
|
+ for (let i = 0; i < this.MaterielItem.pbranden.length; i++) {
|
|
|
+ if ((/[^\x00-\xff]/g).test(this.MaterielItem.pbranden.charAt(i)) && !(/[\u4e00-\u9fa5]/).test(this.MaterielItem.pbranden.charAt(i))) {
|
|
|
+ chineseIndex = i
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (chineseIndex > -1) {
|
|
|
+ this.MaterielItem.pbranden = this.MaterielItem.pbranden.substring(0, chineseIndex)
|
|
|
+ }
|
|
|
+ } else if (this.MaterielItem.pbranden && this.baseUtils.getRealLen(this.MaterielItem.pbranden) > 50) {
|
|
|
+ this.MaterielItem.pbranden = this.baseUtils.cutOutString(this.MaterielItem.pbranden, 50)
|
|
|
+ } else {
|
|
|
+ this.getSimilarBrand()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getSimilarBrand: function () {
|
|
|
+ if (this.MaterielItem.pbranden) {
|
|
|
+ this.$http.get('/search/similarBrands', {params: {keyword: this.MaterielItem.pbranden}})
|
|
|
+ .then(response => {
|
|
|
+ this.similarBrand = response.data
|
|
|
+ this.showSimilarBrandList = response.data.length > 0
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.showSimilarBrandList = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getSimilarCode: function () {
|
|
|
+ if (this.MaterielItem.pcmpcode) {
|
|
|
+ this.$http.get('/search/similarComponents', {params: {keyword: this.MaterielItem.pcmpcode}})
|
|
|
+ .then(response => {
|
|
|
+ this.similarCode = response.data
|
|
|
+ this.showSimilarCodeList = response.data.length > 0
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.showSimilarCodeList = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ setCode: function (code) {
|
|
|
+ this.MaterielItem.pcmpcode = code
|
|
|
+ this.showSimilarCodeList = false
|
|
|
+ },
|
|
|
+ setBrand: function (brand) {
|
|
|
+ this.MaterielItem.pbranden = brand
|
|
|
+ this.showSimilarBrandList = false
|
|
|
+ },
|
|
|
+ setRemindText: function (str) {
|
|
|
+ this.collectResult = str
|
|
|
+ this.timeoutCount++
|
|
|
+ },
|
|
|
+ checkSpec: function () {
|
|
|
+ // let nullStrFlag =
|
|
|
+ // this.MaterielItem.spec = nullStrFlag
|
|
|
+ if (!this.baseUtils.checkNullStr(this.MaterielItem.spec)) {
|
|
|
+ this.setRemindText('规格输入不合法')
|
|
|
+ }
|
|
|
+ return this.MaterielItem.spec
|
|
|
+ },
|
|
|
+ onSpecInput: function () {
|
|
|
+ if (this.MaterielItem.spec && this.baseUtils.getRealLen(this.MaterielItem.spec) > 100) {
|
|
|
+ this.MaterielItem.spec = this.baseUtils.cutOutString(this.MaterielItem.spec, 100)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ RemindBox,
|
|
|
+ PullUp
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ @mixin overFlowHidden {
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ @mixin lineHeight($value) {
|
|
|
+ height: $value;
|
|
|
+ line-height: $value;
|
|
|
+ }
|
|
|
+.material-wrapper {
|
|
|
+ background: #f1f3f6;
|
|
|
+ margin: 1.26rem 0 0.98rem 0;
|
|
|
+ height: calc(100vh - 1.26rem - 0.98rem);
|
|
|
+ .order-nav {
|
|
|
+ background: #fff;
|
|
|
+ div {
|
|
|
+ height: 0.82rem;
|
|
|
+ line-height: 0.82rem;
|
|
|
+ display: inline-block;
|
|
|
+ width: 50%;
|
|
|
+ text-align: center;
|
|
|
+ font-size: .28rem;
|
|
|
+ color: #666;
|
|
|
+ &.active span{
|
|
|
+ color: #3f84f6;
|
|
|
+ border-bottom: 0.04rem solid #3f84f6;
|
|
|
+ padding-bottom: 0.2rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .search-content {
|
|
|
+ text-align: center;
|
|
|
+ padding: .25rem 0;
|
|
|
+ input {
|
|
|
+ border: 1px solid #376ff3;
|
|
|
+ }
|
|
|
+ span {
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .scrollContent {
|
|
|
+ height: calc(100vh - 3.19rem - 0.98rem);
|
|
|
+ overflow-y: auto;
|
|
|
+ .providerList {
|
|
|
+ margin-bottom: 0.24rem;
|
|
|
+ .top {
|
|
|
+ position: relative;
|
|
|
+ padding: 0 0.24rem;
|
|
|
+ border-bottom: 1px solid #d3d3d3;
|
|
|
+ height: 0.9rem;
|
|
|
+ line-height: 0.9rem;
|
|
|
+ color: #0067e7;
|
|
|
+ font-size: 0.3rem;
|
|
|
+ background: #fff;
|
|
|
+ &::after {
|
|
|
+ clear: both;
|
|
|
+ display: block;
|
|
|
+ content: ' ';
|
|
|
+ visibility: hidden;
|
|
|
+ zoom: 1;
|
|
|
+ }
|
|
|
+ .text {
|
|
|
+ width: 5.4rem;
|
|
|
+ }
|
|
|
+ .pms {
|
|
|
+ color: #f57710;
|
|
|
+ border: 1px solid #f57710;
|
|
|
+ border-radius: 0.4rem;
|
|
|
+ background: #fff;
|
|
|
+ font-size: 0.24rem;
|
|
|
+ height: 0.4rem;
|
|
|
+ line-height: 0.4rem;
|
|
|
+ width: 0.8rem;
|
|
|
+ text-align: center;
|
|
|
+ float: right;
|
|
|
+ margin-top: 0.25rem;
|
|
|
+ }
|
|
|
+ .store-type {
|
|
|
+ width: .77rem;
|
|
|
+ height: .77rem;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+ .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')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .person-flag {
|
|
|
+ width: .75rem;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ }
|
|
|
+ .text {
|
|
|
+ float: left;
|
|
|
+ width: 6.3rem;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .middle {
|
|
|
+ padding: 0.24rem 0.24rem;
|
|
|
+ background: #fff;
|
|
|
+ .pms {
|
|
|
+ color: #f57710;
|
|
|
+ border: 1px solid #f57710;
|
|
|
+ border-radius: 0.4rem;
|
|
|
+ background: #fff;
|
|
|
+ font-size: 0.24rem;
|
|
|
+ height: 0.4rem;
|
|
|
+ line-height: 0.4rem;
|
|
|
+ width: 0.8rem;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .list {
|
|
|
+ /*height: 0.46rem;*/
|
|
|
+ .left {
|
|
|
+ float: left;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ .textinfo {
|
|
|
+ color: #0067e7;
|
|
|
+ font-size: 0.3rem;
|
|
|
+ }
|
|
|
+ .button {
|
|
|
+ font-size: 0.26rem;
|
|
|
+ color: #fff;
|
|
|
+ width: 0.92rem;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 5px;
|
|
|
+ /*border:1px solid #1a58dd;*/
|
|
|
+ background: #1a58dd;
|
|
|
+ display: inline-block;
|
|
|
+ margin-right: 0.2rem;
|
|
|
+ line-height: 0.33rem;
|
|
|
+ height: 0.37rem;
|
|
|
+ }
|
|
|
+ margin-bottom: 0.18rem;
|
|
|
+ &::after{
|
|
|
+ clear: both;
|
|
|
+ display: block;
|
|
|
+ content: ' ';
|
|
|
+ visibility: hidden;
|
|
|
+ zoom: 1;
|
|
|
+ }
|
|
|
+ .fl {
|
|
|
+ width: 4.3rem;
|
|
|
+ float: left;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ .fr {
|
|
|
+ text-align: left;
|
|
|
+ width: 2.6rem;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ &.list-long {
|
|
|
+ .fl {
|
|
|
+ width: 100% !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .name {
|
|
|
+ color: #666;
|
|
|
+ font-size: 0.3rem;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+ .text {
|
|
|
+ display: inline-block;
|
|
|
+ color: #333;
|
|
|
+ font-size: 0.3rem
|
|
|
+ }
|
|
|
+ .table {
|
|
|
+ width: 5.5rem;
|
|
|
+ margin-bottom: 0;
|
|
|
+ margin-top: 0;
|
|
|
+ li {
|
|
|
+ height: 0.43rem;
|
|
|
+ line-height: 0.43rem;
|
|
|
+ border-left: .01rem solid #c5c5c5;
|
|
|
+ font-size: .28rem;
|
|
|
+ &::after {
|
|
|
+ clear: both;
|
|
|
+ display: block;
|
|
|
+ content: ' ';
|
|
|
+ visibility: hidden;
|
|
|
+ zoom: 1;
|
|
|
+ }
|
|
|
+ div {
|
|
|
+ text-align: center;
|
|
|
+ width: 50%;
|
|
|
+ float: left;
|
|
|
+ border-right: .01rem solid #c5c5c5;
|
|
|
+ border-bottom: .01rem solid #c5c5c5;
|
|
|
+ }
|
|
|
+ &:nth-child(odd) {
|
|
|
+ background: #ddd;
|
|
|
+ color: #666;
|
|
|
+ font-size: 0.28rem;
|
|
|
+ }
|
|
|
+ &:nth-child(even) {
|
|
|
+ background: #fcfcfc;
|
|
|
+ color: #666;
|
|
|
+ font-size: 0.28rem;
|
|
|
+ }
|
|
|
+ &:nth-last-of-type(1){
|
|
|
+ color: #f31919;
|
|
|
+ }
|
|
|
+ &.title {
|
|
|
+ font-size: 0.28rem;
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ div.clearfix {
|
|
|
+ padding: 0.2rem 0.2rem;
|
|
|
+ border-top: 1px solid #d3d3d3;
|
|
|
+ background: #fff;
|
|
|
+ div{
|
|
|
+ width: 2.1rem;
|
|
|
+ height: .6rem;
|
|
|
+ text-align: center;
|
|
|
+ line-height: .6rem;
|
|
|
+ border-radius: 3px;
|
|
|
+ margin-right: .2rem;
|
|
|
+ &.look {
|
|
|
+ color: #008bf7;
|
|
|
+ border: 1px solid #008bf7;
|
|
|
+ }
|
|
|
+ &.add {
|
|
|
+ background: #fff;
|
|
|
+ color: #f57710;
|
|
|
+ border: 1px solid #f57710;
|
|
|
+ }
|
|
|
+ &.noadd{
|
|
|
+ background: #cccbcb;
|
|
|
+ color: #fff;
|
|
|
+ border:1px solid #cccbcb;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .update-materiel {
|
|
|
+ position: fixed;
|
|
|
+ z-index: 99;
|
|
|
+ background: #f1f3f6;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ right: 0;
|
|
|
+ .mobile-header{
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ z-index: 10;
|
|
|
+ width:100%;
|
|
|
+ height: 1.26rem;
|
|
|
+ line-height: 1.26rem;
|
|
|
+ /*border-bottom:.01rem solid #ccc;*/
|
|
|
+ background: #3e82f5;
|
|
|
+ padding:0 .2rem 0 .1rem;
|
|
|
+ color:#fff;
|
|
|
+ }
|
|
|
+ .mobile-header p{
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ font-size:.36rem;
|
|
|
+ text-align: center;
|
|
|
+ width: 6rem;
|
|
|
+ padding-left: 1rem;
|
|
|
+ }
|
|
|
+ .mobile-center-header p.en-name {
|
|
|
+ font-size: .3rem;
|
|
|
+ }
|
|
|
+ .mobile-header a{
|
|
|
+ font-size:.28rem;
|
|
|
+ color:#fff;
|
|
|
+ position: absolute;
|
|
|
+ }
|
|
|
+ .mobile-header a i{
|
|
|
+ font-size: .48rem;
|
|
|
+ margin-right: -.1rem;
|
|
|
+ }
|
|
|
+ .update-materiel-wrapper {
|
|
|
+ border: 1px solid #dcdcdc;
|
|
|
+ border-radius: 0.07rem;
|
|
|
+ background: #fff;
|
|
|
+ margin: 1.46rem 0.2rem 0;
|
|
|
+ position: relative;
|
|
|
+ padding-bottom: 0.4rem;
|
|
|
+ padding-top: 1rem;
|
|
|
+ position: relative;
|
|
|
+ .imgUrl{
|
|
|
+ position: absolute;
|
|
|
+ width: 0.94rem;
|
|
|
+ height: 0.94rem;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+ .update-materiel-wrapper-image {
|
|
|
+ width: 2.28rem;
|
|
|
+ height: 2.28rem;
|
|
|
+ border: 1px solid #dcdcdc;
|
|
|
+ border-radius: 0.07rem;
|
|
|
+ position: relative;
|
|
|
+ margin: 0.27rem 0 0 0.55rem;
|
|
|
+ text-align: center;
|
|
|
+ position: relative;
|
|
|
+ span {
|
|
|
+ color: #b2b2b2;
|
|
|
+ font-size: 0.28rem;
|
|
|
+ }
|
|
|
+ .com-input {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ text-align: center;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ opacity: 0;
|
|
|
+ display: inline-block !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .uploadImgBtn {
|
|
|
+ color: #fff;
|
|
|
+ font-size: .28rem;
|
|
|
+ width: 1.51rem;
|
|
|
+ @include lineHeight(0.47rem);
|
|
|
+ border-radius: 0.07rem;
|
|
|
+ background: #f9b209;
|
|
|
+ text-align: center;
|
|
|
+ margin:2rem 0.1rem 0;
|
|
|
+ position: relative;
|
|
|
+ .com-input {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ text-align: center;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ opacity: 0;
|
|
|
+ display: inline-block !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .uploadImgInfo {
|
|
|
+ color: #3f84f6;
|
|
|
+ font-size: 0.24rem;
|
|
|
+ margin-top: 2.15rem;
|
|
|
+ }
|
|
|
+ .update-materiel-wrapper-list {
|
|
|
+ margin-left:0.28rem;
|
|
|
+ margin-top: 0.3rem;
|
|
|
+ line-height: 0.7rem;
|
|
|
+ .red {color: #ea0f42}
|
|
|
+ .name {color: #666;}
|
|
|
+ .input {
|
|
|
+ position: relative;
|
|
|
+ width:5.4rem;
|
|
|
+ line-height: 0.7rem;
|
|
|
+ height: 0.7rem;
|
|
|
+ border: 1px solid #dcdcdc;
|
|
|
+ input {
|
|
|
+ text-indent: 5px;
|
|
|
+ border: 0;
|
|
|
+ border-radius: 0.07rem;
|
|
|
+ line-height: 0.64rem;
|
|
|
+ height: 0.64rem;
|
|
|
+ width: 90%;
|
|
|
+ font-size:0.28rem;
|
|
|
+ float: left;
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+ i {
|
|
|
+ font-size: 0.16rem;
|
|
|
+ vertical-align: top;
|
|
|
+ color: #666;
|
|
|
+ float: right;
|
|
|
+ margin-right: 0.05rem
|
|
|
+ }
|
|
|
+ .similar {
|
|
|
+ position: absolute;
|
|
|
+ width:100%;
|
|
|
+ max-height: 2.5rem;
|
|
|
+ overflow-y: auto;
|
|
|
+ z-index: 12;
|
|
|
+ border: 1px solid #7e7e7e;
|
|
|
+ border-radius: .05rem;
|
|
|
+ top: .5rem;
|
|
|
+ background: #fff;
|
|
|
+ li {
|
|
|
+ height: .5rem;
|
|
|
+ line-height: .5rem;
|
|
|
+ font-size: .26rem;
|
|
|
+ color: #999;
|
|
|
+ padding-left: .19rem;
|
|
|
+ &:focus, &:active, &:hover {
|
|
|
+ background: #999;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .update-materiel-wrapper-controll {
|
|
|
+ margin: 0.4rem 0.2rem 0;
|
|
|
+ div {
|
|
|
+ width: 48%;
|
|
|
+ background: #b5b5b5;
|
|
|
+ font-size: 0.3rem;
|
|
|
+ color: #fafbfc;
|
|
|
+ text-align: center;
|
|
|
+ @include lineHeight(0.62rem);
|
|
|
+ border-radius: 0.07rem;
|
|
|
+ &:first-child {
|
|
|
+ background: #3f84f6;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
shenjj