Commit 75eaca99d20203def471a1fbbf3d8b14290d11a6

Authored by xp.Huang
2 parents e34b478a f4e759b1

Merge branch 'local_dev_ft' into 'main'

pref:优化标题字数过长导致样式错乱

See merge request huang/thingskit-app!94
@@ -8,7 +8,7 @@ @@ -8,7 +8,7 @@
8 <u-icon v-if="deviceDetail.deviceInfo.longitude !== ''" @click="handleClick" name="map-fill"> 8 <u-icon v-if="deviceDetail.deviceInfo.longitude !== ''" @click="handleClick" name="map-fill">
9 </u-icon> 9 </u-icon>
10 </view> 10 </view>
11 - <view style="margin-left: 20rpx;">{{ deviceDetail.alias? deviceDetail.alias: deviceDetail.name }}</view> 11 + <view class="text-clip" style="margin-left: 20rpx;width:370rpx">{{ deviceDetail.alias? deviceDetail.alias: deviceDetail.name }}</view>
12 <view style="margin-left: 20rpx; font-size: 14px;" 12 <view style="margin-left: 20rpx; font-size: 14px;"
13 :style="{ color: deviceDetail.deviceState === 'INACTIVE' ? '#666' : deviceDetail.deviceState === 'ONLINE' ? '#377DFF' : '#DE4437' }"> 13 :style="{ color: deviceDetail.deviceState === 'INACTIVE' ? '#666' : deviceDetail.deviceState === 'ONLINE' ? '#377DFF' : '#DE4437' }">
14 {{ deviceDetail.deviceState === 'INACTIVE' ? '待激活' : deviceDetail.deviceState === 'ONLINE' ? '在线' : '离线' }} 14 {{ deviceDetail.deviceState === 'INACTIVE' ? '待激活' : deviceDetail.deviceState === 'ONLINE' ? '在线' : '离线' }}
@@ -4,10 +4,7 @@ @@ -4,10 +4,7 @@
4 <view class="device-top"> 4 <view class="device-top">
5 <view class="search"> 5 <view class="search">
6 <view> 6 <view>
7 - <view class="search-left">  
8 - <u--input prefixIcon="search" placeholder="输入设备SN或名称搜索" shape="circle"  
9 - @change="inputChanged"></u--input>  
10 - </view> 7 + <view class="search-left"><u--input prefixIcon="search" placeholder="输入设备SN或名称搜索" shape="circle" @change="inputChanged"></u--input></view>
11 </view> 8 </view>
12 <view @click="openSearchDialog" class="search-right"> 9 <view @click="openSearchDialog" class="search-right">
13 <text>筛选</text> 10 <text>筛选</text>
@@ -28,19 +25,22 @@ @@ -28,19 +25,22 @@
28 </view> 25 </view>
29 </view> 26 </view>
30 </u-sticky> 27 </u-sticky>
31 - <mescroll-body ref="mescrollRef" @init="mescrollInit" :up="upOption" :down="downOption" @down="downCallback"  
32 - @up="upCallback"> 28 + <mescroll-body ref="mescrollRef" @init="mescrollInit" :up="upOption" :down="downOption" @down="downCallback" @up="upCallback">
33 <view class="device-list"> 29 <view class="device-list">
34 - <view @click="openDeviceDetail(item.id, item.alarmStatus, item.lastOnlineTime, item.tbDeviceId)"  
35 - class="list-item" v-for="item in list" :key="item.id">  
36 - <view class="u-flex item" style=" 30 + <view @click="openDeviceDetail(item.id, item.alarmStatus, item.lastOnlineTime, item.tbDeviceId)" class="list-item" v-for="item in list" :key="item.id">
  31 + <view
  32 + class="u-flex item"
  33 + style="
37 justify-content: flex-start; 34 justify-content: flex-start;
38 flex-direction: column; 35 flex-direction: column;
39 align-items: center; 36 align-items: center;
40 - "> 37 + "
  38 + >
41 <view style="width: 450rpx; text-align: left"> 39 <view style="width: 450rpx; text-align: left">
42 - <text  
43 - style="color: #333; font-size: 15px;font-weight: bold;">{{ item.alias?item.alias:item.name }}</text> 40 + <view class="text-clip" style="width:450rpx">
  41 + <text class="" style="color: #333; font-size: 15px;font-weight: bold;">{{ item.alias ? item.alias : item.name }}</text>
  42 + </view>
  43 +
44 </view> 44 </view>
45 <view style="width: 450rpx; text-align: left; margin-top: 10rpx"> 45 <view style="width: 450rpx; text-align: left; margin-top: 10rpx">
46 <view style="color: #666; font-size: 14px;display: flex;"> 46 <view style="color: #666; font-size: 14px;display: flex;">
@@ -57,26 +57,32 @@ @@ -57,26 +57,32 @@
57 </view> 57 </view>
58 <view class="item"> 58 <view class="item">
59 <view class="u-flex" style="margin-top: -6rpx"> 59 <view class="u-flex" style="margin-top: -6rpx">
60 - <image style=" 60 + <image
  61 + style="
61 width: 30rpx; 62 width: 30rpx;
62 height: 30rpx; 63 height: 30rpx;
63 margin-top: 5rpx; 64 margin-top: 5rpx;
64 margin-right: 5rpx; 65 margin-right: 5rpx;
65 - " :src=" 66 + "
  67 + :src="
66 item.deviceState === 'ONLINE' 68 item.deviceState === 'ONLINE'
67 ? '../../static/online.png' 69 ? '../../static/online.png'
68 : item.deviceState === 'INACTIVE' 70 : item.deviceState === 'INACTIVE'
69 ? '../../static/unonline.png' 71 ? '../../static/unonline.png'
70 : '../../static/baojing.png' 72 : '../../static/baojing.png'
71 - " /> 73 + "
  74 + />
72 75
73 <view> 76 <view>
74 - <text style=" 77 + <text
  78 + style="
75 color: #377dff; 79 color: #377dff;
76 font-size: 13px; 80 font-size: 13px;
77 margin-left: 5rpx; 81 margin-left: 5rpx;
78 margin-top: 20rpx; 82 margin-top: 20rpx;
79 - " :style="{ color: item.deviceState === 'ONLINE' ? '#377DFF' : item.deviceState === 'INACTIVE' ? '#666666' : '#DE4437' }"> 83 + "
  84 + :style="{ color: item.deviceState === 'ONLINE' ? '#377DFF' : item.deviceState === 'INACTIVE' ? '#666666' : '#DE4437' }"
  85 + >
80 {{ item.deviceState === 'ONLINE' ? '在线' : item.deviceState === 'INACTIVE' ? '待激活' : '离线' }} 86 {{ item.deviceState === 'ONLINE' ? '在线' : item.deviceState === 'INACTIVE' ? '待激活' : '离线' }}
81 </text> 87 </text>
82 </view> 88 </view>
@@ -86,24 +92,15 @@ @@ -86,24 +92,15 @@
86 </view> 92 </view>
87 </mescroll-body> 93 </mescroll-body>
88 <!-- 设备筛选 --> 94 <!-- 设备筛选 -->
89 - <u-popup @close="close" closeable bgColor="#fff" :show="show" mode="bottom" :round="20"  
90 - @touchmove.stop.prevent="disabledScroll"> 95 + <u-popup @close="close" closeable bgColor="#fff" :show="show" mode="bottom" :round="20" @touchmove.stop.prevent="disabledScroll">
91 <view class="filter" @touchmove.stop.prevent="disabledScroll"> 96 <view class="filter" @touchmove.stop.prevent="disabledScroll">
92 <view class="filter-title"><text>筛选条件</text></view> 97 <view class="filter-title"><text>筛选条件</text></view>
93 - <FilterItem :filterList="deviceStatus" title="设备状态"  
94 - @clickTag="currentIndex => handleClickTag(currentIndex, deviceStatus)"></FilterItem>  
95 - <FilterItem :filterList="alarmStatus" title="告警状态"  
96 - @clickTag="currentIndex => handleClickTag(currentIndex, alarmStatus)"></FilterItem>  
97 - <FilterItem :filterList="typeStatus" title="设备类型"  
98 - @clickTag="currentIndex => handleClickTag(currentIndex, typeStatus)"></FilterItem> 98 + <FilterItem :filterList="deviceStatus" title="设备状态" @clickTag="currentIndex => handleClickTag(currentIndex, deviceStatus)"></FilterItem>
  99 + <FilterItem :filterList="alarmStatus" title="告警状态" @clickTag="currentIndex => handleClickTag(currentIndex, alarmStatus)"></FilterItem>
  100 + <FilterItem :filterList="typeStatus" title="设备类型" @clickTag="currentIndex => handleClickTag(currentIndex, typeStatus)"></FilterItem>
99 <view class="button-group"> 101 <view class="button-group">
100 - <view>  
101 - <u-button :customStyle="{ color: '#333' }" color="#e3e3e5" shape="circle" text="重置"  
102 - @click="resetFilter"></u-button>  
103 - </view>  
104 - <view>  
105 - <u-button color="#3388ff" shape="circle" text="确认" @click="confirmFilter"></u-button>  
106 - </view> 102 + <view><u-button :customStyle="{ color: '#333' }" color="#e3e3e5" shape="circle" text="重置" @click="resetFilter"></u-button></view>
  103 + <view><u-button color="#3388ff" shape="circle" text="确认" @click="confirmFilter"></u-button></view>
107 </view> 104 </view>
108 </view> 105 </view>
109 </u-popup> 106 </u-popup>
@@ -112,317 +109,306 @@ @@ -112,317 +109,306 @@
112 </template> 109 </template>
113 110
114 <script> 111 <script>
115 - import fTabbar from '@/components/module/f-tabbar/f-tabbar';  
116 - import FilterItem from './FilterItem.vue';  
117 - import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js';  
118 - import {  
119 - debounce  
120 - } from '@/plugins/throttle.js';  
121 - export default {  
122 - mixins: [MescrollMixin], // 使用mixin (在main.js注册全局组件)  
123 - components: {  
124 - fTabbar,  
125 - FilterItem  
126 - },  
127 - data() {  
128 - return {  
129 - downOption: {  
130 - auto: false //是否在初始化后,自动执行downCallback; 默认true 112 +import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  113 +import FilterItem from './FilterItem.vue';
  114 +import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js';
  115 +import { debounce } from '@/plugins/throttle.js';
  116 +export default {
  117 + mixins: [MescrollMixin], // 使用mixin (在main.js注册全局组件)
  118 + components: {
  119 + fTabbar,
  120 + FilterItem
  121 + },
  122 + data() {
  123 + return {
  124 + downOption: {
  125 + auto: false //是否在初始化后,自动执行downCallback; 默认true
  126 + },
  127 + upOption: {
  128 + isBounce: false,
  129 + auto: false // 不自动加载
  130 + },
  131 + show: false,
  132 + deviceStatus: [
  133 + {
  134 + checked: true,
  135 + name: '全部',
  136 + type: ''
131 }, 137 },
132 - upOption: {  
133 - isBounce: false,  
134 - auto: false // 不自动加载 138 + {
  139 + checked: false,
  140 + name: '在线',
  141 + type: 'ONLINE'
  142 + },
  143 + {
  144 + checked: false,
  145 + name: '离线',
  146 + type: 'OFFLINE'
  147 + },
  148 + {
  149 + checked: false,
  150 + name: '待激活',
  151 + type: 'INACTIVE'
  152 + }
  153 + ],
  154 + alarmStatus: [
  155 + {
  156 + checked: true,
  157 + name: '全部',
  158 + type: ''
  159 + },
  160 + {
  161 + checked: false,
  162 + name: '告警',
  163 + type: '1'
  164 + },
  165 + {
  166 + checked: false,
  167 + name: '正常',
  168 + type: '0'
  169 + }
  170 + ],
  171 + typeStatus: [
  172 + {
  173 + checked: true,
  174 + name: '全部',
  175 + type: ''
135 }, 176 },
136 - show: false,  
137 - deviceStatus: [{  
138 - checked: true,  
139 - name: '全部',  
140 - type: ''  
141 - },  
142 - {  
143 - checked: false,  
144 - name: '在线',  
145 - type: 'ONLINE'  
146 - },  
147 - {  
148 - checked: false,  
149 - name: '离线',  
150 - type: 'OFFLINE'  
151 - },  
152 - {  
153 - checked: false,  
154 - name: '待激活',  
155 - type: 'INACTIVE'  
156 - }  
157 - ],  
158 - alarmStatus: [{  
159 - checked: true,  
160 - name: '全部',  
161 - type: ''  
162 - },  
163 - {  
164 - checked: false,  
165 - name: '告警',  
166 - type: '1'  
167 - },  
168 - {  
169 - checked: false,  
170 - name: '正常',  
171 - type: '0'  
172 - }  
173 - ],  
174 - typeStatus: [{  
175 - checked: true,  
176 - name: '全部',  
177 - type: ''  
178 - },  
179 177
180 - {  
181 - checked: false,  
182 - name: '直连设备',  
183 - type: 'DIRECT_CONNECTION'  
184 - },  
185 - {  
186 - checked: false,  
187 - name: '网关设备',  
188 - type: 'GATEWAY'  
189 - },  
190 - {  
191 - checked: false,  
192 - name: '网关子设备',  
193 - type: 'SENSOR'  
194 - }  
195 - ],  
196 - total: 0,  
197 - list: [],  
198 - page: {  
199 - num: 0,  
200 - size: 10 178 + {
  179 + checked: false,
  180 + name: '直连设备',
  181 + type: 'DIRECT_CONNECTION'
201 }, 182 },
202 - deviceState: '',  
203 - deviceName: ''  
204 - };  
205 - },  
206 - async onLoad(options) {  
207 - // 隐藏原生的tabbar  
208 - uni.hideTabBar();  
209 - this.page.num = 1;  
210 - const { 183 + {
  184 + checked: false,
  185 + name: '网关设备',
  186 + type: 'GATEWAY'
  187 + },
  188 + {
  189 + checked: false,
  190 + name: '网关子设备',
  191 + type: 'SENSOR'
  192 + }
  193 + ],
  194 + total: 0,
  195 + list: [],
  196 + page: {
  197 + num: 0,
  198 + size: 10
  199 + },
  200 + deviceState: '',
  201 + deviceName: ''
  202 + };
  203 + },
  204 + async onLoad(options) {
  205 + // 隐藏原生的tabbar
  206 + uni.hideTabBar();
  207 + this.page.num = 1;
  208 + const { deviceState } = options;
  209 + this.deviceState = deviceState;
  210 + if (deviceState) {
  211 + this.deviceStatus.forEach(item => {
  212 + item.type === deviceState ? (item.checked = true) : (item.checked = false);
  213 + });
  214 + await this.loadData(1, {
211 deviceState 215 deviceState
212 - } = options;  
213 - this.deviceState = deviceState;  
214 - if (deviceState) {  
215 - this.deviceStatus.forEach(item => {  
216 - item.type === deviceState ? (item.checked = true) : (item.checked = false);  
217 - });  
218 - await this.loadData(1, {  
219 - deviceState  
220 - });  
221 - } else {  
222 - await this.loadData(1);  
223 - }  
224 - if (!this.list.length) {  
225 - this.mescroll.showEmpty();  
226 - } 216 + });
  217 + } else {
  218 + await this.loadData(1);
  219 + }
  220 + if (!this.list.length) {
  221 + this.mescroll.showEmpty();
  222 + }
  223 + },
  224 + onShow() {
  225 + if (this.orgId) {
  226 + this.loadData(1, {
  227 + organizationId: this.orgId
  228 + });
  229 + }
  230 + },
  231 + methods: {
  232 + disabledScroll() {
  233 + return;
227 }, 234 },
228 - onShow() {  
229 - if (this.orgId) {  
230 - this.loadData(1, {  
231 - organizationId: this.orgId  
232 - });  
233 - } 235 + /*下拉刷新的回调 */
  236 + downCallback() {
  237 + this.deviceName = '';
  238 + this.orgId = '';
  239 + //联网加载数据
  240 + this.list = [];
  241 + this.page.num = 1;
  242 + //联网加载数据
  243 + this.resetFilter();
  244 + this.loadData(this.page.num);
234 }, 245 },
235 - methods: {  
236 - disabledScroll() {  
237 - return;  
238 - },  
239 - /*下拉刷新的回调 */  
240 - downCallback() {  
241 - this.deviceName = '';  
242 - this.orgId = '';  
243 - //联网加载数据  
244 - this.list = [];  
245 - this.page.num = 1;  
246 - //联网加载数据  
247 - this.resetFilter();  
248 - this.loadData(this.page.num);  
249 - },  
250 246
251 - /*上拉加载的回调: 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10 */  
252 - upCallback() {  
253 - //联网加载数据  
254 - this.page.num += 1;  
255 - const deviceState = this.deviceStatus.find(item => item.checked);  
256 - const alarmStatus = this.alarmStatus.find(item => item.checked);  
257 - const deviceType = this.typeStatus.find(item => item.checked);  
258 - this.loadData(this.page.num, {  
259 - deviceState: deviceState.type ? deviceState.type : undefined,  
260 - deviceType: deviceType.type ? deviceType.type : undefined,  
261 - alarmStatus: alarmStatus.type === '0' || alarmStatus.type === '1' ? alarmStatus.type :  
262 - undefined,  
263 - name: this.deviceName == null ? null : this.deviceName,  
264 - organizationId: this.orgId == null ? null : this.orgId  
265 - });  
266 - }, 247 + /*上拉加载的回调: 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10 */
  248 + upCallback() {
  249 + //联网加载数据
  250 + this.page.num += 1;
  251 + const deviceState = this.deviceStatus.find(item => item.checked);
  252 + const alarmStatus = this.alarmStatus.find(item => item.checked);
  253 + const deviceType = this.typeStatus.find(item => item.checked);
  254 + this.loadData(this.page.num, {
  255 + deviceState: deviceState.type ? deviceState.type : undefined,
  256 + deviceType: deviceType.type ? deviceType.type : undefined,
  257 + alarmStatus: alarmStatus.type === '0' || alarmStatus.type === '1' ? alarmStatus.type : undefined,
  258 + name: this.deviceName == null ? null : this.deviceName,
  259 + organizationId: this.orgId == null ? null : this.orgId
  260 + });
  261 + },
267 262
268 - //获取设备  
269 - async loadData(pageNo, params = {}) {  
270 - try {  
271 - let httpData = {  
272 - page: pageNo,  
273 - pageSize: 10,  
274 - ...params  
275 - };  
276 - const {  
277 - total,  
278 - items  
279 - } = await uni.$u.http.get('/yt/device', {  
280 - params: httpData,  
281 - custom: {  
282 - load: false  
283 - }  
284 - });  
285 - this.total = total;  
286 - uni.stopPullDownRefresh();  
287 - this.mescroll.endByPage(items.length, total); //必传参数(当前页的数据个数, 总页数)  
288 - if (pageNo == 1) {  
289 - this.list = items;  
290 - } else {  
291 - this.list = this.list.concat(items); 263 + //获取设备
  264 + async loadData(pageNo, params = {}) {
  265 + try {
  266 + let httpData = {
  267 + page: pageNo,
  268 + pageSize: 10,
  269 + ...params
  270 + };
  271 + const { total, items } = await uni.$u.http.get('/yt/device', {
  272 + params: httpData,
  273 + custom: {
  274 + load: false
292 } 275 }
293 - } catch {  
294 - this.mescroll.endErr();  
295 - }  
296 - },  
297 - openOrg() {  
298 - uni.navigateTo({  
299 - url: './org/org'  
300 - });  
301 - },  
302 - close() {  
303 - this.show = false;  
304 - },  
305 - openSearchDialog() {  
306 - this.show = true;  
307 - },  
308 - openDeviceDetail(id, alarmStatus, lastOnlineTime, tbDeviceId) {  
309 - uni.navigateTo({  
310 - url: `/deviceSubPage/deviceDetailPage/deviceDetail?id=${id}&alarmStatus=${alarmStatus}&lastOnlineTime=${lastOnlineTime}&tbDeviceId=${tbDeviceId}`  
311 - });  
312 - },  
313 - handleClickTag(currentIndex, list) {  
314 - list.map((item, index) => {  
315 - item.checked = index === currentIndex;  
316 - });  
317 - },  
318 - resetFilter() {  
319 - const {  
320 - deviceStatus,  
321 - alarmStatus,  
322 - typeStatus  
323 - } = this;  
324 - [deviceStatus, alarmStatus, typeStatus].forEach(item => item.map((item, index) => (item.checked = index ===  
325 - 0)));  
326 - },  
327 - confirmFilter() {  
328 - const deviceState = this.deviceStatus.find(item => item.checked);  
329 - const alarmStatus = this.alarmStatus.find(item => item.checked);  
330 - const deviceType = this.typeStatus.find(item => item.checked);  
331 - this.loadData(1, {  
332 - deviceState: deviceState.type ? deviceState.type : undefined,  
333 - deviceType: deviceType.type ? deviceType.type : undefined,  
334 - alarmStatus: alarmStatus.type === '0' || alarmStatus.type === '1' ? alarmStatus.type :  
335 - undefined  
336 - });  
337 - this.show = false;  
338 - },  
339 - inputChanged(e) {  
340 - this.page.num = 1;  
341 - this.deviceName = e;  
342 - this.loadData(1, {  
343 - name: this.deviceName  
344 }); 276 });
  277 + this.total = total;
  278 + uni.stopPullDownRefresh();
  279 + this.mescroll.endByPage(items.length, total); //必传参数(当前页的数据个数, 总页数)
  280 + if (pageNo == 1) {
  281 + this.list = items;
  282 + } else {
  283 + this.list = this.list.concat(items);
  284 + }
  285 + } catch {
  286 + this.mescroll.endErr();
345 } 287 }
  288 + },
  289 + openOrg() {
  290 + uni.navigateTo({
  291 + url: './org/org'
  292 + });
  293 + },
  294 + close() {
  295 + this.show = false;
  296 + },
  297 + openSearchDialog() {
  298 + this.show = true;
  299 + },
  300 + openDeviceDetail(id, alarmStatus, lastOnlineTime, tbDeviceId) {
  301 + uni.navigateTo({
  302 + url: `/deviceSubPage/deviceDetailPage/deviceDetail?id=${id}&alarmStatus=${alarmStatus}&lastOnlineTime=${lastOnlineTime}&tbDeviceId=${tbDeviceId}`
  303 + });
  304 + },
  305 + handleClickTag(currentIndex, list) {
  306 + list.map((item, index) => {
  307 + item.checked = index === currentIndex;
  308 + });
  309 + },
  310 + resetFilter() {
  311 + const { deviceStatus, alarmStatus, typeStatus } = this;
  312 + [deviceStatus, alarmStatus, typeStatus].forEach(item => item.map((item, index) => (item.checked = index === 0)));
  313 + },
  314 + confirmFilter() {
  315 + const deviceState = this.deviceStatus.find(item => item.checked);
  316 + const alarmStatus = this.alarmStatus.find(item => item.checked);
  317 + const deviceType = this.typeStatus.find(item => item.checked);
  318 + this.loadData(1, {
  319 + deviceState: deviceState.type ? deviceState.type : undefined,
  320 + deviceType: deviceType.type ? deviceType.type : undefined,
  321 + alarmStatus: alarmStatus.type === '0' || alarmStatus.type === '1' ? alarmStatus.type : undefined
  322 + });
  323 + this.show = false;
  324 + },
  325 + inputChanged(e) {
  326 + this.page.num = 1;
  327 + this.deviceName = e;
  328 + this.loadData(1, {
  329 + name: this.deviceName
  330 + });
346 } 331 }
347 - }; 332 + }
  333 +};
348 </script> 334 </script>
349 335
350 <style lang="scss" scoped> 336 <style lang="scss" scoped>
351 - .device-page {  
352 - min-height: 100vh;  
353 - background-color: #f8f9fa;  
354 - } 337 +.device-page {
  338 + min-height: 100vh;
  339 + background-color: #f8f9fa;
  340 +}
355 341
356 - .device-top {  
357 - padding: 10rpx 30rpx;  
358 - background-color: #fff; 342 +.device-top {
  343 + padding: 10rpx 30rpx;
  344 + background-color: #fff;
359 345
360 - .search {  
361 - display: flex;  
362 - justify-content: space-between;  
363 - padding-bottom: 10rpx; 346 + .search {
  347 + display: flex;
  348 + justify-content: space-between;
  349 + padding-bottom: 10rpx;
364 350
365 - .search-left {  
366 - width: 580rpx;  
367 - background-color: #f8f9fa;  
368 - border-radius: 200rpx;  
369 - } 351 + .search-left {
  352 + width: 580rpx;
  353 + background-color: #f8f9fa;
  354 + border-radius: 200rpx;
  355 + }
370 356
371 - .search-right {  
372 - display: flex;  
373 - align-items: center; 357 + .search-right {
  358 + display: flex;
  359 + align-items: center;
374 360
375 - text {  
376 - color: #333;  
377 - font-size: 14px;  
378 - } 361 + text {
  362 + color: #333;
  363 + font-size: 14px;
  364 + }
379 365
380 - image {  
381 - width: 40rpx;  
382 - height: 40rpx;  
383 - } 366 + image {
  367 + width: 40rpx;
  368 + height: 40rpx;
384 } 369 }
385 } 370 }
386 } 371 }
  372 +}
387 373
388 - .device-list {  
389 - display: flex;  
390 - flex-direction: column;  
391 - padding-left: 20rpx; 374 +.device-list {
  375 + display: flex;
  376 + flex-direction: column;
  377 + padding-left: 20rpx;
392 378
393 - .list-item {  
394 - width: 713rpx;  
395 - height: 200rpx;  
396 - background-color: #fff;  
397 - margin-top: 24rpx;  
398 - display: flex;  
399 - border-radius: 10px;  
400 - justify-content: space-between; 379 + .list-item {
  380 + width: 713rpx;
  381 + height: 200rpx;
  382 + background-color: #fff;
  383 + margin-top: 24rpx;
  384 + display: flex;
  385 + border-radius: 10px;
  386 + justify-content: space-between;
401 387
402 - .item {  
403 - margin: 30rpx;  
404 - } 388 + .item {
  389 + margin: 30rpx;
405 } 390 }
406 } 391 }
  392 +}
407 393
408 - .filter {  
409 - padding: 0 30rpx; 394 +.filter {
  395 + padding: 0 30rpx;
410 396
411 - .filter-title {  
412 - text-align: center;  
413 - margin-top: 14px;  
414 - font-size: 16px;  
415 - font-weight: 700;  
416 - } 397 + .filter-title {
  398 + text-align: center;
  399 + margin-top: 14px;
  400 + font-size: 16px;
  401 + font-weight: 700;
  402 + }
417 403
418 - .button-group {  
419 - display: flex;  
420 - margin-top: 40rpx;  
421 - justify-content: space-between; 404 + .button-group {
  405 + display: flex;
  406 + margin-top: 40rpx;
  407 + justify-content: space-between;
422 408
423 - view {  
424 - width: 330rpx;  
425 - } 409 + view {
  410 + width: 330rpx;
426 } 411 }
427 } 412 }
  413 +}
428 </style> 414 </style>
@@ -114,7 +114,6 @@ button { @@ -114,7 +114,6 @@ button {
114 .text-clip { 114 .text-clip {
115 text-overflow: ellipsis; 115 text-overflow: ellipsis;
116 overflow: hidden; 116 overflow: hidden;
117 - text-overflow: ellipsis;  
118 white-space: nowrap; 117 white-space: nowrap;
119 } 118 }
120 //通用按钮提交(border框) 119 //通用按钮提交(border框)
@@ -5,7 +5,9 @@ @@ -5,7 +5,9 @@
5 <view class="notify-column"> 5 <view class="notify-column">
6 <view class="column-list"> 6 <view class="column-list">
7 <view style="margin-left: 36rpx;position: relative;top: 21rpx;"> 7 <view style="margin-left: 36rpx;position: relative;top: 21rpx;">
8 - <text class="notify-detail-text">{{ notifyList.title }}</text> 8 + <view class="text-clip" style="width:500rpx">
  9 + <text class="notify-detail-text ">{{ notifyList.title }}</text>
  10 + </view>
9 </view> 11 </view>
10 <view style="height: 25rpx;"></view> 12 <view style="height: 25rpx;"></view>
11 <u-list height="140rpx"> 13 <u-list height="140rpx">
@@ -16,8 +16,8 @@ @@ -16,8 +16,8 @@
16 <view class="u-flex item"> 16 <view class="u-flex item">
17 <view class="item-avatar"><u-avatar class="avatar" shape="circle" size="40" :src="item.sysNotice.avatar"></u-avatar></view> 17 <view class="item-avatar"><u-avatar class="avatar" shape="circle" size="40" :src="item.sysNotice.avatar"></u-avatar></view>
18 <view class="u-flex item-content"> 18 <view class="u-flex item-content">
19 - <text class="text-top">{{ item.sysNotice.title }}</text>  
20 - <text class="text-bottom">{{ item.sysNotice.createTime }}</text> 19 + <text class="text-top text-clip">{{ item.sysNotice.title }}</text>
  20 + <text class="text-bottom text-clip">{{ item.sysNotice.createTime }}</text>
21 </view> 21 </view>
22 </view> 22 </view>
23 <view class="item-right u-flex" style="justify-content: space-between;"> 23 <view class="item-right u-flex" style="justify-content: space-between;">