front-end/ghsApp/src/admin/book/itemCustom.vue

<template>
	<view class="app-content">
		<view class="ex-page">
            <view class="top-bar">
                <view>aaaaa</view>
            </view>
            <scroll-view scroll-y scroll-with-animation class="main-view">
                <view class="space-view ex-table">
                    <t-table :headerBackgroundColor="'#F0F2F6'">
                        <t-tr header>
                            <t-th><view style="width:160upx;">花材</view></t-th>
                            <t-th>预订</t-th>
                            <t-th>上架</t-th>
                            <t-th>剩余</t-th>
                            <t-th>路上</t-th>
                            <t-th>待采</t-th>
                            <t-th>操作</t-th>
                        </t-tr>
                        <template v-if="!$util.isEmpty(bookData)">
                            <view v-for="(item, index) in bookData" :key="index" @click="goDetail(item)">
                                <t-tr>
                                    <t-td><view style="color:#333333;font-size:25upx;width:160upx;text-align:left;height:60upx;display: flex;align-items: center;">{{item.name}}</view></t-td>
                                    <t-td><view style="color:#333333;font-size:25upx;height:60upx;display: flex;align-items: center;">{{item.bookNum?parseFloat(item.bookNum):0}}</view></t-td>
                                    <t-td><view style="color:#333333;font-size:25upx;height:60upx;display: flex;align-items: center;">{{item.onNum?parseFloat(item.onNum):0}}</view></t-td>
                                    <t-td><view style="color:#333333;font-size:25upx;height:60upx;display: flex;align-items: center;">{{item.roadNum?parseFloat(item.roadNum):0}}</view></t-td>
                                    <t-td><view style="color:#333333;font-size:25upx;height:60upx;display: flex;align-items: center;">{{item.roadNum?parseFloat(item.roadNum):0}}</view></t-td>
                                    <t-td><view style="color:#333333;font-size:25upx;height:60upx;display: flex;align-items: center;">{{item.needCgNum?parseFloat(item.needCgNum):0}}</view></t-td>
                                    <t-td>
										<view style="color:#333333;font-size:22upx;height:60upx;display: flex;align-items: center;position: relative;">
											<text>操作</text>
											<text style="color:#CCCCCC;position: absolute;top:52upx;width:300upx;right:-30upx;text-align:right;font-size:21upx;">
												{{ item.customName }}<text style="margin-left:12upx;" v-if="item.seatSn != 0">{{'货号:'+item.seatSn }}</text>
											</text>
										</view>
									</t-td>
                                </t-tr>
                            </view>
                        </template>
                    </t-table>
                </view>
            </scroll-view>
		</view>
	</view>
</template>
<script>
import AppWrapperEmpty from "@/components/app-wrapper-empty";
import SelectList from "@/components/plugin/selectList";
import { getBookItemCustomList } from "@/api/book"
import { list } from "@/mixins";
import ShopSelect from "@/components/module/shopSelect";
import DateSelect from "@/components/module/dateSelect";
import {mapActions, mapGetters} from "vuex";
import AppSearchModule from "@/components/module/app-search";
export default {
	components: {
		SelectList,
		AppWrapperEmpty,
		ShopSelect,
		DateSelect,
		AppSearchModule
	},
	mixins: [list],
	computed: {
	},
	data() {
		return {
			dataList: [],
			bookData:[]
		};
	},
	onPullDownRefresh() {
		this.getStatList().then(res => {
			uni.stopPullDownRefresh();
		});
	},
	onLoad() {
	},
	methods: {
		...mapActions(['setUserShopAll']),
        goDetail(){

        },
		async init() {
			this.getStatList();
		},
		getStatList() {
			let that = this
			uni.showLoading()
			getBookItemCustomList().then(res => {
				uni.hideLoading()
				if (!this.$util.isEmpty(res.data.list)) {
					that.bookData = res.data.list
				}else{
					that.bookData=[]
				}
			});
		}
	}
};
</script>
<style lang="scss" scoped>
.ex-page {
	background: white;
	padding-top:20upx;
	height: 100%;
	display: flex;
	flex-direction: column;
	.top-bar {
	}
	.main-view {
		flex: 1;
		background-color: #f9fbfc;
		.space-view {
			background-color: #fff;
		}
		.ex-info {
			padding: 30upx;
			.info-cell {
				display: flex;
				align-items: center;
				font-size: 28upx;
				&:not(:first-child) {
					margin-top: 20upx;
				}
				.cell-label {
					width: 110upx;
					color: #666666;
				}
				.cell-value {
					margin-left: 40upx;
					color: #333;
					&.warning {
						color: #ffaf1d;
					}
					&.success {
						color: #27c325;
					}
				}
			}
		}
		.ex-table {
			::v-deep.icon-info {
				color: #333333;
			}
		}
	}
	.bar-view {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 30upx;
		width: 100%;
		height: 100upx;

		box-shadow: 0upx -1upx 6upx 0upx rgba(4, 0, 0, 0.06);
		.info-view {
			font-size: 26upx;
		}
		.btn-view {
			display: flex;
			.admin-button-com {
				margin: 0 10upx;
			}
		}
	}
}
</style>