This commit is contained in:
faiz 2024-04-05 18:19:51 +08:00
parent 39000c124b
commit 61242276f7
13 changed files with 610 additions and 18 deletions

View File

@ -1,5 +1,6 @@
module.exports = {
presets: [
'@vue/app'
]
],
plugins: ["@babel/plugin-proposal-optional-chaining"]
}

View File

@ -94,6 +94,7 @@
},
"devDependencies": {
"@babel/core": "7.0.0",
"@babel/plugin-proposal-optional-chaining": "^7.21.0",
"@babel/register": "7.0.0",
"@vue/cli-plugin-babel": "3.5.3",
"@vue/cli-plugin-eslint": "^3.9.1",

View File

@ -15,6 +15,24 @@ import request from './request'
export function orderListApi(data) {
return request.get('order/lst', data)
}
/**
* @description 退款订单 -- 详情
*/
export function refundorderDetailApi(id) {
return request.get(`order/refund/detail/${id}`)
}
/**
* @description 退款订单 -- 记录from
*/
export function refundorderLogApi(id) {
return request.get(`order/refund/log/${id}`)
}
/**
* @description 退款订单 -- 审核from
*/
export function refundorderStatusApi(id) {
return request.get(`order/refund/status/${id}/form`)
}
/**
* @description 开启退款
*/

View File

@ -160,7 +160,7 @@
<el-table-column prop="mer_money" label="商户余额(元)" min-width="120"/>
<el-table-column label="操作" min-width="180" fixed="right">
<template slot-scope="scope">
<el-button v-if="scope.row.status == 0" type="text" size="small" @click="transferDetail(scope.row.financial_id)">审核</el-button>
<el-button v-if="scope.row.status == 0" type="text" size="small" @click="transferDetail(scope.row.financial_id)">{{ getStatusName(scope.row.status) }}</el-button>
<el-button v-if="scope.row.status == 1 && scope.row.financial_status != 1" type="text" size="small" @click="transferDetail(scope.row.financial_id,1)">转账</el-button>
<el-button v-if="scope.row.status == 1 && scope.row.financial_status == 1" type="text" size="small" @click="transferDetail(scope.row.financial_id,0)">转账信息</el-button>
<el-button type="text" size="small" @click="transferMark(scope.row.financial_id)">备注</el-button>
@ -339,6 +339,16 @@ export default {
this.getHeaderData();
},
methods: {
getStatusName(val){
switch (val) {
case 0:
return '初始审核';
case 10:
return '第二步审核';
case 11:
return '最终审核';
}
},
/**重置 */
searchReset(){
this.timeVal = []

View File

@ -170,7 +170,6 @@ export default {
if(!res.data.financial_bank){
this.merData.financial_bank = financial_bank;
}
console.log(this.merData);
if(!this.isEdit)this.$refs.merInfo.onOperateLog(this.merId);
})
.catch((res) => {
@ -179,7 +178,12 @@ export default {
},
initData(){
this.merData = {
is_trader:0
is_trader:0,
financial_bank:{
name:'',
bank:'',
bank_code:'',
}
}
this.isEdit = false;
this.isAdd = true;

View File

@ -129,6 +129,17 @@
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="每日提现额度:" prop="exchange_limit">
<el-input
size="small"
oninput ="value=value.replace(/[^\d]/g,'')"
v-model="merData.exchange_limit"
placeholder="请输入每日提现额度"
class="selWidth"
/>
</el-form-item>
</el-col>
</el-row>
<div class="title">银行卡信息</div>
<el-row v-if="merData.financial_bank">
@ -158,6 +169,7 @@
<el-form-item label="开户银行卡号:" prop="financial_bank.bank_code">
<el-input
size="small"
oninput ="value=value.replace(/[^\d]/g,'')"
v-model="merData.financial_bank.bank_code"
placeholder="请输入开户银行卡号"
class="selWidth"

View File

@ -50,13 +50,38 @@
<div>更新时间</div>
<div class="value">{{merData.update_time}}</div>
</li>
<li class="item">
<div>每日提现额度</div>
<div class="value">{{merData.exchange_limit}}</div>
</li>
<li class="item">
<div>备注</div>
<div class="value">{{merData.mark}}</div>
</li>
<li class="item" style="align-content: center;">
<div>营业执照</div>
<el-image style="width: 60px;height: 60px;" :src="merData.ext.company_image[0]" :preview-src-list="merData.ext.company_image" />
<el-image v-for="(item,index) in companyImage" :key="index" style="width: 60px;height: 60px;" :src="item" :preview-src-list="companyImage" />
</li>
</ul>
<div class="title" style="margin-top: 10px;">银行卡信息</div>
<ul class="list">
<li class="item">
<div>名称</div>
<div class="value">
{{merData.financial_bank&&merData.financial_bank.name}}
</div>
</li>
<li class="item">
<div>开户银行</div>
<div class="value">
{{merData.financial_bank&&merData.financial_bank.bank}}
</div>
</li>
<li class="item">
<div>开户卡号</div>
<div class="value">
{{merData.financial_bank&&merData.financial_bank.bank_code}}
</div>
</li>
</ul>
</div>
@ -318,6 +343,11 @@ export default {
},
filters: {
},
computed: {
companyImage(){
return this.merData.ext?.company_image
}
},
methods: {
lookImg(item) {
this.imageUrl = item;

View File

@ -106,6 +106,16 @@
>
<el-table-column prop="mer_id" label="ID" min-width="60" />
<el-table-column prop="mer_name" label="商户名称" min-width="150" />
<el-table-column prop="is_huimei" label="是否惠美乡村" min-width="100">
<template slot-scope="scope">
<span>{{scope.row.is_huimei == 1 ? '是' : '否'}}</span>
</template>
</el-table-column>
<el-table-column prop="is_soldier" label="是否军人" min-width="80">
<template slot-scope="scope">
<span>{{scope.row.is_soldier == 1 ? '是' : '否'}}</span>
</template>
</el-table-column>
<el-table-column prop="real_name" label="商户姓名" min-width="150" />
<el-table-column prop="status" label="推荐" min-width="100">
<template slot-scope="scope">

View File

@ -153,6 +153,8 @@
size="small"
@click="onOrderDetail(scope.row.order.order_sn)"
>订单详情</el-button>
<el-button v-if="scope.row.status === 0" type="text" size="small" @click="onOrderStatus(scope.row.refund_order_id)">退款</el-button>
<el-button type="text" size="small" @click="onRefundOrderDetail(scope.row.refund_order_id)">退款单详情</el-button>
</template>
</el-table-column>
</el-table>
@ -170,6 +172,8 @@
</el-card>
<!--导出订单列表-->
<file-list ref="exportList" />
<!--详情-->
<details-from ref="orderDetail" :order-datalist="orderDatalist" @get-logistics="openLogistics" />
</div>
</template>
@ -186,15 +190,18 @@
import {
refundorderListApi,
orderUpdateApi,
refundorderStatusApi,
refundorderDetailApi,
orderDeliveryApi, exportRefundOrderApi
} from "@/api/order";
import createWorkBook from '@/utils/newToExcel.js';
import detailsFrom from './refundDetail'
import { fromList } from "@/libs/constants.js";
import fileList from '@/components/exportFile/fileList'
import { roterPre } from "@/settings";
import timeOptions from '@/utils/timeOptions';
export default {
components: { fileList },
components: { fileList,detailsFrom },
name: "OrderRefund",
data() {
return {
@ -232,6 +239,9 @@ export default {
dialogVisible: false,
cardLists: [],
orderDatalist: null,
orderDetails: {},
result: [],
dialogLogistics:false
};
},
mounted() {
@ -252,6 +262,45 @@ export default {
this.getList('');
},
methods: {
// 退
onOrderStatus(id) {
this.$modalForm(refundorderStatusApi(id)).then(() => this.getList(''))
},
//
onRefundOrderDetail(id) {
this.orderId = id
this.$refs.orderDetail.dialogVisible = true
this.loading = true
refundorderDetailApi(id)
.then(res => {
this.orderDatalist = res.data
this.loading = false
this.$refs.orderDetail.onOrderLog(id)
})
.catch(({ message }) => {
this.loading = false
this.$message.error(message)
})
},
openLogistics(row) {
this.orderDetails = row
this.getOrderData(row.refund_order_id)
this.dialogLogistics = true
},
handleClose() {
this.dialogLogistics = false
this.dialogConfirm = false
},
//
getOrderData(id) {
refundorderExpressApi(id)
.then(async res => {
this.result = res.data
})
.catch(res => {
this.$message.error(res.message)
})
},
/**重置 */
searchReset(){
this.timeVal = []

View File

@ -0,0 +1,192 @@
<template>
<el-dialog
v-if="orderDatalist"
v-loading="loading"
title="退款单信息"
:visible.sync="dialogVisible"
width="700px"
>
<div class="description">
<div class="title">用户信息</div>
<div class="acea-row">
<div class="description-term">用户昵称{{ orderDatalist.user.nickname }}</div>
<div class="description-term">退货人{{ orderDatalist.order.real_name }}</div>
<div class="description-term">联系电话{{ orderDatalist.order.user_phone }}</div>
<div class="description-term">退货地址{{ orderDatalist.order.user_address }}</div>
<div class="description-term">备注{{ orderDatalist.mark }}</div>
</div>
<el-divider />
<div class="title">{{orderDatalist.refund_type == 1 ? '退款信息' : '退回商品信息'}}</div>
<div class="acea-row">
<div class="description-term">订单编号{{ orderDatalist.order.order_sn }}</div>
<div class="description-term">订单状态{{ orderDatalist.status | orderRefundFilter }}</div>
<div class="description-term100">退款单号{{ orderDatalist.refund_order_sn }}</div>
<div class="description-term100">退款商品名称
<div class="product_name">
<div v-for="(item,index) in orderDatalist.refundProduct" :key="index">
<span v-if="item.product && item.product.cart_info && item.product.cart_info.product">{{item.product.cart_info.product.store_name}}</span>
</div>
</div>
</div>
<div class="description-term">退款发起方{{ orderDatalist.create_user }}</div>
<div class="description-term">退款商品件数{{ orderDatalist.refund_num }}</div>
<div class="description-term">退款总金额{{ orderDatalist.refund_price }}</div>
<div v-if="orderDatalist.delivery_id" class="description-term">退货快递单号{{ orderDatalist.delivery_id }}</div>
<div class="description-term">创建时间{{ orderDatalist.create_time }}</div>
<div class="description-term">商家备注{{ orderDatalist.mer_mark }}</div>
<div class="description-term100">退款凭证
<div class="product_name" style="margin-left: 70px;">
<div class="demo-image__preview">
<el-image
v-for="(item,index) in orderDatalist.pics"
:key="index"
:src="item"
class="mr5"
:preview-src-list="[item]"
/>
</div>
</div>
</div>
</div>
<el-divider />
<div class="title">订单记录</div>
<el-table v-loading="LogLoading" border :data="tableDataLog.data" style="width: 100%">
<el-table-column prop="order_id" align="center" label="退款单ID" min-width="80" />
<el-table-column prop="change_message" label="操作记录" align="center" min-width="280" />
<el-table-column prop="change_time" label="操作时间" align="center" min-width="280" />
</el-table>
<div class="block">
<el-pagination
:page-size="tableFromLog.limit"
:current-page="tableFromLog.page"
layout="prev, pager, next, jumper"
:total="tableDataLog.total"
@size-change="handleSizeChangeLog"
@current-change="pageChangeLog"
/>
</div>
<el-divider />
<div v-if="(orderDatalist.status == 2 || orderDatalist.status == 3) && orderDatalist.refund_type == 2">
<div class="title">退货物流信息</div>
<div class="acea-row">
<div class="description-term">
快递公司{{ orderDatalist.delivery_type }}
<el-button size="small" type="text" style="margin-left: 10px;" @click="getLoginstics">物流查询</el-button>
</div>
<div class="description-term">快递单号{{ orderDatalist.delivery_id }}</div>
</div>
</div>
</div>
</el-dialog>
</template>
<script>
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEBCRMEB
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import {
refundorderLogApi
} from '@/api/order'
export default {
name: 'OrderDetail',
props: {
orderDatalist: {
type: Object,
default: null
}
},
data() {
return {
dialogVisible: false,
LogLoading: false,
// orderDatalist: null,
loading: false,
listLoading: true,
order_id: '',
tableDataLog: {
data: [],
total: 0,
},
tableFromLog: {
page: 1,
limit: 5
},
}
},
mounted() {
},
methods: {
//
onOrderLog(id) {
this.LogLoading = true
this.order_id = id;
refundorderLogApi(id, this.tableFromLog)
.then(res => {
this.tableDataLog.data = res.data.list
this.tableDataLog.total = res.data.count
this.LogLoading = false
})
.catch(res => {
this.$message.error(res.message)
this.LogLoading = false
})
},
/**查看物流 */
getLoginstics(){
this.$emit('get-logistics',this.orderDatalist)
},
pageChangeLog(page) {
this.tableFromLog.page = page
this.onOrderLog(this.order_id)
},
handleSizeChangeLog(val) {
this.tableFromLog.limit = val
this.onOrderLog(this.order_id)
},
}
}
</script>
<style scoped lang="scss">
.title{
margin-bottom: 16px;
color: #17233d;
font-weight: 500;
font-size: 14px;
}
.description{
&-term {
display: table-cell;
padding-bottom: 10px;
line-height: 20px;
width: 50%;
font-size: 12px;
}
}
.description-term100{
display: table-cell;
padding-bottom: 10px;
line-height: 20px;
width: 100%;
font-size: 12px;
}
.product_name{
margin-left: 90px;
position: relative;
top: -20px;
}
.demo-image__preview {
.el-image,img{
width: 40px;
height: 40px;
}
}
</style>

View File

@ -135,6 +135,7 @@
<span>{{ scope.row.merchant ? scope.row.merchant.mer_name : '' }}</span>
</template>
</el-table-column>
<el-table-column prop="remark" label="商品备注" min-width="100" />
<el-table-column label="是否惠美乡村产品" min-width="100">
<template slot-scope="scope">
<span>{{ scope.row.is_soldier ? '是' : '否' }}</span>

View File

@ -103,7 +103,7 @@
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="qualification.businessList"
:preview-src-list="[item.url]"
/>
</div>
</div>
@ -121,7 +121,7 @@
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="qualification.trademarkList"
:preview-src-list="[item.url]"
/>
</div>
</div>
@ -139,7 +139,7 @@
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="qualification.authorizedList"
:preview-src-list="[item.url]"
/>
</div>
</div>
@ -157,7 +157,7 @@
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="qualification.commodityList"
:preview-src-list="[item.url]"
/>
</div>
</div>
@ -175,7 +175,7 @@
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="qualification.otherList"
:preview-src-list="[item.url]"
/>
</div>
</div>
@ -196,7 +196,7 @@
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="qualification.importBusinessList"
:preview-src-list="[item.url]"
/>
</div>
</div>
@ -214,7 +214,7 @@
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="qualification.importAuthorizedList"
:preview-src-list="[item.url]"
/>
</div>
</div>
@ -232,7 +232,7 @@
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="qualification.customsList"
:preview-src-list="[item.url]"
/>
</div>
</div>
@ -250,7 +250,7 @@
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="qualification.packingList"
:preview-src-list="[item.url]"
/>
</div>
</div>
@ -268,7 +268,7 @@
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="qualification.importOtherList"
:preview-src-list="[item.url]"
/>
</div>
</div>

View File

@ -48,11 +48,23 @@
<ul class="list">
<li class="item item100">
<div class="item-title">封面图</div>
<img :src="productData.image" style="width:40px;height:40px;margin-right:12px;"/>
<!-- <img :src="productData.image" style="width:40px;height:40px;margin-right:12px;"/> -->
<el-image
style="width: 60px; height: 60px"
:src="productData.image"
:preview-src-list="[productData.image]"
/>
</li>
<li class="item item100">
<div class="item-title">轮播图</div>
<img v-for="(pic,idx) in productData.slider_image" :key="idx" :src="pic" style="width:40px;height:40px;margin-right:12px;"/>
<el-image
v-for="(pic,idx) in productData.slider_image"
style="width: 60px; height: 60px"
:key="idx"
:src="pic"
:preview-src-list="productData.slider_image"
/>
<!-- <img v-for="(pic,idx) in productData.slider_image" :key="idx" :src="pic" style="width:40px;height:40px;margin-right:12px;"/> -->
</li>
</ul>
<li class="item item100">
@ -144,6 +156,7 @@
<el-image
style="width: 60px; height: 60px"
:src="scope.row.image"
:preview-src-list="[scope.row.image]"
/>
</div>
</template>
@ -484,6 +497,200 @@
<el-pagination :page-size="recordForm.limit" :current-page="recordForm.page" layout="prev, pager, next, jumper" :total="recordData.total" @size-change="handleSizeChange" @current-change="pageChange" />
</div>
</div>
</el-tab-pane>
<el-tab-pane label="资质信息" name="aptitude">
<span class="sp">商品名称
<el-radio-group v-model="qualification.commodity_type">
<el-radio :label="0" class="radio" :disabled="qualification.commodity_type==1">国产</el-radio>
<el-radio :label="1" :disabled="qualification.commodity_type==0">进口</el-radio>
</el-radio-group>
</span>
<div v-if="qualification.commodity_type == 0">
<span class="sp">生产企业名称{{ qualification.production_name }}</span>
<span class="upload">
<div class="upload_left">生产营业执照</div>
<div class="upload_right">
<div
v-for="(item,index) in qualification.businessList"
:key="index"
>
<a class="txt" v-if="getType(item)" :href="item.url" target="downloadFile" download>{{ item.name }}</a>
<div class="pictrue" v-else>
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="[item.url]"
/>
</div>
</div>
</div>
</span>
<span class="upload">
<div class="upload_left">商标注册证</div>
<div class="upload_right">
<div
v-for="(item,index) in qualification.trademarkList"
:key="index"
>
<a class="txt" v-if="getType(item)" :href="item.url" target="downloadFile" download>{{ item.name }}</a>
<div class="pictrue" v-else>
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="[item.url]"
/>
</div>
</div>
</div>
</span>
<span class="upload">
<div class="upload_left">销售授权及其他</div>
<div class="upload_right">
<div
v-for="(item,index) in qualification.authorizedList"
:key="index"
>
<a class="txt" v-if="getType(item)" :href="item.url" target="downloadFile" download>{{ item.name }}</a>
<div class="pictrue" v-else>
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="[item.url]"
/>
</div>
</div>
</div>
</span>
<span class="upload">
<div class="upload_left">商品检测报告</div>
<div class="upload_right">
<div
v-for="(item,index) in qualification.commodityList"
:key="index"
>
<a class="txt" v-if="getType(item)" :href="item.url" target="downloadFile" download>{{ item.name }}</a>
<div class="pictrue" v-else>
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="[item.url]"
/>
</div>
</div>
</div>
</span>
<span class="upload">
<div class="upload_left">其他资质</div>
<div class="upload_right">
<div
v-for="(item,index) in qualification.otherList"
:key="index"
>
<a class="txt" v-if="getType(item)" :href="item.url" target="downloadFile" download>{{ item.name }}</a>
<div class="pictrue" v-else>
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="[item.url]"
/>
</div>
</div>
</div>
</span>
</div>
<div v-if="qualification.commodity_type == 1">
<span class="sp">进口/企业境内总代企业名称: {{ qualification.import_name }}</span>
<span class="upload">
<div class="upload_left">生产营业执照</div>
<div class="upload_right">
<div
v-for="(item,index) in qualification.importBusinessList"
:key="index"
>
<a class="txt" v-if="getType(item)" :href="item.url" target="downloadFile" download>{{ item.name }}</a>
<div class="pictrue" v-else>
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="[item.url]"
/>
</div>
</div>
</div>
</span>
<span class="upload">
<div class="upload_left">销售授权及其他</div>
<div class="upload_right">
<div
v-for="(item,index) in qualification.importAuthorizedList"
:key="index"
>
<a class="txt" v-if="getType(item)" :href="item.url" target="downloadFile" download>{{ item.name }}</a>
<div class="pictrue" v-else>
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="[item.url]"
/>
</div>
</div>
</div>
</span>
<span class="upload">
<div class="upload_left">海关检验检疫证书及报关单</div>
<div class="upload_right">
<div
v-for="(item,index) in qualification.customsList"
:key="index"
>
<a class="txt" v-if="getType(item)" :href="item.url" target="downloadFile" download>{{ item.name }}</a>
<div class="pictrue" v-else>
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="[item.url]"
/>
</div>
</div>
</div>
</span>
<span class="upload">
<div class="upload_left">产品外包装实物图</div>
<div class="upload_right">
<div
v-for="(item,index) in qualification.packingList"
:key="index"
>
<a class="txt" v-if="getType(item)" :href="item.url" target="downloadFile" download>{{ item.name }}</a>
<div class="pictrue" v-else>
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="[item.url]"
/>
</div>
</div>
</div>
</span>
<span class="upload">
<div class="upload_left">其他资质</div>
<div class="upload_right">
<div
v-for="(item,index) in qualification.importOtherList"
:key="index"
>
<a class="txt" v-if="getType(item)" :href="item.url" target="downloadFile" download>{{ item.name }}</a>
<div class="pictrue" v-else>
<el-image
style="width: 60px; height: 60px;"
:src="item.url"
:preview-src-list="[item.url]"
/>
</div>
</div>
</div>
</span>
</div>
</el-tab-pane>
</el-tabs>
</div>
@ -575,6 +782,23 @@ export default {
return {
loading: true,
productId: '',
qualification:{
production_name: '',
businessList: [],
licenceList: [],
trademarkList: [],
authorizedList: [],
commodityList: [],
otherList: [],
importBusinessList: [],
importAuthorizedList: [],
customsList: [],
packingList: [],
importOtherList: [],
commodity_type: 0,
brands_name: '',
import_name: ''
},
direction: 'rtl',
activeName: 'basic',
productData: {},
@ -617,6 +841,11 @@ export default {
filters: {
},
methods: {
getType(val){
var regex = /(?:\.([^.]+))?$/;
let suffix = regex.exec(val.url)[1]
return suffix == 'pdf'
},
handleClose() {
this.activeName = 'basic';
this.$emit('closeDrawer');
@ -627,6 +856,7 @@ export default {
productDetailApi(id).then(res => {
this.loading = false;
this.productData = res.data
this.qualification = res.data.qualification
this.mer_svip_status = res.data.mer_svip_status
this.svip_type = res.data.svip_price_type
if (this.productData.spec_type === 0) {
@ -764,6 +994,40 @@ export default {
}
}
}
.sp {
display: block;
// width: 33%;
margin-bottom: 20px;
}
.upload{
display: flex;
flex-direction: row;
// align-content: center;
align-items: center;
height: 60px;
// line-height: 60px;
margin-bottom: 20px;
&_right{
display: flex;
height: 60px;
}
&_left{
width: 115px;
}
.txt{
width: 60px;
height: 60px;
line-height: 60px;
overflow: hidden;
display: inline-block;
text-overflow: ellipsis;
white-space: nowrap;
border: 1px solid #DCDFE6;
border-radius: 4px;
margin-right: 10px;
color: blue;
}
}
.tabNumWidth{
max-height: 350px;
overflow-y: auto;