Commit 69ab632a by wangyalan-git

表格样式调整

parent f77cea0e
......@@ -26,7 +26,9 @@
</van-grid>
<!-- 筛选/-->
<van-row type="flex" align="center" class="menu">
<van-col span="8" :class="(!params.goodsCategoryId) && (!params.stockWarning)?'checked': ''" @click="queryAll">全部库存</van-col>
<van-col span="8" :class="(!params.goodsCategoryId) && (!params.stockWarning)?'checked': ''" @click="queryAll">
全部库存
</van-col>
<van-col span="8" class="menu-dropdown">
<van-dropdown-menu>
<van-dropdown-item :title="categoryTitle" v-model="params.goodsCategoryId" :options="categoryOptions"
......@@ -35,7 +37,7 @@
</van-col>
<van-col span="8" :class="params.stockWarning?'checked': ''" @click="changeStock">库存预警</van-col>
</van-row>
<!-- 表头-->
<!-- 表头-->
<div class="title">
<div>物品名称</div>
<div>型号</div>
......@@ -240,6 +242,9 @@ export default {
.tr div, .title div {
width: 25%;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
</style>
<template>
<div class="page">
<navbar title="详情" ></navbar>
<navbar title="详情"></navbar>
<div class="container">
<div class="info">
<p>申领人: <span>{{detail.memberName}}</span></p>
<p>所属部门:<span>{{detail.departmentName}}</span></p>
<p>员工编号:<span>{{detail.jobNo || '--'}}</span></p>
</div>
<table>
<tr>
<th>物品名称</th>
<th>型号</th>
<th>物品类别</th>
<th>数量</th>
</tr>
<tr v-for="(vor,v_index) in detail.vorList" :key="v_index">
<td>{{vor.goodsName}}</td>
<td>{{vor.goodsNo}}</td>
<td>{{vor.categoryName}}</td>
<td>
<div style="width: 100%;">
<div class="title">
<div>物品名称</div>
<div>型号</div>
<div>物品类别</div>
<div>数量</div>
</div>
<div v-for="(vor,v_index) in detail.vorList" :key="v_index" class="tr">
<div>{{vor.goodsName}}</div>
<div>{{vor.goodsNo}}</div>
<div>{{vor.categoryName}}</div>
<div>
{{vor.outboundNum}}
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { getOutBountDetail } from '@/api/code'
export default {
name: 'receiveDetail',
components: {
},
components: {},
data () {
return {
detail: {}
......@@ -71,30 +71,37 @@ export default {
.info span {
color: #020202;
}
table {
.title {
width: 100%;
background: #ffffff;
margin-top: 10px;
border-collapse: collapse;
}
table tr:first-child {
background: #f6f7f9;
height: 34px;
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 10px;
font-size: 13px;
color: #666666;
}
table tr {
.tr {
width: 100%;
font-size: 14px;
display: flex;
justify-content: space-between;
align-items: center;
height: 42px;
background: #ffffff;
}
table th {
color: #666666;
font-size: 14px;
.tr + .tr {
border-top: 1px solid #E8E8E8;
}
table td {
font-size: 14px;
.tr div, .title div {
width: 25%;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
</style>
......@@ -7,27 +7,27 @@
<p>所属部门:<span>{{userInfo.departName}}</span></p>
<p>员工编号:<span>{{userInfo.jobNo}}</span></p>
</div>
<table v-if="list && list.length">
<tr>
<th>物品名称</th>
<th>型号</th>
<th>物品类别</th>
<th>数量</th>
</tr>
<tr v-for="(item, index) in list" :key="index">
<td>{{item.name}}</td>
<td>{{item.goodsNo}}</td>
<td>{{item.goodsCategoryName}}</td>
<td style="width: 30%;">
<stepper
<div v-if="list && list.length" style="width: 100%;">
<div class="title">
<div>物品名称</div>
<div>型号</div>
<div>物品类别</div>
<div>数量</div>
</div>
<div v-for="(item, index) in list" :key="index" class="tr">
<div >{{item.name}}</div>
<div>{{item.goodsNo}}</div>
<div>{{item.goodsCategoryName}}</div>
<div>
<stepper style="width: 100%;"
:id=item.id
:maxNum="item.maxNum"
:inputNum="item.goodsNum"
@changeNum="changeNum"
></stepper>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="bottom-fixed">
<van-button type="primary" @click="scanQrCode">扫描员工二维码</van-button>
......@@ -123,12 +123,12 @@ export default {
}
})
// getGoodsInfo({ barCode: '11111111111111111111' }).then(res => {
// if(!res.data){
// getGoodsInfo({ barCode: 'WMYfwBwH_5ouDO' }).then(res => {
// if (!res.data) {
// this.$toast('该物品暂未入库')
// return
// }
// console.log('data',res)
// console.log('data', res)
// let data = res.data
// let params = {
// id: data.id,
......@@ -205,29 +205,38 @@ export default {
color: #020202;
}
table {
.title {
width: 100%;
background: #ffffff;
margin-top: 10px;
border-collapse: collapse;
}
table tr:first-child {
background: #f6f7f9;
height: 34px;
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 10px;
font-size: 13px;
color: #666666;
}
table tr {
.tr {
width: 100%;
font-size: 14px;
display: flex;
justify-content: space-between;
align-items: center;
height: 42px;
background: #ffffff;
}
table th {
color: #666666;
font-size: 14px;
.tr + .tr {
border-top: 1px solid #E8E8E8;
}
table td {
font-size: 14px;
.tr div, .title div {
width: 25%;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.bottom-fixed {
......
......@@ -15,7 +15,7 @@
<span>{{item.createtime | formatTime}}</span>
</p>
<div class="info" v-for="(vor,v_index) in item.vorList" :key="v_index">
<p>{{vor.goodsName}}</p>
<p style="text-align:left;width: 240px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;">{{vor.goodsName}}</p>
<p>
<span class="num">数量:</span>
<span>{{vor.outboundNum}}</span>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment