|
|
@@ -0,0 +1,815 @@
|
|
|
+<template>
|
|
|
+ <div id="goods-list-fragment">
|
|
|
+ <div class="container">
|
|
|
+ <div class="content-adv">
|
|
|
+ <div class="title-adv"><span>全球共享交易平台</span><span>全球共享询价平台</span></div>
|
|
|
+ <div class="input-group">
|
|
|
+ <input type="search" class="form-control" id="search_input" title="code" placeholder="型号/品牌"
|
|
|
+ v-model="searchCode" @search="goodsSearch(searchCode)"/>
|
|
|
+ <span class="input-group-btn">
|
|
|
+ <button type="button" class="btn" id="search_btn" @click="goodsSearch(searchCode)"> 搜 索 </button>
|
|
|
+ </span>
|
|
|
+ <span class="input-group-btn">
|
|
|
+ <button type="button" class="btn sendprove" @click="sendprove()">我要发布产品</button>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 产品列表 -->
|
|
|
+ <div class="goods-area">
|
|
|
+ <!-- 列表展示 -->
|
|
|
+ <table class="goodslist" style="width: 955px;background:#fff;" >
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th width="165"><div>品牌/物料名称</div></th>
|
|
|
+ <th width="148"><div>型号/规格</div></th>
|
|
|
+ <th width="114"><div>包装/生产日期</div></th>
|
|
|
+ <th width="125"><div>库存</div></th>
|
|
|
+ <th width="149"><div>价格梯度(PCS)</div></th>
|
|
|
+ <th width="67"><div>交期(天)</div></th>
|
|
|
+ <th width="66"><div>规格书</div></th>
|
|
|
+ <th width="95"><div>操作</div></th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody id="goodslist-content">
|
|
|
+ <tr v-for="commodity in commodities.content" @click="goBatchDetail(commodity)">
|
|
|
+ <td class="brand-code">
|
|
|
+ <img class="sellout-store-commodity" v-if="commodity.status === 602" src="/images/search/sellout-search.png" alt="">
|
|
|
+ <img class="specific-price-tag" v-if="isSpecificPriceTag(commodity.tag) && isConsignment" src="/images/floor/specificPrice-store.png" alt="">
|
|
|
+ <div class="brand" v-if="commodity.brandNameEn || commodity.brandEn">
|
|
|
+ <a v-if="commodity.brandNameEn && commodity.branduuid" @click="goBrandDetail('/product/brand/' + commodity.branduuid, $event)" v-text="commodity.brandNameEn" :title="commodity.brandNameEn"></a>
|
|
|
+ <span v-if="commodity.brandNameEn && !commodity.branduuid" v-text="commodity.brandNameEn" :title="commodity.brandNameEn"></span>
|
|
|
+ <span v-if="commodity.brandEn && !commodity.branduuid" :title="commodity.brandEn">{{commodity.brandEn}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="brand" v-if="!commodity.brandNameEn && !commodity.brandEn && commodity.kindNameCn">—</div>
|
|
|
+ <a v-if="commodity.kindNameCn && commodity.kindUuid" @click="goBrandDetail('/product/kind/' + commodity.kindUuid, $event)" v-text="commodity.kindNameCn" :title="commodity.kindNameCn"></a>
|
|
|
+ <span v-if="commodity.kindNameCn && !commodity.kindUuid" v-text="commodity.kindNameCn" :title="commodity.kindNameCn"></span>
|
|
|
+ <div class="brand" v-if="!commodity.kindNameCn && (commodity.brandNameEn || commodity.brandEn)">—</div>
|
|
|
+ <div class="brand" v-if="!commodity.brandNameEn && !commodity.brandEn && !commodity.kindNameCn">—</div>
|
|
|
+ </td>
|
|
|
+ <td class="brand-code">
|
|
|
+ <div class="code" v-if="commodity.code" v-text="commodity.code" :title="commodity.code"></div>
|
|
|
+ <div class="code" v-if="!commodity.code">—</div>
|
|
|
+ <div class="brand spec" v-text="commodity.spec || '—'" :title="commodity.spec"></div>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <div class="package" v-if="commodity.packaging" v-text="commodity.packaging" :title="commodity.packaging"></div>
|
|
|
+ <div class="package" v-if="!commodity.packaging && !commodity.produceDate">—</div>
|
|
|
+ <div class="date" v-if='commodity.produceDate' v-text="commodity.produceDate" :title="commodity.produceDate">2016-12-01</div>
|
|
|
+ </td>
|
|
|
+ <td style="text-align: left;vertical-align: middle;">
|
|
|
+ <div class="goods" v-if="commodity.reserve">
|
|
|
+ 库存：<span v-text="commodity.reserve" :title="commodity.reserve">31500</span>
|
|
|
+ </div>
|
|
|
+ <div v-if="!commodity.reserve" style="text-align: center;margin-left: 0;"><span>—</span></div>
|
|
|
+ <div class="from" v-if="commodity.reserve && commodity.reserve>0">
|
|
|
+ 起拍：<span v-if="commodity.minBuyQty" v-text="commodity.minBuyQty" :title="commodity.minBuyQty">300</span>
|
|
|
+ </div>
|
|
|
+ <div class="can-div-sell" v-if="commodity.reserve" v-text="commodity.breakUp?'可拆卖':'不可拆卖'"></div>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <div class="amount">
|
|
|
+ <div v-for="price in commodity.prices" v-text="price.start + '+'" :title="price.start + '+'"></div>
|
|
|
+ </div>
|
|
|
+ <div class="price">
|
|
|
+ <div v-show="!commodity.prices || !commodity.prices.length">
|
|
|
+ <span>—</span>
|
|
|
+ </div>
|
|
|
+ <template v-if="commodity.currencyName === 'RMB'">
|
|
|
+ <div v-for="price in commodity.prices" :title="'￥' + price.rMBPrice">￥{{price.rMBPrice | currency}}</div>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <div v-for="price in commodity.prices" :title="'$' + price.uSDPrice">${{price.uSDPrice | currency}}</div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <div v-if="commodity.b2cMinDelivery">
|
|
|
+ <span v-if="commodity.b2cMinDelivery != commodity.b2cMaxDelivery" v-text="commodity.b2cMinDelivery + '-' + commodity.b2cMaxDelivery" :title="commodity.b2cMinDelivery + '-' + commodity.b2cMaxDelivery"></span>
|
|
|
+ <span v-if="commodity.b2cMinDelivery == commodity.b2cMaxDelivery" v-text="commodity.b2cMinDelivery" :title="commodity.b2cMinDelivery"></span>
|
|
|
+ </div>
|
|
|
+ <div v-if="!commodity.b2cMinDelivery"><span>—</span></div>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <div v-if="commodity.attach">
|
|
|
+ <a @click="goAttach(commodity.attach, $event)" target="_blank"><img src="/images/store/common/pdf.png" alt=""/></a>
|
|
|
+ </div>
|
|
|
+ <div v-if="!commodity.attach">—</div>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <buy :item="commodity"></buy>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <tr class="active-empty" v-if="!commodities.content || commodities.content.length == 0">
|
|
|
+ <td colspan="10" style="height: 880px;">
|
|
|
+ <div class="text-center">
|
|
|
+ <div class="col-xs-offset-3 col-xs-2">
|
|
|
+ <img src="/images/brandList/empty-cart.jpg">
|
|
|
+ </div>
|
|
|
+ <div class="col-xs-4 txt-info">
|
|
|
+ <p class="grey f16"> 暂无产品信息</p>
|
|
|
+ <i class="iconfont" v-if="emptyShow === false"></i> <a v-if="emptyShow === false" href="/">返回首页</a>
|
|
|
+ <img v-if="emptyShow === true" src="/images/brandList/upload.png"> <a v-if="emptyShow === true" href="/vendor#/vendor_upload?type=company" target="_blank">马上去上传</a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ <div style="float: right;margin-right: 12px;">
|
|
|
+ <page :total="commodities.totalElements" :page-size="pageParams.count"
|
|
|
+ :current="pageParams.page" @childEvent="handleCurrentChange"></page>
|
|
|
+ </div>
|
|
|
+ <link-saler-box
|
|
|
+ :tel="tel"
|
|
|
+ v-if="showLinkBox"
|
|
|
+ @cancelAction="showLinkBox = false">
|
|
|
+ </link-saler-box>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+ function getAllLeafIds (kind) {
|
|
|
+ if (!kind) {
|
|
|
+ return null
|
|
|
+ }
|
|
|
+ if (kind.isLeaf === 1) {
|
|
|
+ return kind.id
|
|
|
+ } else {
|
|
|
+ if (!kind.children || kind.children.length === 0) {
|
|
|
+ return null
|
|
|
+ }
|
|
|
+ let ids = []
|
|
|
+ for (let i = 0; i < kind.children.length; i++) {
|
|
|
+ ids.push(getAllLeafIds(kind.children[i]))
|
|
|
+ }
|
|
|
+ return ids.join(',')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ import Buy from '~components/common/buyOrCar/buyComponent.vue'
|
|
|
+ import Page from '~components/common/page/pageComponent.vue'
|
|
|
+ import LinkSalerBox from '~components/common/LinkSalerBox.vue'
|
|
|
+ export default {
|
|
|
+ name: 'commodity-list',
|
|
|
+ props: ['kinds'],
|
|
|
+ components: {
|
|
|
+ Buy,
|
|
|
+ Page,
|
|
|
+ LinkSalerBox
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ defaultProps: {
|
|
|
+ children: 'children',
|
|
|
+ label: 'nameCn'
|
|
|
+ },
|
|
|
+ pageParams: {
|
|
|
+ page: 1,
|
|
|
+ count: 10
|
|
|
+ },
|
|
|
+ searchCode: '',
|
|
|
+ parentKindId: 0,
|
|
|
+ ids: null,
|
|
|
+ showLinkBox: false,
|
|
|
+ tel: ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ currency: function (num) {
|
|
|
+ if (typeof num === 'number') {
|
|
|
+ if (num <= 0.000001) {
|
|
|
+ num = 0.000001
|
|
|
+ } else {
|
|
|
+ if (num.toString().indexOf('.') === -1) {
|
|
|
+ num += '.00'
|
|
|
+ } else {
|
|
|
+ let inputStr = num.toString()
|
|
|
+ let arr = inputStr.split('.')
|
|
|
+ let floatNum = arr[1]
|
|
|
+ if (floatNum.length > 6) {
|
|
|
+ num = inputStr.substring(0, arr[0].length + 7)
|
|
|
+ if (Number(floatNum.charAt(6)) > 4) {
|
|
|
+ num = (Number(num) * 1000000 + 1) / 1000000
|
|
|
+ }
|
|
|
+ } else if (floatNum.length === 1) {
|
|
|
+ num = num + '0'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return num
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ commodities () {
|
|
|
+ return this.$store.state.shop.storeInfo.storeCommodity.data
|
|
|
+ },
|
|
|
+ storeInfo () {
|
|
|
+ return this.$store.state.shop.storeInfo.store.data
|
|
|
+ },
|
|
|
+ user () {
|
|
|
+ return this.$store.state.option.user
|
|
|
+ },
|
|
|
+ tab () {
|
|
|
+ return this.$store.state.chat.tab.tab.data
|
|
|
+ },
|
|
|
+ isConsignment () {
|
|
|
+ return this.storeInfo.type === 'CONSIGNMENT'
|
|
|
+ },
|
|
|
+ storeStatus () {
|
|
|
+ return this.$store.state.option.storeStatus.data
|
|
|
+ },
|
|
|
+ emptyShow () {
|
|
|
+ let loggedStatus = false
|
|
|
+ if (this.user.logged && this.user.data.enterprise.uu) {
|
|
|
+ if (this.storeStatus.uuid === this.storeInfo.uuid) {
|
|
|
+ loggedStatus = true
|
|
|
+ } else {
|
|
|
+ loggedStatus = false
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ loggedStatus = false
|
|
|
+ }
|
|
|
+ return loggedStatus
|
|
|
+ },
|
|
|
+ enterprise () {
|
|
|
+ let ens = this.user.data.enterprises
|
|
|
+ if (ens && ens.length) {
|
|
|
+ return ens.find(item => item.current) || {enName: '个人账户'}
|
|
|
+ } else {
|
|
|
+ return {enName: '个人账户'}
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ kinds: {
|
|
|
+ handler: function (val) {
|
|
|
+ if (val) {
|
|
|
+ val.forEach((item) => {
|
|
|
+ this.KindsNameChange(item)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ immediate: true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ sendprove: function () {
|
|
|
+ if (this.user.logged) {
|
|
|
+ if (this.enterprise && this.enterprise.isVendor === 313) {
|
|
|
+ window.open('/vendor#/vendor_upload')
|
|
|
+ } else {
|
|
|
+ this.$router.push('/register-saler')
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$router.push('/auth/login?returnUrl=' + window.location.href)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ goLink: function () {
|
|
|
+ this.baseUtils.goLinkUser(this, this.storeInfo.enUU)
|
|
|
+ },
|
|
|
+ KindsNameChange: function (obj) {
|
|
|
+ obj.nameCn += (obj.count ? ` (${obj.count})` : '')
|
|
|
+ if (obj.children && obj.children.length) {
|
|
|
+ obj.children.forEach((item) => {
|
|
|
+ this.KindsNameChange(item)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ goAttach: function (url, event) {
|
|
|
+ event.stopPropagation()
|
|
|
+ if (this.user.logged) {
|
|
|
+ if (url && url !== '1') {
|
|
|
+ window.open(url)
|
|
|
+ } else {
|
|
|
+ this.$message.error('规格书地址错误')
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$http.get('/login/page', {params: {returnUrl: window.location.href}}).then(response => {
|
|
|
+ if (response.data) {
|
|
|
+ window.location.href = response.data.content + '&baseUrl=' + encodeURIComponent(window.location.protocol + '//' + window.location.host + response.data.baseUrl)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handlerCurrentNode (data, node) {
|
|
|
+ this.searchCode = ''
|
|
|
+ if (this.parentKindId === data.id) {
|
|
|
+ this.parentKindId = 0
|
|
|
+ this.ids = null
|
|
|
+ } else {
|
|
|
+ if (data.level === 1) {
|
|
|
+ this.parentKindId = data.id
|
|
|
+ }
|
|
|
+ this.ids = getAllLeafIds(data)
|
|
|
+ }
|
|
|
+ this.pageParams.page = 1
|
|
|
+
|
|
|
+ this.pageCommodity(this.pageParams, this.ids)
|
|
|
+ },
|
|
|
+ onNodeCollapse () {
|
|
|
+ this.parentKindId = ''
|
|
|
+ },
|
|
|
+ goodsSearch (keyword) {
|
|
|
+ this.pageParams.page = 1
|
|
|
+ this.pageCommodity(this.pageParams, this.ids, keyword)
|
|
|
+ },
|
|
|
+ async pageCommodity (pageParams, kindId, keyword) {
|
|
|
+// pageCommodity (pageParams, kindId, keyword) {
|
|
|
+ let params = { storeid: process.env.pcbId, origin: 'store', kindUuid: kindId, code: keyword }
|
|
|
+ params.page = pageParams.page
|
|
|
+ params.count = pageParams.count
|
|
|
+ try {
|
|
|
+ let { data } = await this.$http.get('/api/commodity/commodities', { params })
|
|
|
+ this.$store.commit('shop/storeInfo/GET_STORE_COMMODITY_SUCCESS', data)
|
|
|
+ } catch (err) {
|
|
|
+ this.$store.commit('shop/storeInfo/GET_STORE_COMMODITY_FAILURE', err)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleCurrentChange (page) {
|
|
|
+ this.pageParams.page = page
|
|
|
+ this.pageCommodity(this.pageParams, this.ids, this.searchCode)
|
|
|
+ },
|
|
|
+ isSpecificPriceTag: function (tag) {
|
|
|
+ return tag && tag.indexOf('特价') !== -1
|
|
|
+ },
|
|
|
+ goBatchDetail (type) {
|
|
|
+ window.open('/pcb/product/'+ type.productid +'/'+ type.batchCode)
|
|
|
+ },
|
|
|
+ goBrandDetail (url, event) {
|
|
|
+ event.stopPropagation()
|
|
|
+ window.open(url)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style>
|
|
|
+ #goods-list-fragment{
|
|
|
+ width: 100%;
|
|
|
+ background: #ece9ec;
|
|
|
+ /*padding-top: 20px;*/
|
|
|
+ }
|
|
|
+ #goods-list-fragment .container{
|
|
|
+ width: 965px;
|
|
|
+ padding: 0;
|
|
|
+ /*height: 738px;*/
|
|
|
+ background: #ece9ec;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 产品分类调整*/
|
|
|
+ #goods-list-fragment .category-content{
|
|
|
+ max-height: 496px;
|
|
|
+ min-height: 224px;
|
|
|
+ overflow-y: scroll;
|
|
|
+ overflow-x: hidden;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .category-content .empty{
|
|
|
+ display: block;
|
|
|
+ width: 56px;
|
|
|
+ height: 16px;
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-28px, -8px);
|
|
|
+ color: #5e7382;
|
|
|
+ }
|
|
|
+
|
|
|
+ .category-content el-tree{
|
|
|
+ /*border: none;*/
|
|
|
+ }
|
|
|
+ .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content,.el-tree-node:hover{
|
|
|
+ background: none !important;
|
|
|
+ }
|
|
|
+ .el-tree-node__content:hover{
|
|
|
+ background: none !important;
|
|
|
+ }
|
|
|
+ .el-tree-node__content:hover span{
|
|
|
+ color: #3c7df3;
|
|
|
+ }
|
|
|
+ .el-tree-node__content:hover span:last-child {
|
|
|
+ /*text-decoration: underline;*/
|
|
|
+ }
|
|
|
+ .el-pagination .el-pager li.active{
|
|
|
+ background-color: #5078cb;
|
|
|
+ border-color: #337ab7;
|
|
|
+ }
|
|
|
+ .el-tree-node__expand-icon{
|
|
|
+ margin-left: 3px;
|
|
|
+ font-family: "iconfont" !important;
|
|
|
+ font-size: 14px;
|
|
|
+ font-style: normal;
|
|
|
+ -webkit-font-smoothing: antialiased;
|
|
|
+ width: inherit;
|
|
|
+ height: inherit;
|
|
|
+ border: inherit;
|
|
|
+ font-weight: bold;
|
|
|
+ text-shadow: -1px 0px 0 #333;
|
|
|
+ margin-right: 3px !important;
|
|
|
+ }
|
|
|
+ .el-tree-node__content{
|
|
|
+ line-height: 30px;
|
|
|
+ height: 30px;
|
|
|
+ }
|
|
|
+ .el-tree-node__expand-icon.is-leaf{
|
|
|
+ visibility: hidden;
|
|
|
+ }
|
|
|
+ .el-tree-node__expand-icon:before{
|
|
|
+ content: "\E621";
|
|
|
+ }
|
|
|
+ #goods-list-fragment .category-title {
|
|
|
+ height: 34px;
|
|
|
+ background-color: #3c7df5;
|
|
|
+ font-size: 16px;
|
|
|
+ color: rgb(255,255,255);
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .category-content li {
|
|
|
+ line-height: 33px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333;
|
|
|
+ float: left;
|
|
|
+ width: 100%;
|
|
|
+ padding-left: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .category-content li a {
|
|
|
+ display: block;
|
|
|
+ padding-left: 15px;
|
|
|
+ text-decoration: none;
|
|
|
+ color: #333;
|
|
|
+ /* background:url("static/img/store/default/openblackR.png") no-repeat left; */
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .category-content li a:hover{
|
|
|
+ color: #5078cb;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .category-content ul.list-body {
|
|
|
+ display: none;
|
|
|
+ color: #666;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .category-content ul.list-body.active {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .category-content ul.list-body li {
|
|
|
+ float: none;
|
|
|
+ background-image: none;
|
|
|
+ min-height: 26px;
|
|
|
+ line-height: 26px;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .category-content ul.list-body li a {
|
|
|
+ padding-left: 15px;
|
|
|
+ display: block;
|
|
|
+ color: rgb(50,50,50);
|
|
|
+ background: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .category-content ul.list-body li a:hover {
|
|
|
+ color: #5078cb;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .category-content ul.list-body li a.cur {
|
|
|
+ text-decoration: none;
|
|
|
+ font-size: 14px;
|
|
|
+ /* background:url("static/img/store/default/openblackR.png") no-repeat left; */
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .title-area {
|
|
|
+ margin-bottom: 30px;
|
|
|
+ width: 250px;
|
|
|
+ float: left;
|
|
|
+ background: #fff;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .category-content{
|
|
|
+ border: 1px solid #e8e8e8;
|
|
|
+ }
|
|
|
+ /* goods-area */
|
|
|
+ #goods-list-fragment .goods-area {
|
|
|
+ /*margin-left: 3px;*/
|
|
|
+ float: left;
|
|
|
+ /*margin-bottom: 30px;*/
|
|
|
+ background: #fff;
|
|
|
+ margin: 0 auto 24px;
|
|
|
+ height: 914px;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .goods-area .btn-line {
|
|
|
+ border-radius: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ #goods-list-fragment .btn-info.btn-line {
|
|
|
+ background-color: #5078CB;
|
|
|
+ color: #fff;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .btn-line {
|
|
|
+ height: 34px;
|
|
|
+ width: 150px;
|
|
|
+ border: 1px solid #5078cb;
|
|
|
+ background-color: #fff;
|
|
|
+ color: rgb(80,120,203);
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .btn-line:hover {
|
|
|
+ background-color: #5078CB;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 物品列表 */
|
|
|
+ #goods-list-fragment .goodslist .brand-code {
|
|
|
+ font-size: 12px;
|
|
|
+ text-align: center;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ #goods-list-fragment #search_btn {
|
|
|
+ background: #2496f1;
|
|
|
+ color: #FFF;
|
|
|
+ border-bottom-right-radius: 3px;
|
|
|
+ border-top-right-radius: 3px;
|
|
|
+ border-bottom-left-radius: 0px;
|
|
|
+ border-top-left-radius: 0px;
|
|
|
+ height: 28px;
|
|
|
+ width: 69px;
|
|
|
+ padding-right: 50px;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .sendprove {
|
|
|
+ width: 110px;
|
|
|
+ height: 28px;
|
|
|
+ color: #2496f1;
|
|
|
+ font-size: 14px;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 3px;
|
|
|
+ float: right;
|
|
|
+ margin-left: 10px;
|
|
|
+ border: 1px solid #2496f1;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .sendprove:hover{
|
|
|
+ background-color: #2496f1;
|
|
|
+ border-color: #2496f1;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ .btn:focus,.btn:active:focus,.btn.active:focus,.btn.focus,.btn:active.focus,.btn.active.focus {
|
|
|
+ outline: none;
|
|
|
+ border-color: transparent;
|
|
|
+ }
|
|
|
+ #goods-list-fragment #search_input {
|
|
|
+ font-size: 14px;
|
|
|
+ height: 28px;
|
|
|
+ line-height: 28px;
|
|
|
+ width: 189px;
|
|
|
+ float: right;
|
|
|
+ border-bottom-left-radius: 3px;
|
|
|
+ border-top-left-radius: 3px;
|
|
|
+ border: 1px solid #2496f1;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .brand-code .code {
|
|
|
+ font-weight: 600;
|
|
|
+ word-break: break-all;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-line-clamp: 2;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .brand-code .spec {
|
|
|
+ word-break: break-all;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-line-clamp: 2;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .brand-code .brand a {
|
|
|
+ color: #2496f1;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .brand-code .brand span{
|
|
|
+ color: #2496f1;
|
|
|
+ word-break: break-all;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-line-clamp: 2;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist thead tr{
|
|
|
+ background-color: #2496f1;
|
|
|
+ height: 34px;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist tr th {
|
|
|
+ color: #fefefe;
|
|
|
+ font-size: 13px;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist tr th:first-child{
|
|
|
+ border-top-left-radius: 5px;
|
|
|
+ border-bottom-left-radius: 5px;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist tr th:last-child{
|
|
|
+ border-top-right-radius: 5px;
|
|
|
+ border-bottom-right-radius: 5px;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist tr th div{
|
|
|
+ text-align: center;
|
|
|
+ border-right: 1px solid #fff;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist tr th:last-child div{
|
|
|
+ border-right: none;
|
|
|
+ }
|
|
|
+ #goodslist-content .goods,#goodslist-content .from, #goodslist-content .can-div-sell {
|
|
|
+ padding-left: 20px;
|
|
|
+ }
|
|
|
+ #goodslist-content .goods span{
|
|
|
+ /*color: #f01010;*/
|
|
|
+ }
|
|
|
+ #goodslist-content .amount {
|
|
|
+ width: 50%;
|
|
|
+ float: left;
|
|
|
+ padding-left: 30px;
|
|
|
+ text-align:left;
|
|
|
+ }
|
|
|
+ #goodslist-content .amount div{
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ #goodslist-content .amount div:last-child{
|
|
|
+ /*color: #f01010;*/
|
|
|
+ }
|
|
|
+ #goodslist-content .price {
|
|
|
+ width: 50%;
|
|
|
+ float:right;
|
|
|
+ text-align:left;
|
|
|
+ }
|
|
|
+ #goodslist-content .price div {
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ #goodslist-content .price div:last-child{
|
|
|
+ color: #f01010;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .category-content a.selected-node,
|
|
|
+ #goods-list-fragment .category-content ul.list-body li a.selected-node {
|
|
|
+ color: #5078cb;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .category-content a.selected-parent-node,
|
|
|
+ #goods-list-fragment .category-content ul.list-body li a.selected-parent-node {
|
|
|
+ /* background:url("static/img/store/default/openblack.png") no-repeat left; */
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist tbody>tr:hover{
|
|
|
+ background: #ecf2fd;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist tbody>tr {
|
|
|
+ border: 1px solid #e8e8e8;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist tbody>tr td.commodity-icon .img{
|
|
|
+ border: 1px solid #e8e8e8;
|
|
|
+ margin: 10px;
|
|
|
+ width: 80px;
|
|
|
+ height: 80px;
|
|
|
+ overflow: hidden;
|
|
|
+ line-height: 75px;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist tbody>tr td.commodity-icon .img>img {
|
|
|
+ width: 80px;
|
|
|
+ height: 80px;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist tbody>tr td.brand-code .sellout-store-commodity {
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist tbody>tr td.brand-code .specific-price-tag {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist td {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #333;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 20px;
|
|
|
+ height: 88px;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goodslist tbody>tr td .can-div-sell {
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 物品列表按钮 */
|
|
|
+ #goods-list-fragment .btn-buy-now {
|
|
|
+ background-color: #2496f1;
|
|
|
+ color: #fff;
|
|
|
+ width: 80px;
|
|
|
+ height: 24px;
|
|
|
+ font-size: 12px;
|
|
|
+ border: 1px solid #2496f1;
|
|
|
+ border-radius: 2px;
|
|
|
+ }
|
|
|
+
|
|
|
+ #goods-list-fragment .btn-add-cart {
|
|
|
+ margin-top: 10px;
|
|
|
+ color: #2496f1;
|
|
|
+ width: 80px;
|
|
|
+ height: 24px;
|
|
|
+ font-size: 12px;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 2px;
|
|
|
+ border: 1px solid #2496f1;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .btn-buy-now:hover{
|
|
|
+ background: #1278c7;
|
|
|
+ border: 1px solid #1278c7;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .btn-add-cart:hover{
|
|
|
+ background-color: #1278c7;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ .no-record{
|
|
|
+ font-size: 14px;
|
|
|
+ color: #999;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 200px;
|
|
|
+ }
|
|
|
+ .no-record i{
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+ .active-empty:hover{
|
|
|
+ background-color: #fff!important;
|
|
|
+ }
|
|
|
+ .text-center{
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 30px;
|
|
|
+ }
|
|
|
+ .text-center .col-xs-2 img{
|
|
|
+ margin: 55px 0 85px 135px;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+ .text-center .txt-info{
|
|
|
+ font-size: 14px;
|
|
|
+ margin: 50px 0px 0px -50px;
|
|
|
+ }
|
|
|
+ .text-center .col-xs-4 p{
|
|
|
+ color: #999;
|
|
|
+ margin: 11px 0px 4px -6px;
|
|
|
+ }
|
|
|
+ .text-center .txt-info i{
|
|
|
+ color: #5078cb;
|
|
|
+ }
|
|
|
+ .text-center .txt-info a{
|
|
|
+ font-size: 14px;
|
|
|
+ color: #5078cb;
|
|
|
+ }
|
|
|
+ .text-center .col-xs-5 img{
|
|
|
+ margin-left: -235px;
|
|
|
+ }
|
|
|
+ .goodslist{
|
|
|
+ margin-bottom: 24px;
|
|
|
+ }
|
|
|
+ .remind-area {
|
|
|
+ position: absolute;
|
|
|
+ top: 1005px;
|
|
|
+ }
|
|
|
+ .remind-area img {
|
|
|
+ margin-right: 12px;
|
|
|
+ }
|
|
|
+ .remind-area .link-seller {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #fff;
|
|
|
+ line-height: 20px;
|
|
|
+ height: 20px;
|
|
|
+ padding: 0 7px;
|
|
|
+ background: #2496f1;
|
|
|
+ border-radius: 2px;
|
|
|
+ }
|
|
|
+ @font-face {
|
|
|
+ font-family: 'iconfont'; /* project id 357960 */
|
|
|
+ src: url('//at.alicdn.com/t/font_27kjyd082ezpk3xr.eot');
|
|
|
+ src: url('//at.alicdn.com/t/font_27kjyd082ezpk3xr.eot?#iefix') format('embedded-opentype'),
|
|
|
+ url('//at.alicdn.com/t/font_27kjyd082ezpk3xr.woff') format('woff'),
|
|
|
+ url('//at.alicdn.com/t/font_27kjyd082ezpk3xr.ttf') format('truetype'),
|
|
|
+ url('//at.alicdn.com/t/font_27kjyd082ezpk3xr.svg#iconfont') format('svg');
|
|
|
+ }
|
|
|
+
|
|
|
+ <!-- 分页 -->
|
|
|
+ #goods-list-fragment .el-pagination .el-pager li.active {
|
|
|
+ border-color: #5078cb !important;
|
|
|
+ background-color: #5078cb !important;
|
|
|
+ }
|
|
|
+ #goods-list-fragment .goods-area div>.page-wrap{
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+</style>
|
|
|
+
|
yangc
