同步代码

pagePrinter/index/components/printer-item.vue

@@ -0,0 +1,154 @@
+<template>
+	<view class="default-box-padding  bg-fff u-font-28 border-r-12 box-shadow u-m-b-30">
+		<view class="u-flex u-row-between u-p-b-24 border-bottom">
+			<view class="u-flex">
+				<!-- <text>{{ subTypesName(data.subType)}}</text> -->
+				<text>{{ data.name}}</text>
+				<text class="color-999 u-font-24">（{{data.address}}）</text>
+			</view>
+			<view class="u-flex u-col-center">
+				<template v-if="data.status">
+					<text class="online">在线，状态正常</text>
+				</template>
+				<template v-else>
+					<image class="icon-warning" src="/pagePrinter/static/icon/icon-warning.svg" mode=""></image>
+					<text class="leave u-m-l-10">离线</text>
+				</template>
+
+			</view>
+		</view>
+
+		<view class="u-m-t-24">
+			<view class="u-flex u-row-between">
+				<view class="u-flex u-col-center">
+					<image class="icon" src="/pagePrinter/static/icon/icon-setting.svg" mode=""></image>
+					<view class="color-666 u-m-l-10">是否启用</view>
+				</view>
+				<view>
+					<my-switch v-model="data.status" @change="openDiscountChange"></my-switch>
+				</view>
+			</view>
+			<view class="u-flex u-row-between u-m-t-32">
+				<view class="u-flex u-col-center">
+					<image class="icon" src="/pagePrinter/static/icon/icon-type.svg" mode=""></image>
+					<view class="color-666 u-m-l-10">类型</view>
+				</view>
+				<view>
+					{{subTypesName(data.subType)}}
+				</view>
+			</view>
+			<view class="u-flex u-row-between u-m-t-32">
+				<view class="u-flex u-col-center">
+					<image class="icon" src="/pagePrinter/static/icon/icon-category.svg" mode=""></image>
+					<view class="color-666 u-m-l-10">分类</view>
+				</view>
+				<view>
+					{{devicesName(data.contentType)}}
+				</view>
+			</view>
+			<view class="u-m-t-32 u-flex u-row-right gap-20">
+				<my-button v-if="data.connectionType == 'network'" shape="circle" :width="140" :height="56"
+					type="cancel" @tap="delTableHandleEvent()" plain>删除</my-button>
+				<my-button v-if="data.connectionType == 'network'" shape="circle" @click="toUrl" :width="140"
+					:height="56" plain>编辑</my-button>
+			</view>
+		</view>
+		<!-- 删除弹窗 -->
+		<my-model desc="确认删除?" ref="delModel" @confirm="delModelConfirm"></my-model>
+
+	</view>
+</template>
+
+<script setup>
+	import {
+		devices,
+		models,
+		subTypes
+	} from '@/pagePrinter/devices.js'
+	import go from '@/commons/utils/go.js'
+	import {
+		shopConfigprinter,
+		delTableHandle
+	} from '@/http/yskApi/devices.js'
+	import {
+		getCurrentInstance
+	} from 'vue';
+
+	const props = defineProps({
+		data: {
+			type: Object,
+			default: () => {}
+		}
+	})
+	const emit = defineEmits(['init'])
+	let toUrl = () => {
+		go.to('PAGES_PRINTER_ADD', {
+			id: props.data.id
+		})
+	}
+
+	function devicesName(value) {
+		return devices.find(item => item.value == value).name
+	}
+
+	function modelsName(value) {
+		return models.find(item => item.value == value).name
+	}
+
+	function subTypesName(value) {
+		return subTypes.find(item => item.value == value).name
+	}
+
+	function timeFilter(s) {
+		return dayjs(s).format('YYYY-MM-DD HH:mm:ss')
+	}
+
+	async function openDiscountChange(d) {
+		delete props.data.createdAt
+		delete props.data.updatedAt
+		const res = await shopConfigprinter({
+			...props.data,
+			shopId: uni.getStorageSync('shopId'),
+		})
+		emit('init', '')
+	}
+	const refs = getCurrentInstance()
+	// 删除
+	function delTableHandleEvent() {
+		refs.ctx.$refs.delModel.open()
+	}
+	//删除分类确认
+	async function delModelConfirm() {
+		const res = await delTableHandle(props.data.id)
+		emit('init', '')
+		refs.ctx.$refs.delModel.close()
+	}
+</script>
+
+<style lang="scss" scoped>
+	.border-bottom {
+		border-bottom: 1px solid rgb(240, 240, 240);
+	}
+
+	.box-shadow {
+		box-shadow: 0 0 5px #eee;
+	}
+
+	.online {
+		color: #0FC161;
+	}
+
+	.leave {
+		color: #999;
+	}
+
+	.icon-warning {
+		width: 34rpx;
+		height: 30rpx;
+	}
+
+	.icon {
+		width: 24rpx;
+		height: 24rpx;
+	}
+</style>