zhongshen_project/addon/cashier---/source/os/pages/printer/list.vue

<template>
	<base-page>
		<view class="printerlist">
			<view class="printerlist-box">
				<view class="printerlist-left">
					<view class="printer-title">
						打印机
						<text class="iconfont icongengduo1"></text>
					</view>
					<view class="printer-list-wrap">
						<block v-if="list.length > 0">
							<scroll-view scroll-y="true" class="printer-list-scroll all-scroll" @scrolltolower="getPrinterList">
								<view
									class="item"
									@click="printerSelect(item, index)"
									v-for="(item, index) in list"
									:key="index"
									:class="index == selectprinterKeys ? 'itemhover' : ''"
								>
									<view class="item-right">
										<view class="printer-name">{{ item.printer_name }}</view>
										<view class="printer-money">{{ brandList[item.brand] }}</view>
									</view>
								</view>
							</scroll-view>
						</block>
						<view class="notYet" v-else-if="!one_judge && list.length == 0">暂无打印机</view>
					</view>
					<view class="add-printer"><button type="default" class="primary-btn" @click="addprinter">添加打印机</button></view>
				</view>
				<view class="printerlist-right" v-show="!one_judge">
					<view class="printer-title">打印机详情</view>
					<view class="printer-information">
						<block v-if="JSON.stringify(detail) != '{}'">
							<view class="title">基本信息</view>
							<view class="information-box">
								<view class="box-left">
									<view class="information">
										<view>名称：</view>
										<view>{{ detail.printer_name }}</view>
									</view>
									<view class="information">
										<view>品牌：</view>
										<view>{{ brandList[detail.brand] }}</view>
									</view>
									<view class="information">
										<view>打印机编号：</view>
										<view>{{ detail.printer_code }}</view>
									</view>
									<view class="information">
										<view>打印机秘钥：</view>
										<view>{{ detail.printer_key }}</view>
									</view>
									<view class="information">
										<view>应用id：</view>
										<view>{{ detail.open_id }}</view>
									</view>
									<view class="information">
										<view>apiKey：</view>
										<view>{{ detail.apikey }}</view>
									</view>
									<view class="information">
										<view>添加时间：</view>
										<view>{{ detail.create_time ? $util.timeFormat(detail.create_time) : '--' }}</view>
									</view>
								</view>
							</view>

							<view class="title">支付打印</view>
							<view class="information-box">
								<view class="box-left">
									<view class="information">
										<view>支付打印：</view>
										<view>{{ detail.order_pay_open ? '开启' : '关闭' }}</view>
									</view>
									<view class="information" v-if="detail.order_pay_open">
										<view>打印模板：</view>
										<view>{{ template[detail.order_pay_template_id] ? template[detail.order_pay_template_id].template_name : '--' }}</view>
									</view>
									<view class="information" v-if="detail.order_pay_open">
										<view>打印联数：</view>
										<view>{{ detail.order_pay_print_num }}</view>
									</view>
									<view class="information" v-if="detail.order_pay_open">
										<view>订单类型：</view>
										<view>
											<block v-for="(item, index) in detail.order_pay_order_type" :key="index">
												<text v-if="item" class="order-type">{{ detail['order_type_list'][item]['name'] }}</text>
											</block>
										</view>
									</view>
								</view>
							</view>
							<view class="title">收货打印</view>
							<view class="information-box">
								<view class="box-left">
									<view class="information">
										<view>收货打印：</view>
										<view>{{ detail.take_delivery_open ? '开启' : '关闭' }}</view>
									</view>
									<view class="information" v-if="detail.take_delivery_open">
										<view>打印模板：</view>
										<view>{{ template[detail.take_delivery_template_id] ? template[detail.take_delivery_template_id].template_name : '--' }}</view>
									</view>
									<view class="information" v-if="detail.take_delivery_open">
										<view>打印联数：</view>
										<view>{{ detail.take_delivery_print_num }}</view>
									</view>
									<view class="information" v-if="detail.take_delivery_open">
										<view>订单类型：</view>
										<view>
											<block v-for="(item, index) in detail.take_delivery_order_type" :key="index">
												<text v-if="item" class="order-type">{{ detail['order_type_list'][item]['name'] }}</text>
											</block>
										</view>
									</view>
								</view>
							</view>

							<view class="title">手动打印</view>
							<view class="information-box">
								<view class="box-left">
									<view class="information">
										<view>手动打印：</view>
										<view>{{ detail.manual_open ? '开启' : '关闭' }}</view>
									</view>
									<view class="information" v-if="detail.manual_open">
										<view>打印模板：</view>
										<view>{{ template[detail.template_id] ? template[detail.template_id].template_name : '--' }}</view>
									</view>
									<view class="information" v-if="detail.manual_open">
										<view>打印联数：</view>
										<view>{{ detail.print_num }}</view>
									</view>
								</view>
							</view>
							<view class="title">充值打印</view>
							<view class="information-box">
								<view class="box-left">
									<view class="information">
										<view>充值打印：</view>
										<view>{{ detail.recharge_open ? '开启' : '关闭' }}</view>
									</view>
									<view class="information" v-if="detail.recharge_open">
										<view>打印模板：</view>
										<view>{{ template[detail.recharge_template_id] ? template[detail.recharge_template_id].template_name : '--' }}</view>
									</view>
									<view class="information" v-if="detail.recharge_open">
										<view>打印联数：</view>
										<view>{{ detail.recharge_print_num }}</view>
									</view>
								</view>
							</view>
							
							<view class="title">收银交班打印</view>
							<view class="information-box">
								<view class="box-left">
									<view class="information">
										<view>收银交班打印：</view>
										<view>{{ detail.change_shifts_open ? '开启' : '关闭' }}</view>
									</view>
									<view class="information" v-if="detail.change_shifts_open">
										<view>打印模板：</view>
										<view>{{ template[detail.change_shifts_template_id] ? template[detail.change_shifts_template_id].template_name : '--' }}</view>
									</view>
									<view class="information" v-if="detail.change_shifts_open">
										<view>打印联数：</view>
										<view>{{ detail.change_shifts_print_num }}</view>
									</view>
								</view>
							</view>

							<view class="button-box">
								<view class="button" @click="deleteprinter(detail.printer_id)">删除</view>
								<view class="button" @click="editprinter(detail.printer_id)">修改</view>
							</view>
						</block>
						<block v-else><image class="cart-empty" :src="$util.img('upload/uniapp/cashier/cart_empty.png')" mode="widthFix"></image></block>
					</view>
				</view>
			</view>
		</view>
	</base-page>
</template>

<script>
import unipopup from '@/components/uni-popup/uni-popup.vue';
export default {
	components: { unipopup },
	data() {
		return {
			selectprinterKeys: 0,
			search_text: '',
			page: 1,
			// 每次返回数据数
			page_size: 8,
			// 第一次请求列表做详情渲染判断
			one_judge: true,
			//详情数据
			detail: {},
			brandList: {
				yilianyun: '易联云',
				'365': '365'
			},
			template: {},
			list: []
		};
	},
	onLoad() {
		// 初始化请求打印机列表数据

		this.getTemplate();
	},
	methods: {
		printerSelect(item, keys) {
			this.selectprinterKeys = keys;
			this.getPrinterDetail(item.printer_id);
		},
		// 搜索员工
		search() {
			this.page = 1;
			this.list = [];
			this.one_judge = true;
			this.getPrinterList();
		},
		addprinter() {
			this.$util.redirectTo('/pages/printer/add');
		},
		editprinter(printer_id) {
			this.$util.redirectTo('/pages/printer/add', { printer_id: printer_id });
		},
		/**
		 * 请求的列表数据
		 */
		getPrinterList() {
			this.$api.sendRequest({
				url: '/printer/storeapi/printer/lists',
				data: {
					page: this.page,
					page_size: this.page_size
				},
				success: res => {
					if (res.data.list.length == 0 && this.one_judge) {
						this.detail = {};
						this.one_judge = false;
					}

					if (res.code >= 0 && res.data.list.length != 0) {
						this.page += 1;
						if (this.list.length == 0) {
							this.list = res.data.list;
						} else {
							this.list = this.list.concat(res.data.list);
						}

						//初始时加载一遍详情数据
						if (this.one_judge) {
							this.getPrinterDetail(this.list[0].printer_id);
						}
					}
				}
			});
		},
		imgError(index) {
			this.list[index].printer_img = this.util.img('addon/meirong/o2o/img/default_printer.png');
		},
		imgDetailError() {
			this.detail.printer_img = this.util.img('addon/meirong/o2o/img/default_printer.png');
		},
		getTemplate() {
			this.$api.sendRequest({
				url: '/printer/storeapi/printer/template',
				success: res => {
					if (res.code == 0) {
						let template = {};
						res.data.forEach(item => {
							template[ item.template_id ] = item;
						})
						this.template = template;
						this.getPrinterList();
					}
				}
			});
		},
		getPrinterDetail(printer_id) {
			this.$api.sendRequest({
				url: '/printer/storeapi/printer/info',
				data: { printer_id },
				success: res => {
					if (res.code == 0) {
						this.detail = res.data;
						this.one_judge = false;
					}
				}
			});
		},
		deleteprinter(printer_id) {
			let that = this;
			uni.showModal({
				title: '',
				content: '确定要删除吗',
				success: function(res) {
					if (res.confirm) {
						that.$api.sendRequest({
							url: '/printer/storeapi/printer/deleteprinter',
							data: {
								printer_id
							},
							success: res => {
					 		if (res.code >= 0) {
									that.page = 1;
									that.list = [];
									that.one_judge = true;
									that.getPrinterList();
								} else {
									that.$util.showToast({ title: res.message });
								}
							}
						});
					} else if (res.cancel) {
						console.log('用户点击取消');
					}
				}
			});
		}
	}
};
</script>

<style scoped lang="scss">
@import './public/css/printer.scss';
</style>