app-slggassets-mobile/pages/upload/index.vue

<template>
	<view>
		<u-navbar :is-back="false" title="数据上传" title-color="#fff" :background="{'background':'#107fc9'}"></u-navbar>

		<view class="content">
			<view class="img">
				<image :src="isConnect ? '/static/wifi.png' : '/static/no-wifi.png'" mode="widthFix"></image>
			</view>

			<u-card>
				<view slot="head">
					<view class="status">
						<span class="status__label">服务器连接状态：</span>
						<span
							:class="isConnect ? 'status__value1' : 'status__value0'">{{ isConnect ? '已连接' : '未连接' }}</span>
					</view>
				</view>

				<view slot="body">
					<view class="time">
						<span class="time__label">上次上传时间：</span>
						<span class="time__value">{{baseInfo.syncTime}}</span>
					</view>

					<view class="num">
						<span class="num_label">本机离线盘点数据：</span>
						<span class="num_value">{{baseInfo.num}}</span>
					</view>
				</view>

				<view slot="foot">
					<u-button :ripple="true" :custom-style="btnStyle" @click="uploadClick">点击开始上传</u-button>
				</view>
			</u-card>
		</view>

	</view>
</template>

<script>
	// #ifdef APP-PLUS
	let androidModule = uni.requireNativePlugin('uhfr')
	// #endif
	
	import {
		selectFromTable,
		executeSql
	} from '@/common/sqlite.js'
	import {
		ROOTPATH
	} from '@/common/config.js'
	export default {
		data() {
			return {
				baseInfo: {
					syncTime: "",
					num: 0
				},
				isConnect: false,
				btnStyle: {
					"color": "#fff",
					'background': "#107fc9"
				},
			}
		},
		methods: {
			async uploadClick(){
				if(!this.isConnect){
					uni.showToast({
						icon:'none',
						title:'连接服务器失败'
					})
					return
				}
			    try{
			    	let res = await selectFromTable(`
					    select id,serial,name,position,worker_name,active_status,files,remark from property where is_check = 1;
					`)
					
					if(res.length === 0){
						uni.showToast({
							icon:'none',
							title:"本地无数据上传"
						})
						return
					}
					
					androidModule.showToast("开始上传...")
					
					for(let i = 0;i < res.length;i++){
						let picRes = await uni.uploadFile({
								url:`${ROOTPATH}/index.php?s=/Home/Worker/upload.html`,
								filePath:res[i].files,
								name:"file"
							})
						res[i].files = JSON.parse(picRes[1]?.data).data?.id	
					}
					
					let promiseAll = res.map(item => {
						return this.upload(item)
					})
					
					let result = await Promise.all(promiseAll)
					console.log(result);
					
					androidModule.showToast(`上传成功`)
					//先清空表
					await executeSql(`
					    DELETE from property;
					`)
					await executeSql(`
					    UPDATE sqlite_sequence SET seq = 0 where name = 'property';
					`)
					await executeSql(`
					    INSERT INTO log (remark) VALUES ("数据上传");
					`)
					
					await this.getInitInfo()
			    }catch(err){
			    	console.warn('sqlite-err',err)
					androidModule.showToast(err)
			    }
			},
			
			async getInitInfo() {
				let time;
				let num;			
				try {
					time = await selectFromTable(`
					    SELECT * FROM log WHERE remark = "数据上传" ORDER BY created_at DESC;
					`)
					this.baseInfo.syncTime = time[0]?.created_at || ""
					num = await selectFromTable(`
					    SELECT count(*) as count FROM property WHERE is_check = 1;
					`)
					this.baseInfo.num = num[0]?.count || 0
				} catch (err) {
					console.warn('sqlite-err', err);
					androidModule.showToast(err)
				}
			},

			testConnect() {
				this.$u.api.test().then(res => {
					if (res.data.msg === '链接成功') {
						this.isConnect = true
					} else {
						this.isConnect = false
					}
				}).catch(err => {
					this.isConnect = false
				})
			},

			upload(data) {
				return new Promise((resolve, reject) => {
					uni.request({
						url: `${ROOTPATH}/index.php?s=/Home/Worker/update_assets.html`,
						data,
						method: 'POST',
						header: {
							'Content-Type': 'application/x-www-form-urlencoded'
						},
						dataType: 'json',
						success: (response) => {
							resolve(response)
						},
						fail: (err) => {
							reject(err)
						}
					})
				})
			}
		},
		onShow() {
			this.testConnect()
			this.getInitInfo()
		}
	}
</script>

<style scoped lang="scss">
	.img {
		height: 400rpx;
		display: flex;
		justify-content: center;
		align-items: center;

		margin: 20rpx 32rpx;

		&>image {
			width: 280rpx;
		}
	}

	.status {
		text-align: center;

		padding: 40rpx 0;

		&__label {}

		&__value {
			color: #fff;
			background-color: green;
			border-radius: 14rpx;

			padding: 6rpx 10rpx;
		}

		&__value0 {
			color: #fff;
			background-color: red;
			border-radius: 14rpx;

			padding: 6rpx 10rpx;
		}

		&__value1 {
			color: #fff;
			background-color: green;
			border-radius: 14rpx;

			padding: 6rpx 10rpx;
		}
	}

	.time {
		@extend .status;

		padding: 20rpx 0;
	}

	.num {
		@extend .time;
	}
</style>