修改加载框保存问题

src/pages/home/home.vue

@@ -98,7 +98,7 @@
             </movable-view>
         </movable-area> -->
 
-        <view class="bot_version"> v3.0.20</view>
+        <view class="bot_version"> v3.0.22</view>
         <view
             class="shareInfo"
             @click="goDeviceShare('sure')"

src/pagesA/adDevice/adDevice.vue

@@ -537,8 +537,7 @@ export default {
                 return;
             }
             uni.showLoading({
-                title: "配网中",
-                mask: true,
+                title: "配网中...",
             });
             airkiss.startAirkiss(this.wifiName, this.wifiPassword, (res) => {
                 uni.hideLoading();

src/pagesA/deviceDetail/deviceDetail.vue

@@ -1048,39 +1048,38 @@ export default {
     onLoad(options) {
         const devItem = JSON.parse(options.devItem);
         const { devId, clientId } = devItem;
-
         // 缓存到页面实例
         this.clientId = clientId;
         uni.setStorageSync("currentDevItem", devItem);
-
         this.getFrequency(devId);
         this.getdevInfo(devId);
         this.getdevRoomInfo(devId);
         this.getCurrentDate();
-    },
 
-    onShow() {
-        this.showModle = true;
         this.todayDate = this.$time(new Date(), 2);
 
         // 清理旧定时器
         clearTimeout(this.autoPlayinterval);
         this.autoPlayinterval = setTimeout(() => this.autoSwipe(), 3000);
 
-        // MQTT 初始化
-        const userId = uni.getStorageSync("userId");
-        if (!userId) return console.error("MQTT 初始化失败：缺少 userId");
-
         if (MqttService.dataConnected && MqttService.dataClient) {
             // 已连接，直接订阅
             this.initSubscriptions();
-        } else {
+        }
+    },
+
+    onShow() {
+        this.showModle = true;
+        // MQTT 初始化
+        const userId = uni.getStorageSync("userId");
+        if (!userId) return console.error("MQTT 初始化失败：缺少 userId");
+        if (!MqttService.dataConnected) {
             // 未连接，先 connect
             MqttService.connectData(userId)
                 .then((client) => {
                     // 页面订阅逻辑，等 connect 成功再执行
                     const handler = () => {
-                        this.initSubscriptions();
+                        MqttService.resubscribeAll("DATA");
                         uni.$off("mqttData-ready", handler);
                     };
                     uni.$on("mqttData-ready", handler);
@@ -1089,15 +1088,13 @@ export default {
         }
     },
 
-    onHide() {
+    onUnload() {
         // 清理定时器
         clearTimeout(this.autoPlayinterval);
         // 清理自动滑动定时器
         clearInterval(this.setIntervalVal);
         this.setIntervalVal = null;
-
         this.autoPlayinterval = null;
-
         // 取消订阅
         ["unsubscribeFn", "fallingEventChange"].forEach((key) => {
             if (this[key]) {
@@ -1105,6 +1102,8 @@ export default {
                 this[key] = null;
             }
         });
+    },
+    onHide() {
         this.showModle = false;
     },
 };

src/pagesA/devices/devices.vue

@@ -237,8 +237,6 @@ export default {
     onPullDownRefresh() {
         uni.showLoading({
             title: "加载中...",
-            icon: "none",
-            duration: 1500,
         });
         this.queryList();
         setTimeout(() => {

src/pagesA/homeManage/homeManage.vue

@@ -147,7 +147,7 @@ export default {
 
         getgroupList() {
             uni.showLoading({
-                title: "加载中",
+                title: "加载中...",
             });
             this.$http
                 .get(`wap/group/groupList`, { userId: this.userId })

src/pagesA/shareList/shareList.vue

@@ -78,7 +78,7 @@ export default {
     methods: {
         getShareList() {
             uni.showLoading({
-                title: "加载中",
+                title: "加载中...",
             });
             this.$http
                 .post("wap/share/queryDevShare", {

src/uni_modules/lime-echart/components/l-echart/l-echart.vue

@@ -1,65 +1,85 @@
 <template>
-	<view class="lime-echart" :style="[customStyle]" v-if="canvasId" ref="limeEchart" :aria-label="ariaLabel">
-		<!-- #ifndef APP-NVUE -->
-		<canvas
-			class="lime-echart__canvas"
-			v-if="use2dCanvas"
-			type="2d"
-			:id="canvasId"
-			:style="canvasStyle"
-			:disable-scroll="isDisableScroll"
-			@touchstart="touchStart"
-			@touchmove="touchMove"
-			@touchend="touchEnd"
-		/>
-		<canvas
-			class="lime-echart__canvas"
-			v-else
-			:width="nodeWidth"
-			:height="nodeHeight"
-			:style="canvasStyle"
-			:canvas-id="canvasId"
-			:id="canvasId"
-			:disable-scroll="isDisableScroll"
-			@touchstart="touchStart"
-			@touchmove="touchMove"
-			@touchend="touchEnd"
-		/>
-		<view class="lime-echart__mask"
-			v-if="isPC"
-			@mousedown="touchStart"
-			@mousemove="touchMove"
-			@mouseup="touchEnd"
-			@touchstart="touchStart"
-			@touchmove="touchMove"
-			@touchend="touchEnd">
-		</view>
-		<canvas v-if="isOffscreenCanvas" :style="offscreenStyle" :canvas-id="offscreenCanvasId"></canvas>
-		<!-- #endif -->
-		<!-- #ifdef APP-NVUE -->
-		<web-view
-			class="lime-echart__canvas"
-			:id="canvasId"
-			:style="canvasStyle"
-			:webview-styles="webviewStyles"
-			ref="webview"
-			src="/uni_modules/lime-echart/static/uvue.html?v=1"
-			@pagefinish="finished = true"
-			@onPostMessage="onMessage"
-		></web-view>
-		<!-- #endif -->
-	</view>
+    <view
+        class="lime-echart"
+        :style="[customStyle]"
+        v-if="canvasId"
+        ref="limeEchart"
+        :aria-label="ariaLabel"
+    >
+        <!-- #ifndef APP-NVUE -->
+        <canvas
+            class="lime-echart__canvas"
+            v-if="use2dCanvas"
+            type="2d"
+            :id="canvasId"
+            :style="canvasStyle"
+            :disable-scroll="isDisableScroll"
+            @touchstart="touchStart"
+            @touchmove="touchMove"
+            @touchend="touchEnd"
+        />
+        <canvas
+            class="lime-echart__canvas"
+            v-else
+            :width="nodeWidth"
+            :height="nodeHeight"
+            :style="canvasStyle"
+            :canvas-id="canvasId"
+            :id="canvasId"
+            :disable-scroll="isDisableScroll"
+            @touchstart="touchStart"
+            @touchmove="touchMove"
+            @touchend="touchEnd"
+        />
+        <view
+            class="lime-echart__mask"
+            v-if="isPC"
+            @mousedown="touchStart"
+            @mousemove="touchMove"
+            @mouseup="touchEnd"
+            @touchstart="touchStart"
+            @touchmove="touchMove"
+            @touchend="touchEnd"
+        >
+        </view>
+        <canvas
+            v-if="isOffscreenCanvas"
+            :style="offscreenStyle"
+            :canvas-id="offscreenCanvasId"
+        ></canvas>
+        <!-- #endif -->
+        <!-- #ifdef APP-NVUE -->
+        <web-view
+            class="lime-echart__canvas"
+            :id="canvasId"
+            :style="canvasStyle"
+            :webview-styles="webviewStyles"
+            ref="webview"
+            src="/uni_modules/lime-echart/static/uvue.html?v=1"
+            @pagefinish="finished = true"
+            @onPostMessage="onMessage"
+        ></web-view>
+        <!-- #endif -->
+    </view>
 </template>
 
 <script>
 // @ts-nocheck
 // #ifndef APP-NVUE
-import {Canvas, setCanvasCreator, dispatch} from './canvas';
-import {wrapTouch, convertTouchesToArray, devicePixelRatio ,sleep, canIUseCanvas2d, getRect, getDeviceInfo} from './utils';
+import { Canvas, setCanvasCreator, dispatch } from "./canvas";
+import {
+    wrapTouch,
+    convertTouchesToArray,
+    devicePixelRatio,
+    sleep,
+    canIUseCanvas2d,
+    getRect,
+    getDeviceInfo,
+} from "./utils";
 // #endif
 // #ifdef APP-NVUE
-import { base64ToPath, sleep } from './utils';
-import {Echarts} from './nvue'
+import { base64ToPath, sleep } from "./utils";
+import { Echarts } from "./nvue";
 // #endif
 
 /**
@@ -79,437 +99,488 @@ import {Echarts} from './nvue'
  * @event {Function} finished 加载完成触发
  */
 export default {
-	name: 'lime-echart',
-	props: {
-		// #ifdef MP-WEIXIN || MP-TOUTIAO
-		type: {
-			type: String,
-			default: '2d'
-		},
-		// #endif
-		// #ifdef APP-NVUE
-		webviewStyles: Object,
-		// hybrid: Boolean,
-		// #endif
-		customStyle: String,
-		isDisableScroll: Boolean,
-		isClickable: {
-			type: Boolean,
-			default: true
-		},
-		enableHover: Boolean,
-		beforeDelay: {
-			type: Number,
-			default: 30
-		},
-		landscape: Boolean
-	},
-	data() {
-		return {
-			// #ifdef MP-WEIXIN || MP-TOUTIAO || MP-ALIPAY
-			use2dCanvas: true,
-			// #endif
-			// #ifndef MP-WEIXIN || MP-TOUTIAO || MP-ALIPAY
-			use2dCanvas: false,
-			// #endif
-			ariaLabel: '图表',
-			width: null,
-			height: null,
-			nodeWidth: null,
-			nodeHeight: null,
-			// canvasNode: null,
-			config: {},
-			inited: false,
-			finished: false,
-			file: '',
-			platform: '',
-			isPC: false,
-			isDown: false,
-			isOffscreenCanvas: false,
-			offscreenWidth: 0,
-			offscreenHeight: 0,
-		};
-	},
-	computed: {
-		rootStyle() {
-			if(this.landscape) {
-				return `transform: translate(-50%,-50%) rotate(90deg); top:50%; left:50%;`
-			}
-		},
-		canvasId() {
-			return `lime-echart${this._ && this._.uid || this._uid}`
-		},
-		offscreenCanvasId() {
-			return `${this.canvasId}_offscreen`
-		},
-		offscreenStyle() {
-			return `width:${this.offscreenWidth}px;height: ${this.offscreenHeight}px; position: fixed; left: 99999px; background: red`
-		},
-		canvasStyle() {
-			return this.rootStyle + (this.width && this.height ? ('width:' + this.width + 'px;height:' + this.height + 'px') : '')
-		}
-	},
-	// #ifndef VUE3
-	beforeDestroy() {
-		this.clear()
-		this.dispose()
-		// #ifdef H5
-		if(this.isPC) {
-			document.removeEventListener('mousewheel', this.mousewheel)
-		}
-		// #endif
-	},
-	// #endif
-	// #ifdef VUE3
-	beforeUnmount() {
-		this.clear()
-		this.dispose()
-		// #ifdef H5
-		if(this.isPC) {
-			document.removeEventListener('mousewheel', this.mousewheel)
-		}
-		// #endif
-	},
-	// #endif
-	created() {
-		// #ifdef H5
-		if(!('ontouchstart' in window)) {
-			this.isPC = true
-			document.addEventListener('mousewheel', this.mousewheel)
-		}
-		// #endif
-		// #ifdef MP-WEIXIN || MP-TOUTIAO || MP-ALIPAY
-		const { platform } = getDeviceInfo();
-		this.isPC = /windows/i.test(platform)
-		// #endif
-		this.use2dCanvas = this.type === '2d' && canIUseCanvas2d()
-	},
-	mounted() {
-		this.$nextTick(() => {
-			this.$emit('finished')
-		})
-	},
-	methods: {
-		// #ifdef APP-NVUE
-		onMessage(e) {
-			const detail = e?.detail?.data[0] || null;
-			const data = detail?.data
-			const key = detail?.event
-			const options = data?.options
-			const event = data?.event
-			const file = detail?.file
-			if (key == 'log' && data) {
-				console.log(data)
-			}
-			if(event) {
-				this.chart.dispatchAction(event.replace(/"/g,''), options)
-			}
-			if(file) {
-				thie.file = file
-			}
-		},
-		// #endif
-		setChart(callback) {
-			if(!this.chart) {
-				console.warn(`组件还未初始化，请先使用 init`)
-				return
-			}
-			if(typeof callback === 'function' && this.chart) {
-				callback(this.chart);
-			}
-			// #ifdef APP-NVUE
-			if(typeof callback === 'function') {
-				this.$refs.webview.evalJs(`setChart(${JSON.stringify(callback.toString())}, ${JSON.stringify(this.chart.options)})`);
-			}
-			// #endif
-		},
-		setOption() {
-			if (!this.chart || !this.chart.setOption) {
-				console.warn(`组件还未初始化，请先使用 init`)
-				return
-			}
-			this.chart.setOption(...arguments);
-		},
-		showLoading() {
-			if(this.chart) {
-				this.chart.showLoading(...arguments)
-			}
-		},
-		hideLoading() {
-			if(this.chart) {
-				this.chart.hideLoading()
-			}
-		},
-		clear() {
-			if(this.chart && !this.chart.isDisposed()) {
-				this.chart.clear()
-			}
-		},
-		dispose() {
-			if(this.chart && !this.chart.isDisposed()) {
-				this.chart.dispose()
-			}
-		},
-		resize(size) {
-			if(size && size.width && size.height) {
-				this.height = size.height
-				this.width = size.width
-				if(this.chart) {this.chart.resize(size)}
-			} else {
-				this.$nextTick(() => {
-					getRect('.lime-echart', this).then(res =>{
-						if (res) {
-							let { width, height } = res;
-							this.width = width = width || 300;
-							this.height = height = height || 300;
-							this.chart.resize({width, height})
-						}
-					})
-				})
-			}
-			
-		},
-		canvasToTempFilePath(args = {}) {
-			// #ifndef APP-NVUE
-			const { use2dCanvas, canvasId } = this;
-			return new Promise((resolve, reject) => {
-				const copyArgs = Object.assign({
-					canvasId,
-					success: resolve,
-					fail: reject
-				}, args);
-				if (use2dCanvas) {
-					delete copyArgs.canvasId;
-					copyArgs.canvas = this.canvasNode;
-				}
-				uni.canvasToTempFilePath(copyArgs, this);
-			});
-			// #endif
-			// #ifdef APP-NVUE
-			this.file = ''
-			this.$refs.webview.evalJs(`canvasToTempFilePath()`);
-			return new Promise((resolve, reject) => {
-				this.$watch('file', async (file) => {
-					if(file) {
-						const tempFilePath = await base64ToPath(file)
-						resolve(args.success({tempFilePath}))
-					} else {
-						reject(args.fail({error: ``}))
-					}
-				})
-			})
-			// #endif
-		},
-		async init(echarts, ...args) {
-			// #ifndef APP-NVUE
-			if(args && args.length == 0 && !echarts) {
-				console.error('缺少参数：init(echarts, theme?:string, opts?: object, callback?: function)')
-				return
-			}
-			// #endif
-			let theme=null,opts={},callback;
-			// Array.from(arguments)
-			args.forEach(item => {
-				if(typeof item === 'function') {
-					callback = item
-				}
-				if(['string'].includes(typeof item)) {
-					theme = item
-				}
-				if(typeof item === 'object') {
-					opts = item
-				}
-			})
-			if(this.beforeDelay) {
-				await sleep(this.beforeDelay)
-			}
-			let config = await this.getContext();
-			// #ifndef APP-NVUE
-			setCanvasCreator(echarts, config)
-			try {
-				this.chart = echarts.init(config.canvas, theme, Object.assign({}, config, opts || {}))
-				
-				callback?.(this.chart)
-				return this.chart
-			} catch(e) {
-				console.error("【lime-echarts】:", e)
-				return null
-			}
-			// #endif
-			// #ifdef APP-NVUE
-			this.chart = new Echarts(this.$refs.webview)
-			this.$refs.webview.evalJs(`init(null, null, ${JSON.stringify(opts)}, ${theme})`)
-			callback?.(this.chart)
-			return this.chart
-			// #endif
-		},
-		getContext() {
-			// #ifdef APP-NVUE
-			if(this.finished) {
-				return Promise.resolve(this.finished)
-			}
-			return new Promise(resolve => {
-				this.$watch('finished', (val) => {
-					if(val) {
-						resolve(this.finished)
-					}
-				})
-			})
-			// #endif
-			// #ifndef APP-NVUE
-			return getRect(`#${this.canvasId}`, this, this.use2dCanvas).then(res => {
-				if(res) {
-					let dpr = devicePixelRatio
-					let {width, height, node} = res
-					let canvas;
-					this.width = width = width || 300;
-					this.height = height = height || 300;
-					if(node) {
-						const ctx = node.getContext('2d');
-						canvas = new Canvas(ctx, this, true, node);
-						this.canvasNode = node
-					} else {
-						// #ifdef MP-TOUTIAO
-						dpr = !this.isPC ? devicePixelRatio : 1// 1.25
-						// #endif
-						// #ifndef MP-ALIPAY || MP-TOUTIAO
-						dpr = this.isPC ? devicePixelRatio : 1
-						// #endif
-						// #ifdef MP-ALIPAY || MP-LARK
-						dpr = devicePixelRatio
-						// #endif
-						// #ifdef WEB
-						dpr = 1
-						// #endif
-						this.rect = res
-						this.nodeWidth = width * dpr;
-						this.nodeHeight = height * dpr;
-						const ctx = uni.createCanvasContext(this.canvasId, this);
-						canvas =  new Canvas(ctx, this, false);
-					}
-					
-					return { canvas, width, height, devicePixelRatio: dpr, node };
-				} else {
-					return {}
-				}
-			})
-			// #endif
-		},
-		// #ifndef APP-NVUE
-		getRelative(e, touches) {
-			let { clientX, clientY } = e
-			if(!(clientX && clientY) && touches && touches[0]) {
-				clientX = touches[0].clientX
-				clientY = touches[0].clientY
-			}
-			return {x: clientX - this.rect.left, y: clientY - this.rect.top, wheelDelta: e.wheelDelta || 0}
-		},
-		getTouch(e, touches) {
-			const {x} = touches && touches[0] || {}
-			const touch = x ? touches[0] : this.getRelative(e, touches);
-			if(this.landscape) {
-				[touch.x, touch.y] = [touch.y, this.height - touch.x]
-			}
-			return touch;
-		},
-		touchStart(e) {
-			this.isDown = true
-			const next = () => {
-				const touches = convertTouchesToArray(e.touches)
-				if(this.chart) {
-					const touch = this.getTouch(e, touches)
-					this.startX = touch.x
-					this.startY = touch.y
-					this.startT = new Date()
-					const handler = this.chart.getZr().handler;
-					dispatch.call(handler, 'mousedown', touch)
-					dispatch.call(handler, 'mousemove', touch)
-					handler.processGesture(wrapTouch(e), 'start');
-					clearTimeout(this.endTimer);
-				}
-				
-			}
-			if(this.isPC) {
-				getRect(`#${this.canvasId}`, {context: this}).then(res => {
-					this.rect = res
-					next()
-				})
-				return
-			}
-			next()
-		},
-		touchMove(e) {
-			if(this.isPC && this.enableHover && !this.isDown) {this.isDown = true}
-			const touches = convertTouchesToArray(e.touches)
-			if (this.chart && this.isDown) {
-				const handler = this.chart.getZr().handler;
-				dispatch.call(handler, 'mousemove', this.getTouch(e, touches))
-				handler.processGesture(wrapTouch(e), 'change');
-			}
-			
-		},
-		touchEnd(e) {
-			this.isDown = false
-			if (this.chart) {
-				const touches = convertTouchesToArray(e.changedTouches)
-				const {x} = touches && touches[0] || {}
-				const touch = (x ? touches[0] : this.getRelative(e, touches)) || {};
-				if(this.landscape) {
-					[touch.x, touch.y] = [touch.y,  this.height - touch.x]
-				}
-				const handler = this.chart.getZr().handler;
-				const isClick = Math.abs(touch.x - this.startX) < 10 && new Date() - this.startT < 200;
-				dispatch.call(handler, 'mouseup', touch)
-				handler.processGesture(wrapTouch(e), 'end');
-				if(isClick) {
-					dispatch.call(handler, 'click', touch)
-				} else {
-					this.endTimer = setTimeout(() => {
-						dispatch.call(handler, 'mousemove', {x: 999999999,y: 999999999});
-						dispatch.call(handler, 'mouseup', {x: 999999999,y: 999999999});
-					},50)
-				}
-			}
-		},
-		// #endif
-		// #ifdef H5
-		mousewheel(e){
-			if(this.chart) {
-				dispatch.call(this.chart.getZr().handler, 'mousewheel', this.getTouch(e))
-			}
-		}
-		// #endif
-	}
+    name: "lime-echart",
+    props: {
+        // #ifdef MP-WEIXIN || MP-TOUTIAO
+        type: {
+            type: String,
+            default: "2d",
+        },
+        // #endif
+        // #ifdef APP-NVUE
+        webviewStyles: Object,
+        // hybrid: Boolean,
+        // #endif
+        customStyle: String,
+        isDisableScroll: Boolean,
+        isClickable: {
+            type: Boolean,
+            default: true,
+        },
+        enableHover: Boolean,
+        beforeDelay: {
+            type: Number,
+            default: 30,
+        },
+        landscape: Boolean,
+    },
+    data() {
+        return {
+            // #ifdef MP-WEIXIN || MP-TOUTIAO || MP-ALIPAY
+            use2dCanvas: true,
+            // #endif
+            // #ifndef MP-WEIXIN || MP-TOUTIAO || MP-ALIPAY
+            use2dCanvas: false,
+            // #endif
+            ariaLabel: "图表",
+            width: null,
+            height: null,
+            nodeWidth: null,
+            nodeHeight: null,
+            // canvasNode: null,
+            config: {},
+            inited: false,
+            finished: false,
+            file: "",
+            platform: "",
+            isPC: false,
+            isDown: false,
+            isOffscreenCanvas: false,
+            offscreenWidth: 0,
+            offscreenHeight: 0,
+        };
+    },
+    computed: {
+        rootStyle() {
+            if (this.landscape) {
+                return `transform: translate(-50%,-50%) rotate(90deg); top:50%; left:50%;`;
+            }
+        },
+        canvasId() {
+            return `lime-echart${(this._ && this._.uid) || this._uid}`;
+        },
+        offscreenCanvasId() {
+            return `${this.canvasId}_offscreen`;
+        },
+        offscreenStyle() {
+            return `width:${this.offscreenWidth}px;height: ${this.offscreenHeight}px; position: fixed; left: 99999px; background: red`;
+        },
+        canvasStyle() {
+            return (
+                this.rootStyle +
+                (this.width && this.height
+                    ? "width:" + this.width + "px;height:" + this.height + "px"
+                    : "")
+            );
+        },
+    },
+    // #ifndef VUE3
+    beforeDestroy() {
+        this.clear();
+        this.dispose();
+        // #ifdef H5
+        if (this.isPC) {
+            document.removeEventListener("mousewheel", this.mousewheel);
+        }
+        // #endif
+    },
+    // #endif
+    // #ifdef VUE3
+    beforeUnmount() {
+        this.clear();
+        this.dispose();
+        // #ifdef H5
+        if (this.isPC) {
+            document.removeEventListener("mousewheel", this.mousewheel);
+        }
+        // #endif
+    },
+    // #endif
+    created() {
+        // #ifdef H5
+        if (!("ontouchstart" in window)) {
+            this.isPC = true;
+            document.addEventListener("mousewheel", this.mousewheel);
+        }
+        // #endif
+        // #ifdef MP-WEIXIN || MP-TOUTIAO || MP-ALIPAY
+        const { platform } = getDeviceInfo();
+        this.isPC = /windows/i.test(platform);
+        // #endif
+        this.use2dCanvas = this.type === "2d" && canIUseCanvas2d();
+    },
+    mounted() {
+        this.$nextTick(() => {
+            this.$emit("finished");
+        });
+    },
+    methods: {
+        // #ifdef APP-NVUE
+        onMessage(e) {
+            const detail = e?.detail?.data[0] || null;
+            const data = detail?.data;
+            const key = detail?.event;
+            const options = data?.options;
+            const event = data?.event;
+            const file = detail?.file;
+            if (key == "log" && data) {
+                console.log(data);
+            }
+            if (event) {
+                this.chart.dispatchAction(event.replace(/"/g, ""), options);
+            }
+            if (file) {
+                thie.file = file;
+            }
+        },
+        // #endif
+        setChart(callback) {
+            if (!this.chart) {
+                console.warn(`组件还未初始化，请先使用 init`);
+                return;
+            }
+            if (typeof callback === "function" && this.chart) {
+                callback(this.chart);
+            }
+            // #ifdef APP-NVUE
+            if (typeof callback === "function") {
+                this.$refs.webview.evalJs(
+                    `setChart(${JSON.stringify(
+                        callback.toString()
+                    )}, ${JSON.stringify(this.chart.options)})`
+                );
+            }
+            // #endif
+        },
+        setOption() {
+            if (!this.chart || !this.chart.setOption) {
+                console.warn(`组件还未初始化，请先使用 init`);
+                return;
+            }
+            this.chart.setOption(...arguments);
+        },
+        showLoading() {
+            if (this.chart) {
+                this.chart.showLoading(...arguments);
+            }
+        },
+        hideLoading() {
+            if (this.chart) {
+                this.chart.hideLoading();
+            }
+        },
+        clear() {
+            if (this.chart && !this.chart.isDisposed()) {
+                this.chart.clear();
+            }
+        },
+        dispose() {
+            if (this.chart && !this.chart.isDisposed()) {
+                this.chart.dispose();
+            }
+        },
+        resize(size) {
+            if (size && size.width && size.height) {
+                this.height = size.height;
+                this.width = size.width;
+                if (this.chart) {
+                    this.chart.resize(size);
+                }
+            } else {
+                this.$nextTick(() => {
+                    getRect(".lime-echart", this).then((res) => {
+                        if (res) {
+                            let { width, height } = res;
+                            this.width = width = width || 300;
+                            this.height = height = height || 300;
+                            this.chart.resize({ width, height });
+                        }
+                    });
+                });
+            }
+        },
+        canvasToTempFilePath(args = {}) {
+            // #ifndef APP-NVUE
+            const { use2dCanvas, canvasId } = this;
+            return new Promise((resolve, reject) => {
+                const copyArgs = Object.assign(
+                    {
+                        canvasId,
+                        success: resolve,
+                        fail: reject,
+                    },
+                    args
+                );
+                if (use2dCanvas) {
+                    delete copyArgs.canvasId;
+                    copyArgs.canvas = this.canvasNode;
+                }
+                uni.canvasToTempFilePath(copyArgs, this);
+            });
+            // #endif
+            // #ifdef APP-NVUE
+            this.file = "";
+            this.$refs.webview.evalJs(`canvasToTempFilePath()`);
+            return new Promise((resolve, reject) => {
+                this.$watch("file", async (file) => {
+                    if (file) {
+                        const tempFilePath = await base64ToPath(file);
+                        resolve(args.success({ tempFilePath }));
+                    } else {
+                        reject(args.fail({ error: `` }));
+                    }
+                });
+            });
+            // #endif
+        },
+        async init(echarts, ...args) {
+            // #ifndef APP-NVUE
+            if (args && args.length == 0 && !echarts) {
+                console.error(
+                    "缺少参数：init(echarts, theme?:string, opts?: object, callback?: function)"
+                );
+                return;
+            }
+            // #endif
+            let theme = null,
+                opts = {},
+                callback;
+            // Array.from(arguments)
+            args.forEach((item) => {
+                if (typeof item === "function") {
+                    callback = item;
+                }
+                if (["string"].includes(typeof item)) {
+                    theme = item;
+                }
+                if (typeof item === "object") {
+                    opts = item;
+                }
+            });
+            if (this.beforeDelay) {
+                await sleep(this.beforeDelay);
+            }
+            let config = await this.getContext();
+            // #ifndef APP-NVUE
+            setCanvasCreator(echarts, config);
+            try {
+                this.chart = echarts.init(
+                    config.canvas,
+                    theme,
+                    Object.assign({}, config, opts || {})
+                );
+
+                callback?.(this.chart);
+                return this.chart;
+            } catch (e) {
+                console.error("【lime-echarts】:", e);
+                return null;
+            }
+            // #endif
+            // #ifdef APP-NVUE
+            this.chart = new Echarts(this.$refs.webview);
+            this.$refs.webview.evalJs(
+                `init(null, null, ${JSON.stringify(opts)}, ${theme})`
+            );
+            callback?.(this.chart);
+            return this.chart;
+            // #endif
+        },
+        getContext() {
+            // #ifdef APP-NVUE
+            if (this.finished) {
+                return Promise.resolve(this.finished);
+            }
+            return new Promise((resolve) => {
+                this.$watch("finished", (val) => {
+                    if (val) {
+                        resolve(this.finished);
+                    }
+                });
+            });
+            // #endif
+            // #ifndef APP-NVUE
+            return getRect(`#${this.canvasId}`, this, this.use2dCanvas).then(
+                (res) => {
+                    if (res) {
+                        let dpr = devicePixelRatio;
+                        let { width, height, node } = res;
+                        let canvas;
+                        this.width = width = width || 300;
+                        this.height = height = height || 300;
+                        if (node) {
+                            const ctx = node.getContext("2d");
+                            canvas = new Canvas(ctx, this, true, node);
+                            this.canvasNode = node;
+                        } else {
+                            // #ifdef MP-TOUTIAO
+                            dpr = !this.isPC ? devicePixelRatio : 1; // 1.25
+                            // #endif
+                            // #ifndef MP-ALIPAY || MP-TOUTIAO
+                            dpr = this.isPC ? devicePixelRatio : 1;
+                            // #endif
+                            // #ifdef MP-ALIPAY || MP-LARK
+                            dpr = devicePixelRatio;
+                            // #endif
+                            // #ifdef WEB
+                            dpr = 1;
+                            // #endif
+                            this.rect = res;
+                            this.nodeWidth = width * dpr;
+                            this.nodeHeight = height * dpr;
+                            const ctx = uni.createCanvasContext(
+                                this.canvasId,
+                                this
+                            );
+                            canvas = new Canvas(ctx, this, false);
+                        }
+
+                        return {
+                            canvas,
+                            width,
+                            height,
+                            devicePixelRatio: dpr,
+                            node,
+                        };
+                    } else {
+                        return {};
+                    }
+                }
+            );
+            // #endif
+        },
+        // #ifndef APP-NVUE
+        getRelative(e, touches) {
+            let { clientX, clientY } = e;
+            if (!(clientX && clientY) && touches && touches[0]) {
+                clientX = touches[0].clientX;
+                clientY = touches[0].clientY;
+            }
+            return {
+                x: clientX - this.rect.left,
+                y: clientY - this.rect.top,
+                wheelDelta: e.wheelDelta || 0,
+            };
+        },
+        getTouch(e, touches) {
+            const { x } = (touches && touches[0]) || {};
+            const touch = x ? touches[0] : this.getRelative(e, touches);
+            if (this.landscape) {
+                [touch.x, touch.y] = [touch.y, this.height - touch.x];
+            }
+            return touch;
+        },
+        touchStart(e) {
+            this.isDown = true;
+            const next = () => {
+                const touches = convertTouchesToArray(e.touches);
+                if (this.chart) {
+                    const touch = this.getTouch(e, touches);
+                    this.startX = touch.x;
+                    this.startY = touch.y;
+                    this.startT = new Date();
+                    const handler = this.chart.getZr().handler;
+                    dispatch.call(handler, "mousedown", touch);
+                    dispatch.call(handler, "mousemove", touch);
+                    handler.processGesture(wrapTouch(e), "start");
+                    clearTimeout(this.endTimer);
+                }
+            };
+            if (this.isPC) {
+                getRect(`#${this.canvasId}`, { context: this }).then((res) => {
+                    this.rect = res;
+                    next();
+                });
+                return;
+            }
+            next();
+        },
+        touchMove(e) {
+            if (this.isPC && this.enableHover && !this.isDown) {
+                this.isDown = true;
+            }
+            const touches = convertTouchesToArray(e.touches);
+            if (this.chart && this.isDown) {
+                const handler = this.chart.getZr().handler;
+                dispatch.call(handler, "mousemove", this.getTouch(e, touches));
+                handler.processGesture(wrapTouch(e), "change");
+            }
+        },
+        touchEnd(e) {
+            this.isDown = false;
+            if (this.chart) {
+                const touches = convertTouchesToArray(e.changedTouches);
+                const { x } = (touches && touches[0]) || {};
+                const touch =
+                    (x ? touches[0] : this.getRelative(e, touches)) || {};
+                if (this.landscape) {
+                    [touch.x, touch.y] = [touch.y, this.height - touch.x];
+                }
+                const handler = this.chart.getZr().handler;
+                const isClick =
+                    Math.abs(touch.x - this.startX) < 10 &&
+                    new Date() - this.startT < 200;
+                dispatch.call(handler, "mouseup", touch);
+                handler.processGesture(wrapTouch(e), "end");
+                if (isClick) {
+                    dispatch.call(handler, "click", touch);
+                } else {
+                    this.endTimer = setTimeout(() => {
+                        dispatch.call(handler, "mousemove", {
+                            x: 999999999,
+                            y: 999999999,
+                        });
+                        dispatch.call(handler, "mouseup", {
+                            x: 999999999,
+                            y: 999999999,
+                        });
+                    }, 50);
+                }
+            }
+        },
+        // #endif
+        // #ifdef H5
+        mousewheel(e) {
+            if (this.chart) {
+                dispatch.call(
+                    this.chart.getZr().handler,
+                    "mousewheel",
+                    this.getTouch(e)
+                );
+            }
+        },
+        // #endif
+    },
 };
 </script>
-<style>	
+<style>
 .lime-echart {
-	position: relative;
-	/* #ifndef APP-NVUE */
-	width: 100%;
-	height: 100%;
-	/* #endif */
-	/* #ifdef APP-NVUE */
-	flex: 1;
-	/* #endif */
+    position: relative;
+    /* #ifndef APP-NVUE */
+    width: 100%;
+    height: 100%;
+    /* #endif */
+    /* #ifdef APP-NVUE */
+    flex: 1;
+    /* #endif */
 }
 .lime-echart__canvas {
-	/* #ifndef APP-NVUE */
-	width: 100%;
-	height: 100%;
-	/* #endif */
-	/* #ifdef APP-NVUE */
-	flex: 1;
-	/* #endif */
+    /* #ifndef APP-NVUE */
+    width: 100%;
+    height: 100%;
+    /* #endif */
+    /* #ifdef APP-NVUE */
+    flex: 1;
+    /* #endif */
 }
 /* #ifndef APP-NVUE */
 .lime-echart__mask {
-	position: absolute;
-	width: 100%;
-	height: 100%;
-	left: 0;
-	top: 0;
-	z-index: 1;
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    left: 0;
+    top: 0;
+    z-index: 1;
 }
 /* #endif */
 </style>