Showing
11 changed files
with
56 additions
and
27 deletions
... | ... | @@ -171,7 +171,7 @@ |
171 | 171 | |
172 | 172 | const resize = async () => { |
173 | 173 | const { height } = unref(getContainerSize); |
174 | - height && setProps({ maxHeight: height - 100, scroll: { x: 470, y: height - 100 } }); | |
174 | + height && setProps({ maxHeight: height - 110, scroll: { x: 470, y: height - 110 } }); | |
175 | 175 | await nextTick(); |
176 | 176 | redoHeight(); |
177 | 177 | }; | ... | ... |
... | ... | @@ -216,10 +216,13 @@ |
216 | 216 | :class="!getDesign.showTime && 'p-5'" |
217 | 217 | > |
218 | 218 | <DeviceName :config="config" /> |
219 | - <div ref="chartRefEl" class="flex-1 w-full h-full"> </div> | |
220 | - <div class="text-gray-500 text-xs text-center truncate">{{ | |
221 | - getDesign.attribute || '湿度' | |
222 | - }}</div> | |
219 | + <div class="w-full h-full flex flex-1 flex-col justify-center items-center"> | |
220 | + <div ref="chartRefEl" class="flex-1 w-full h-6/7 flex flex-col justify-center items-center"> | |
221 | + </div> | |
222 | + <div class="text-gray-500 text-xs text-center truncate">{{ | |
223 | + getDesign.attribute || '湿度' | |
224 | + }}</div> | |
225 | + </div> | |
223 | 226 | <UpdateTime v-if="getDesign.showTime" :time="time" /> |
224 | 227 | </main> |
225 | 228 | </template> | ... | ... |
... | ... | @@ -226,10 +226,13 @@ |
226 | 226 | :class="!getDesign.showTime && 'p-5'" |
227 | 227 | > |
228 | 228 | <DeviceName :config="config" /> |
229 | - <div ref="chartRefEl" class="flex-1 w-full h-full"> </div> | |
230 | - <div class="text-gray-500 text-xs text-center truncate">{{ | |
231 | - getDesign.attribute || '湿度' | |
232 | - }}</div> | |
229 | + <div class="flex w-full h-full flex-col justify-center items-center flex-1"> | |
230 | + <div ref="chartRefEl" class="flex-1 w-full h-6/7 flex-col justify-center items-center flex"> | |
231 | + </div> | |
232 | + <div class="text-gray-500 text-xs text-center truncate">{{ | |
233 | + getDesign.attribute || '湿度' | |
234 | + }}</div> | |
235 | + </div> | |
233 | 236 | <UpdateTime v-if="getDesign.showTime" :time="time" /> |
234 | 237 | </main> |
235 | 238 | </template> | ... | ... |
... | ... | @@ -316,7 +316,8 @@ |
316 | 316 | <template> |
317 | 317 | <main class="w-full h-full flex flex-col justify-center items-center"> |
318 | 318 | <DeviceName :config="config" /> |
319 | - <div ref="chartRefEl" class="flex-1 w-full h-full"> </div> | |
319 | + <div ref="chartRefEl" class="flex-1 w-full h-full justify-center items-center flex-col flex"> | |
320 | + </div> | |
320 | 321 | <!-- <UpdateTime :time="time" /> --> |
321 | 322 | </main> |
322 | 323 | </template> | ... | ... |
... | ... | @@ -208,10 +208,13 @@ |
208 | 208 | :class="!getDesign.showTime && 'p-5'" |
209 | 209 | > |
210 | 210 | <DeviceName :config="config" /> |
211 | - <div ref="chartRefEl" class="flex-1 w-full h-full"> </div> | |
212 | - <div class="text-gray-500 text-xs text-center truncate">{{ | |
213 | - getDesign.attribute || '速度' | |
214 | - }}</div> | |
211 | + <div class="flex flex-1 flex-col justify-center items-center w-full h-full"> | |
212 | + <div ref="chartRefEl" class="flex-1 w-full h-6/7 flex flex-col justify-center items-center"> | |
213 | + </div> | |
214 | + <div class="text-gray-500 text-xs text-center truncate">{{ | |
215 | + getDesign.attribute || '速度' | |
216 | + }}</div> | |
217 | + </div> | |
215 | 218 | <UpdateTime v-if="getDesign.showTime" :time="time" /> |
216 | 219 | </main> |
217 | 220 | </template> | ... | ... |
... | ... | @@ -235,10 +235,13 @@ |
235 | 235 | :class="!getDesign.showTime && 'p-5'" |
236 | 236 | > |
237 | 237 | <DeviceName :config="config" /> |
238 | - <div ref="chartRefEl" class="flex-1 w-full h-full"> </div> | |
239 | - <div class="text-gray-500 text-xs text-center truncate">{{ | |
240 | - getDesign.attribute || '温度' | |
241 | - }}</div> | |
238 | + <div class="w-full h-full flex justify-center items-center flex-1 flex-col"> | |
239 | + <div ref="chartRefEl" class="flex-1 w-full h-6/7 flex justify-center items-center flex-col"> | |
240 | + </div> | |
241 | + <div class="text-gray-500 text-xs text-center truncate">{{ | |
242 | + getDesign.attribute || '温度' | |
243 | + }}</div> | |
244 | + </div> | |
242 | 245 | <UpdateTime v-show="getDesign.showTime" :time="time" /> |
243 | 246 | </main> |
244 | 247 | </template> | ... | ... |
... | ... | @@ -215,9 +215,12 @@ |
215 | 215 | :class="!getDesign.showTime && 'p-5'" |
216 | 216 | > |
217 | 217 | <DeviceName :config="config" /> |
218 | - <div ref="chartRefEl" class="flex-1 w-full h-full"> </div> | |
219 | - <div class="text-center text-gray-500 text-xs truncate"> | |
220 | - {{ getDesign.attribute || '速度' }} | |
218 | + <div class="w-full h-full flex justify-center items-center flex-col flex-1"> | |
219 | + <div ref="chartRefEl" class="flex-1 w-full h-6/7 flex flex-col justify-center items-center"> | |
220 | + </div> | |
221 | + <div class="text-center text-gray-500 text-xs truncate"> | |
222 | + {{ getDesign.attribute || '速度' }} | |
223 | + </div> | |
221 | 224 | </div> |
222 | 225 | <UpdateTime v-show="getDesign.showTime" :time="time" /> |
223 | 226 | </main> | ... | ... |
... | ... | @@ -159,6 +159,7 @@ |
159 | 159 | }); |
160 | 160 | |
161 | 161 | const resize = async () => { |
162 | + console.log(123321); | |
162 | 163 | await nextTick(); |
163 | 164 | |
164 | 165 | // 修改echarts大小 |
... | ... | @@ -178,7 +179,11 @@ |
178 | 179 | <template> |
179 | 180 | <main class="w-full h-full flex flex-col justify-center items-center"> |
180 | 181 | <DeviceName :config="config" /> |
181 | - <div ref="chartRefEl" class="flex-1 w-full h-full"> </div> | |
182 | + <div | |
183 | + ref="chartRefEl" | |
184 | + class="flex-1 w-full h-7/8 flex justify-center items-center flex-col mb-3" | |
185 | + > | |
186 | + </div> | |
182 | 187 | <!-- <UpdateTime :time="time" /> --> |
183 | 188 | </main> |
184 | 189 | </template> | ... | ... |
... | ... | @@ -180,7 +180,11 @@ |
180 | 180 | <template> |
181 | 181 | <main class="w-full h-full flex flex-col justify-center items-center"> |
182 | 182 | <DeviceName :config="config" /> |
183 | - <div ref="chartRefEl" class="flex-1 w-full h-full"> </div> | |
183 | + <div | |
184 | + ref="chartRefEl" | |
185 | + class="flex-1 w-full h-full flex flex-col justify-center items-center mb-3" | |
186 | + > | |
187 | + </div> | |
184 | 188 | <!-- <UpdateTime :time="time" /> --> |
185 | 189 | </main> |
186 | 190 | </template> | ... | ... |
... | ... | @@ -137,7 +137,7 @@ |
137 | 137 | }); |
138 | 138 | const resize = async () => { |
139 | 139 | const { height } = unref(getContainerSize); |
140 | - height && setProps({ maxHeight: height - 100, scroll: { x: 470, y: height - 100 } }); | |
140 | + height && setProps({ maxHeight: height - 110, scroll: { x: 470, y: height - 110 } }); | |
141 | 141 | |
142 | 142 | await nextTick(); |
143 | 143 | redoHeight(); | ... | ... |
... | ... | @@ -52,7 +52,7 @@ |
52 | 52 | top: '30%', |
53 | 53 | left: '6%', |
54 | 54 | right: '10%', |
55 | - bottom: '1%', | |
55 | + bottom: '8%', | |
56 | 56 | containLabel: true, |
57 | 57 | }, |
58 | 58 | xAxis: { |
... | ... | @@ -206,9 +206,13 @@ |
206 | 206 | </script> |
207 | 207 | |
208 | 208 | <template> |
209 | - <main class="w-full h-full flex flex-col justify-center items-center"> | |
209 | + <main class="w-full h-full flex flex-col justify-center items-center flex-1"> | |
210 | 210 | <DeviceName :config="config" /> |
211 | - <div ref="chartRefEl" class="flex-1 w-full h-full"> </div> | |
211 | + <div | |
212 | + ref="chartRefEl" | |
213 | + class="flex-1 w-full h-7/8 flex-col justify-center items-center flex mb-3" | |
214 | + > | |
215 | + </div> | |
212 | 216 | <!-- <UpdateTime :time="time" /> --> |
213 | 217 | </main> |
214 | 218 | </template> | ... | ... |