Commit b32cbbdd04b77c03fe2cd3ffc8db465fa32bcce5

Authored by 黄 x
1 parent 5e57dc64

更新小程序文件

@@ -57,7 +57,7 @@ @@ -57,7 +57,7 @@
57 // 主页页面的页面路径 57 // 主页页面的页面路径
58 // 关联功能:打开的页面只有一个的时候右上角自动显示返回首页按钮,下面这个数组是排除显示返回首页的页面。 58 // 关联功能:打开的页面只有一个的时候右上角自动显示返回首页按钮,下面这个数组是排除显示返回首页的页面。
59 // 主页使用场景:小程序分享出去的页面,用户点击开是分享页面,很多情况下是没有返回首页按钮的 59 // 主页使用场景:小程序分享出去的页面,用户点击开是分享页面,很多情况下是没有返回首页按钮的
60 - const mainPagePath = ['pages/index/index', 'pages/goods/goods', 'pages/device/device', 'pages/personal/personal', ]; 60 + const mainPagePath = ['pages/index/index', 'pages/goods/goods', 'pages/device/device', 'pages/personal/personal','pages/alert/alert', ];
61 //返回首页的地址 61 //返回首页的地址
62 const homePath = '/pages/index/index'; 62 const homePath = '/pages/index/index';
63 //白色表达值 63 //白色表达值
1 <template> 1 <template>
2 - <view>  
3 - <view :class="[isFixed?'f-fixed':'']">  
4 - <!-- 二次封装tabbar -->  
5 - <u-tabbar  
6 - :value="tabIndex"  
7 - @change="onTabbar"  
8 - :fixed="false"  
9 - :placeholder="false"  
10 - :safeAreaInsetBottom="false"  
11 - :activeColor="activeColor"  
12 - :inactiveColor="inactiveColor"  
13 - :border="border"  
14 - >  
15 - <block v-for="(item,index) in list" :key="index">  
16 - <!-- 自定义icon -->  
17 - <u-tabbar-item :text="item.name" :badge="item.badge" :dot="item.dot" :badgeStyle="item.badgeStyle">  
18 - <view slot="active-icon">  
19 - <view class="custom-icon" :class="['custom-icon-'+item.iconFill]" style="font-size: 20px;" :style="{color:activeColor}"></view>  
20 - </view>  
21 - <view slot="inactive-icon">  
22 - <view class="custom-icon" :class="['custom-icon-'+item.icon]" style="font-size: 20px;" :style="{color:inactiveColor}"></view>  
23 - </view>  
24 - </u-tabbar-item>  
25 - </block>  
26 - </u-tabbar>  
27 - <!-- 苹果安全距离-默认20px -->  
28 - <view :style="{paddingBottom:systemInfo.tabbarPaddingB+'px',background:'#fff'}"></view>  
29 - </view>  
30 - <!-- 防止塌陷高度 -->  
31 - <view v-if="isFixed && isFillHeight" :style="{height:systemInfo.tabbarH+'px'}"></view>  
32 - </view> 2 + <view>
  3 + <view :class="[isFixed ? 'f-fixed' : '']">
  4 + <!-- 二次封装tabbar -->
  5 + <u-tabbar
  6 + :value="tabIndex"
  7 + @change="onTabbar"
  8 + :fixed="false"
  9 + :placeholder="false"
  10 + :safeAreaInsetBottom="false"
  11 + :activeColor="activeColor"
  12 + :inactiveColor="inactiveColor"
  13 + :border="border"
  14 + >
  15 + <block v-for="(item, index) in list" :key="index">
  16 + <!-- 自定义icon -->
  17 + <u-tabbar-item :text="item.name" :badge="item.badge" :dot="item.dot" :badgeStyle="item.badgeStyle">
  18 + <view slot="active-icon">
  19 + <view class="custom-icon" :class="['custom-icon-' + item.iconFill]" style="font-size: 20px;" :style="{ color: activeColor }"></view>
  20 + </view>
  21 + <view slot="inactive-icon">
  22 + <view class="custom-icon" :class="['custom-icon-' + item.icon]" style="font-size: 20px;" :style="{ color: inactiveColor }"></view>
  23 + </view>
  24 + </u-tabbar-item>
  25 + </block>
  26 + </u-tabbar>
  27 + <!-- 苹果安全距离-默认20px -->
  28 + <view :style="{ paddingBottom: systemInfo.tabbarPaddingB + 'px', background: '#fff' }"></view>
  29 + </view>
  30 + <!-- 防止塌陷高度 -->
  31 + <view v-if="isFixed && isFillHeight" :style="{ height: systemInfo.tabbarH + 'px' }"></view>
  32 + </view>
33 </template> 33 </template>
34 34
35 <script> 35 <script>
36 import base from '@/config/baseUrl.js'; 36 import base from '@/config/baseUrl.js';
37 37
38 export default { 38 export default {
39 - name: 'f-tabbar',  
40 - props:{  
41 - // 是否固定在底部  
42 - isFixed:{  
43 - type:Boolean,  
44 - default:true,  
45 - },  
46 - // 是否设置防止塌陷高度  
47 - isFillHeight:{  
48 - type:Boolean,  
49 - default:true,  
50 - },  
51 - // 选中的颜色  
52 - activeColor:{  
53 - type:String,  
54 - default:'#fe461d',  
55 - },  
56 - // 未选中颜色  
57 - inactiveColor:{  
58 - type:String,  
59 - default:'#606266',  
60 - },  
61 - // 是否显示边框色  
62 - border:{  
63 - type:Boolean,  
64 - default: function() {  
65 - return true;  
66 - }  
67 - },  
68 - // 右上角的角标提示信息  
69 - badge: {  
70 - type: [String, Number, null],  
71 - default: uni.$u.props.tabbarItem.badge  
72 - },  
73 - // 是否显示圆点,将会覆盖badge参数  
74 - dot: {  
75 - type: Boolean,  
76 - default: uni.$u.props.tabbarItem.dot  
77 - },  
78 - // 控制徽标的位置,对象或者字符串形式,可以设置top和right属性  
79 - badgeStyle: {  
80 - type: [Object, String],  
81 - default: uni.$u.props.tabbarItem.badgeStyle  
82 - }  
83 - },  
84 - data(){  
85 - return {  
86 - systemInfo:base.systemInfo,  
87 - tabIndex:0,  
88 - path:'', //当前路径  
89 - list:[{  
90 - name: '首页',  
91 - url: 'pages/index/index',  
92 - icon: 'home',  
93 - iconFill: 'home-filling'  
94 - },  
95 - {  
96 - name: '设备',  
97 - url: 'pages/device/device',  
98 - icon: 'shangpin',  
99 - iconFill: 'shangpin-filling',  
100 - },  
101 - {  
102 - name: '告警',  
103 - url: 'pages/alert/alert',  
104 - icon: 'home',  
105 - iconFill: 'my-filling',  
106 - badge: 16  
107 - },  
108 - {  
109 - name: '我的',  
110 - url: 'pages/personal/personal',  
111 - icon: 'my',  
112 - iconFill: 'my-filling',  
113 - }, 39 + name: 'f-tabbar',
  40 + props: {
  41 + // 是否固定在底部
  42 + isFixed: {
  43 + type: Boolean,
  44 + default: true
  45 + },
  46 + // 是否设置防止塌陷高度
  47 + isFillHeight: {
  48 + type: Boolean,
  49 + default: true
  50 + },
  51 + // 选中的颜色
  52 + activeColor: {
  53 + type: String,
  54 + default: '#377dff'
  55 + },
  56 + // 未选中颜色
  57 + inactiveColor: {
  58 + type: String,
  59 + default: '#606266'
  60 + },
  61 + // 是否显示边框色
  62 + border: {
  63 + type: Boolean,
  64 + default: function() {
  65 + return true;
  66 + }
  67 + },
  68 + // 右上角的角标提示信息
  69 + badge: {
  70 + type: [String, Number, null],
  71 + default: uni.$u.props.tabbarItem.badge
  72 + },
  73 + // 是否显示圆点,将会覆盖badge参数
  74 + dot: {
  75 + type: Boolean,
  76 + default: uni.$u.props.tabbarItem.dot
  77 + },
  78 + // 控制徽标的位置,对象或者字符串形式,可以设置top和right属性
  79 + badgeStyle: {
  80 + type: [Object, String],
  81 + default: uni.$u.props.tabbarItem.badgeStyle
  82 + }
  83 + },
  84 + data() {
  85 + return {
  86 + systemInfo: base.systemInfo,
  87 + tabIndex: 0,
  88 + path: '', //当前路径
  89 + list: [
  90 + {
  91 + name: '首页',
  92 + url: 'pages/index/index',
  93 + icon: 'home',
  94 + iconFill: 'home-filling'
  95 + },
  96 + {
  97 + name: '设备',
  98 + url: 'pages/device/device',
  99 + icon: 'shangpin',
  100 + iconFill: 'shangpin-filling'
  101 + },
  102 + {
  103 + name: '告警',
  104 + url: 'pages/alert/alert',
  105 + icon: 'shangpin',
  106 + iconFill: 'shangpin-filling',
  107 + badge: 16
  108 + },
  109 + {
  110 + name: '我的',
  111 + url: 'pages/personal/personal',
  112 + icon: 'my',
  113 + iconFill: 'my-filling'
  114 + }
114 ] 115 ]
115 - }  
116 - },  
117 - created() {  
118 - //获取页面路径  
119 - let currentPages = getCurrentPages();  
120 - let page = currentPages[currentPages.length - 1];  
121 - this.path = page.route;  
122 - //获取页面路径  
123 - this.list.forEach((item,index)=>{  
124 - if(this.path == item.url){  
125 - this.tabIndex = index  
126 - }  
127 - })  
128 - },  
129 - methods:{  
130 - onTabbar(index){  
131 - if (this.path !== this.list[index].url) {  
132 - uni.switchTab({  
133 - url: '/' + this.list[index].url  
134 - });  
135 - }  
136 - }  
137 - }  
138 -} 116 + };
  117 + },
  118 + created() {
  119 + //获取页面路径
  120 + let currentPages = getCurrentPages();
  121 + let page = currentPages[currentPages.length - 1];
  122 + this.path = page.route;
  123 + //获取页面路径
  124 + this.list.forEach((item, index) => {
  125 + if (this.path == item.url) {
  126 + this.tabIndex = index;
  127 + }
  128 + });
  129 + },
  130 + methods: {
  131 + onTabbar(index) {
  132 + if (this.path !== this.list[index].url) {
  133 + uni.switchTab({
  134 + url: '/' + this.list[index].url
  135 + });
  136 + }
  137 + }
  138 + }
  139 +};
139 </script> 140 </script>
140 141
141 <style lang="scss" scoped> 142 <style lang="scss" scoped>
142 -.f-fixed{  
143 - position: fixed;  
144 - bottom: 0;  
145 - left: 0;  
146 - right: 0;  
147 - z-index: 1000; 143 +.f-fixed {
  144 + position: fixed;
  145 + bottom: 0;
  146 + left: 0;
  147 + right: 0;
  148 + z-index: 1000;
148 } 149 }
149 </style> 150 </style>
  1 +let dataList = [{
  2 + checked: false,
  3 + children: [{
  4 + children: [{
  5 + children: [{
  6 + children: [],
  7 + id: "128334455556667681",
  8 + name: "学生2104",
  9 + user: true
  10 + },
  11 + {
  12 + children: [],
  13 + id: 9945523453454556625,
  14 + name: "小陆214112",
  15 + user: true
  16 + }, {
  17 + children: [],
  18 + id: "1283345465523232681",
  19 + name: "学生224113",
  20 + user: true
  21 + },
  22 + {
  23 + children: [],
  24 + id: 996453452367687256625,
  25 + name: "小陆22410312",
  26 + user: true
  27 + },
  28 + {
  29 + children: [],
  30 + id: "17574556678881",
  31 + name: "学生234222",
  32 + user: true
  33 + },
  34 + {
  35 + children: [],
  36 + id: 954512456455667625,
  37 + name: "小陆241212",
  38 + user: true
  39 + },
  40 + {
  41 + children: [],
  42 + id: "125522465657755681",
  43 + name: "学生4511",
  44 + user: true
  45 + },
  46 + {
  47 + children: [],
  48 + id: 9960145622788454655656625,
  49 + name: "小陆4552",
  50 + user: true
  51 + },
  52 + {
  53 + children: [],
  54 + id: "128334533554655681",
  55 + name: "学生2",
  56 + user: true
  57 + },
  58 + {
  59 + children: [],
  60 + id: 9455234556456625,
  61 + name: "小陆212",
  62 + user: true
  63 + }, {
  64 + children: [],
  65 + id: "128345546534545681",
  66 + name: "学生223",
  67 + user: true
  68 + },
  69 + {
  70 + children: [],
  71 + id: 99120045452121256625,
  72 + name: "小陆22312",
  73 + user: true
  74 + },
  75 + {
  76 + children: [],
  77 + id: "1754110466565681",
  78 + name: "学生232",
  79 + user: true
  80 + },
  81 + {
  82 + children: [],
  83 + id: 954545232332356625,
  84 + name: "小陆2212",
  85 + user: true
  86 + },
  87 + {
  88 + children: [],
  89 + id: "12324655555681",
  90 + name: "学生45",
  91 + user: true
  92 + },
  93 + {
  94 + children: [],
  95 + id: 9960556423234556625,
  96 + name: "小陆4552",
  97 + user: true
  98 + },
  99 + {
  100 + children: [],
  101 + id: "1283789465676755681",
  102 + name: "学生2",
  103 + user: true
  104 + },
  105 + {
  106 + children: [],
  107 + id: 8785566344545525,
  108 + name: "小陆212",
  109 + user: true
  110 + }, {
  111 + children: [],
  112 + id: "128878623355681",
  113 + name: "学生223344",
  114 + user: true
  115 + },
  116 + {
  117 + children: [],
  118 + id: 995778899000625,
  119 + name: "小768712",
  120 + user: true
  121 + },
  122 + {
  123 + children: [],
  124 + id: "14552501223681",
  125 + name: "学生232",
  126 + user: true
  127 + },
  128 + {
  129 + children: [{
  130 + children: [{
  131 + children: [],
  132 + id: "12833445556818888",
  133 + name: "学生21048888",
  134 + checked: false,
  135 + pid: "",
  136 + user: true
  137 + },
  138 + {
  139 + children: [],
  140 + id: '994552345566454545258888',
  141 + name: "小陆2141128888",
  142 + checked: false,
  143 + pid: "",
  144 + user: true
  145 + }, {
  146 + children: [],
  147 + id: "1283345456556556818888",
  148 + name: "学生8888sa",
  149 + checked: false,
  150 + pid: "",
  151 + user: true
  152 + },
  153 + {
  154 + children: [],
  155 + id: '99645345232566258888',
  156 + name: "小陆224103128888",
  157 + checked: false,
  158 + pid: "",
  159 + user: true
  160 + },
  161 + {
  162 + children: [],
  163 + id: "17574556818888",
  164 + name: "学生2342228888",
  165 + checked: false,
  166 + pid: "",
  167 + user: true
  168 + },
  169 + {
  170 + children: [],
  171 + id: '95451245566566258888',
  172 + name: "小陆2412128888",
  173 + checked: false,
  174 + pid: "",
  175 + user: true
  176 + },
  177 + {
  178 + children: [],
  179 + id: "12552246556818888",
  180 + name: "学生45118888",
  181 + checked: false,
  182 + pid: "",
  183 + user: true
  184 + },
  185 + {
  186 + children: [],
  187 + id: '996014562278845566258888',
  188 + name: "小陆45528888",
  189 + checked: false,
  190 + pid: "",
  191 + user: true
  192 + },
  193 + {
  194 + children: [],
  195 + id: "128334787878546556818888",
  196 + name: "学生28888",
  197 + checked: false,
  198 + pid: "",
  199 + user: true
  200 + },
  201 + {
  202 + children: [],
  203 + id: '9455234545212124556625',
  204 + name: "小陆212",
  205 + checked: false,
  206 + pid: "",
  207 + user: true
  208 + }, {
  209 + children: [],
  210 + id: "128345546556818888",
  211 + name: "学生2238888",
  212 + checked: false,
  213 + pid: "",
  214 + user: true
  215 + },
  216 + {
  217 + children: [],
  218 + id: '99120012564454556258888',
  219 + name: "小陆223128888",
  220 + checked: false,
  221 + pid: "",
  222 + user: true
  223 + },
  224 + {
  225 + children: [],
  226 + id: "175411056818888",
  227 + name: "学生232",
  228 + checked: false,
  229 + pid: "",
  230 + user: true
  231 + },
  232 + {
  233 + children: [],
  234 + id: '95454556236258888',
  235 + name: "小陆22128888",
  236 + checked: false,
  237 + pid: "",
  238 + user: true
  239 + },
  240 + {
  241 + children: [],
  242 + id: "123246556818888",
  243 + name: "学生458888",
  244 + checked: false,
  245 + pid: "",
  246 + user: true
  247 + },
  248 + {
  249 + children: [],
  250 + id: '996055645566258888',
  251 + name: "小陆45528888",
  252 + checked: false,
  253 + pid: "",
  254 + user: true
  255 + },
  256 + {
  257 + children: [],
  258 + id: "1283789556818888",
  259 + name: "学生88882",
  260 + checked: false,
  261 + pid: "",
  262 + user: true
  263 + },
  264 + {
  265 + children: [],
  266 + id: '8785566258888',
  267 + name: "小陆2888812",
  268 + checked: false,
  269 + pid: "",
  270 + user: true
  271 + }, {
  272 + children: [],
  273 + id: "1283347886556818888",
  274 + name: "学生8888",
  275 + checked: false,
  276 + pid: "",
  277 + user: true
  278 + },
  279 + {
  280 + children: [],
  281 + id: 99577232566258888,
  282 + name: "小陆8888",
  283 + checked: false,
  284 + pid: "",
  285 + user: true
  286 + },
  287 + {
  288 + children: [],
  289 + id: "17523256818888",
  290 + name: "学生8888",
  291 + checked: false,
  292 + pid: "",
  293 + user: true
  294 + },
  295 + {
  296 + children: [],
  297 + id: "10qewretrtryty",
  298 + name: "学生b挥",
  299 + pid: "",
  300 + checked: false,
  301 + user: true
  302 + },
  303 +
  304 + {
  305 + children: [],
  306 + id: "12817783759074555555555655681",
  307 + name: "学生",
  308 + checked: false,
  309 + pid: "",
  310 + user: true
  311 + },
  312 + {
  313 + children: [],
  314 + id: 35465768923232323122222,
  315 + name: "小陆",
  316 + checked: false,
  317 + pid: "",
  318 + user: true
  319 + },
  320 + {
  321 + children: [{
  322 + children: [],
  323 + id: 26232324324353341,
  324 + checked: false,
  325 + name: "学生a",
  326 + pid: "",
  327 + user: true
  328 + }, ],
  329 + id: 1532434656634,
  330 + checked: false,
  331 + name: "助班",
  332 + pid: "14",
  333 + user: false
  334 + }
  335 + ],
  336 + id: 74465768,
  337 + checked: false,
  338 + name: "班长",
  339 + pid: "4",
  340 + user: false
  341 + }],
  342 + id: 4232435446576,
  343 + checked: false,
  344 + name: "教职工",
  345 + pid: "3",
  346 + user: false
  347 + }
  348 + ],
  349 + id: 324255465768799999,
  350 + name: "教师团队",
  351 + checked: false,
  352 + pid: "2",
  353 + user: false
  354 + }],
  355 + id: 25666666652222000000,
  356 + name: "系主任",
  357 + checked: false,
  358 + pid: "1",
  359 + user: false
  360 + },
  361 + {
  362 + children: [{
  363 + children: [{
  364 + children: [],
  365 + id: 1545454566,
  366 + checked: false,
  367 + name: "学生",
  368 + pid: "14",
  369 + user: true
  370 + }],
  371 + id: 14511112225,
  372 + checked: false,
  373 + name: "班长",
  374 + pid: "13",
  375 + user: false
  376 + }],
  377 + id: 1353335555,
  378 + checked: false,
  379 + level: 2,
  380 + name: "系副主任",
  381 + pid: "1",
  382 + user: false
  383 + }
  384 + ],
  385 + id: 1154545454554544,
  386 + memberCount: 66,
  387 + name: "副校长",
  388 + checked: false,
  389 + pid: "-1",
  390 + user: false
  391 + },
  392 + {
  393 + id: 66669224242242298,
  394 + name: "校长",
  395 + pid: "-1",
  396 + checked: false,
  397 + user: false,
  398 + children: [{
  399 + children: [],
  400 + id: "12833442455568133333",
  401 + name: "小明2104",
  402 + checked: false,
  403 + pid: "",
  404 + user: true
  405 + },
  406 + {
  407 + children: [],
  408 + id: 99455234554546242566255443333,
  409 + name: "小明214112",
  410 + checked: false,
  411 + pid: "",
  412 + user: true
  413 + }, {
  414 + children: [],
  415 + id: "12833454677755681333",
  416 + name: "小明224113",
  417 + checked: false,
  418 + pid: "",
  419 + user: true
  420 + },
  421 + {
  422 + children: [],
  423 + id: 996453452368656455552566253333,
  424 + name: "小明22410312",
  425 + checked: false,
  426 + pid: "",
  427 + user: true
  428 + },
  429 + {
  430 + children: [],
  431 + id: "175745568135344545",
  432 + name: "小明234222",
  433 + checked: false,
  434 + pid: "",
  435 + user: true
  436 + },
  437 + {
  438 + children: [],
  439 + id: 954512454245545420022145625,
  440 + name: "小陆241212",
  441 + checked: false,
  442 + pid: "",
  443 + user: true
  444 + },
  445 + {
  446 + children: [],
  447 + id: "125522455554655681333",
  448 + name: "小明4511",
  449 + checked: false,
  450 + pid: "",
  451 + user: true
  452 + },
  453 + {
  454 + children: [],
  455 + id: 9960145655522788455662533333,
  456 + name: "小明4552",
  457 + checked: false,
  458 + pid: "",
  459 + user: true
  460 + },
  461 + {
  462 + children: [],
  463 + id: "1283345234445534655681333",
  464 + name: "小明2",
  465 + checked: false,
  466 + pid: "",
  467 + user: true
  468 + },
  469 + {
  470 + children: [],
  471 + id: 9455234556886864555866253333,
  472 + name: "小明212",
  473 + checked: false,
  474 + pid: "",
  475 + user: true
  476 + }, {
  477 + children: [],
  478 + id: "12834554655555681333",
  479 + name: "小明223",
  480 + checked: false,
  481 + pid: "",
  482 + user: true
  483 + },
  484 + {
  485 + children: [],
  486 + id: 991200125465454786866625,
  487 + name: "小陆22312",
  488 + checked: false,
  489 + pid: "",
  490 + user: true
  491 + },
  492 + {
  493 + children: [],
  494 + id: "1754110568455513333",
  495 + name: "小明232",
  496 + checked: false,
  497 + pid: "",
  498 + user: true
  499 + },
  500 + {
  501 + children: [],
  502 + id: 95455554556542323625333,
  503 + name: "小明2212",
  504 + checked: false,
  505 + pid: "",
  506 + user: true
  507 + },
  508 + {
  509 + children: [],
  510 + id: "1255553246556813333",
  511 + name: "小明45",
  512 + checked: false,
  513 + pid: "",
  514 + user: true
  515 + },
  516 + {
  517 + children: [],
  518 + id: 996045555564556625333,
  519 + name: "小明4552",
  520 + checked: false,
  521 + pid: "",
  522 + user: true
  523 + },
  524 + {
  525 + children: [],
  526 + id: "1283789556813646464663333",
  527 + name: "小明2",
  528 + checked: false,
  529 + pid: "",
  530 + user: true
  531 + },
  532 + {
  533 + children: [],
  534 + id: 87855646455555556253333,
  535 + name: "小明212",
  536 + checked: false,
  537 + pid: "",
  538 + user: true
  539 + }, {
  540 + children: [],
  541 + id: "1283347886788556813333",
  542 + name: "小明223",
  543 + checked: false,
  544 + pid: "",
  545 + user: true
  546 + },
  547 + {
  548 + children: [],
  549 + id: 99577232566745625333,
  550 + name: "小明22",
  551 + checked: false,
  552 + pid: "",
  553 + user: true
  554 + },
  555 + {
  556 + children: [],
  557 + id: "17523256233381",
  558 + name: "小明232",
  559 + checked: false,
  560 + pid: "",
  561 + user: true
  562 + },
  563 + {
  564 + children: [{
  565 + children: [],
  566 + id: "1052332333666",
  567 + name: "学生b挥",
  568 + pid: "",
  569 + checked: false,
  570 + user: true
  571 + },
  572 +
  573 + {
  574 + children: [],
  575 + id: "128177866566666375907655681",
  576 + name: "学生",
  577 + checked: false,
  578 + pid: "",
  579 + user: true
  580 + },
  581 + {
  582 + children: [],
  583 + id: 99601456565664225,
  584 + name: "小陆",
  585 + checked: false,
  586 + pid: "",
  587 + user: true
  588 + },
  589 + {
  590 + children: [{
  591 + children: [],
  592 + id: 264233333355,
  593 + checked: false,
  594 + name: "学生a",
  595 + pid: "",
  596 + user: true
  597 + }, ],
  598 + id: 12434546789095,
  599 + checked: false,
  600 + name: "助班",
  601 + pid: "14",
  602 + user: false
  603 + }
  604 + ],
  605 + id: 7577777888888222666,
  606 + checked: false,
  607 + name: "班长",
  608 + pid: "4",
  609 + user: false
  610 + }
  611 +
  612 + ]
  613 + },
  614 + {
  615 + id: 6663233355698,
  616 + name: "校",
  617 + pid: "-1",
  618 + checked: false,
  619 + user: false,
  620 + children: [{
  621 + children: [],
  622 + id: "1283349022127655681",
  623 + name: "学生256",
  624 + checked: false,
  625 + pid: "",
  626 + user: true
  627 + },
  628 + {
  629 + children: [],
  630 + id: 9111556625,
  631 + name: "小陆21241",
  632 + checked: false,
  633 + pid: "",
  634 + user: true
  635 + }, {
  636 + children: [],
  637 + id: "12877444655681",
  638 + name: "学生254523",
  639 + checked: false,
  640 + pid: "",
  641 + user: true
  642 + },
  643 + {
  644 + children: [],
  645 + id: 99604553256625,
  646 + name: "小陆2411312",
  647 + checked: false,
  648 + pid: "",
  649 + user: true
  650 + },
  651 + {
  652 + children: [],
  653 + id: "1757455681",
  654 + name: "学生54112",
  655 + checked: false,
  656 + pid: "",
  657 + user: true
  658 + },
  659 + {
  660 + children: [],
  661 + id: 9455556625,
  662 + name: "小陆21102",
  663 + checked: false,
  664 + pid: "",
  665 + user: true
  666 + },
  667 + {
  668 + children: [],
  669 + id: "1283454655681",
  670 + name: "学生1145",
  671 + checked: false,
  672 + pid: "",
  673 + user: true
  674 + },
  675 + {
  676 + children: [],
  677 + id: 996014478784556625,
  678 + name: "小陆451152",
  679 + checked: false,
  680 + pid: "",
  681 + user: true
  682 + },
  683 + {
  684 + children: [],
  685 + id: "1283344555681",
  686 + name: "学生2104",
  687 + checked: false,
  688 + pid: "",
  689 + user: true
  690 + },
  691 + {
  692 + children: [],
  693 + id: 994552386565664556625,
  694 + name: "小陆214112",
  695 + checked: false,
  696 + pid: "",
  697 + user: true
  698 + }, {
  699 + children: [],
  700 + id: "12833454655556665681",
  701 + name: "学生224113",
  702 + checked: false,
  703 + pid: "",
  704 + user: true
  705 + },
  706 + {
  707 + children: [],
  708 + id: 9964534523256625,
  709 + name: "小陆22410312",
  710 + checked: false,
  711 + pid: "",
  712 + user: true
  713 + },
  714 + {
  715 + children: [],
  716 + id: "1757455681",
  717 + name: "学生234222",
  718 + checked: false,
  719 + pid: "",
  720 + user: true
  721 + },
  722 + {
  723 + children: [],
  724 + id: 9545121254787245625,
  725 + name: "小陆241212",
  726 + checked: false,
  727 + pid: "",
  728 + user: true
  729 + },
  730 + {
  731 + children: [],
  732 + id: "1255224655681",
  733 + name: "学生4511",
  734 + checked: false,
  735 + pid: "",
  736 + user: true
  737 + },
  738 + {
  739 + children: [],
  740 + id: 99601456227884556625,
  741 + name: "小陆4552",
  742 + checked: false,
  743 + pid: "",
  744 + user: true
  745 + },
  746 + {
  747 + children: [],
  748 + id: "128334546898955681",
  749 + name: "学生2",
  750 + checked: false,
  751 + pid: "",
  752 + user: true
  753 + },
  754 + {
  755 + children: [],
  756 + id: 9455234554354657676625,
  757 + name: "小陆212",
  758 + checked: false,
  759 + pid: "",
  760 + user: true
  761 + }, {
  762 + children: [],
  763 + id: "12834554655681",
  764 + name: "学生223",
  765 + checked: false,
  766 + pid: "",
  767 + user: true
  768 + },
  769 + {
  770 + children: [],
  771 + id: 9912001244444566252464,
  772 + name: "小陆22312",
  773 + checked: false,
  774 + pid: "",
  775 + user: true
  776 + },
  777 + {
  778 + children: [],
  779 + id: "17541105681",
  780 + name: "学生232",
  781 + checked: false,
  782 + pid: "",
  783 + user: true
  784 + },
  785 + {
  786 + children: [],
  787 + id: 954543234456556625,
  788 + name: "小陆2212",
  789 + checked: false,
  790 + pid: "",
  791 + user: true
  792 + },
  793 + {
  794 + children: [],
  795 + id: "12324655681",
  796 + name: "学生45",
  797 + checked: false,
  798 + pid: "",
  799 + user: true
  800 + },
  801 + {
  802 + children: [],
  803 + id: 99605564556625,
  804 + name: "小陆4552",
  805 + checked: false,
  806 + pid: "",
  807 + user: true
  808 + },
  809 + {
  810 + children: [],
  811 + id: "128378955681",
  812 + name: "学生2",
  813 + checked: false,
  814 + pid: "",
  815 + user: true
  816 + },
  817 + {
  818 + children: [],
  819 + id: 878556625,
  820 + name: "小陆212",
  821 + checked: false,
  822 + pid: "",
  823 + user: true
  824 + }, {
  825 + children: [],
  826 + id: "128334788655681",
  827 + name: "学生223",
  828 + checked: false,
  829 + pid: "",
  830 + user: true
  831 + },
  832 + {
  833 + children: [],
  834 + id: 9957723256625,
  835 + name: "小陆22312",
  836 + checked: false,
  837 + pid: "",
  838 + user: true
  839 + },
  840 + {
  841 + children: [],
  842 + id: "1752325681",
  843 + name: "学生232",
  844 + checked: false,
  845 + pid: "",
  846 + user: true
  847 + },
  848 + {
  849 + children: [],
  850 + id: 9547989556625,
  851 + name: "小陆2212",
  852 + checked: false,
  853 + pid: "",
  854 + user: true
  855 + },
  856 + {
  857 + children: [],
  858 + id: "128466755681",
  859 + name: "学生45",
  860 + checked: false,
  861 + pid: "",
  862 + user: true
  863 + },
  864 + {
  865 + children: [],
  866 + id: 9960134534556625,
  867 + name: "小陆4552",
  868 + checked: false,
  869 + pid: "",
  870 + user: true
  871 + },
  872 + {
  873 + children: [{
  874 + children: [],
  875 + id: "989910",
  876 + name: "学生b4挥",
  877 + pid: "",
  878 + checked: false,
  879 + user: true
  880 + },
  881 +
  882 + {
  883 + children: [],
  884 + id: "12818798999778375907655681",
  885 + name: "学343生",
  886 + checked: false,
  887 + pid: "",
  888 + user: true
  889 + },
  890 + {
  891 + children: [],
  892 + id: 978888965,
  893 + name: "小34陆",
  894 + checked: false,
  895 + pid: "",
  896 + user: true
  897 + },
  898 + {
  899 + children: [{
  900 + children: [],
  901 + id: 24567786,
  902 + checked: false,
  903 + name: "学344生a",
  904 + pid: "",
  905 + user: true
  906 + }, ],
  907 + id: 1546567820000,
  908 + checked: false,
  909 + name: "助34班",
  910 + pid: "14",
  911 + user: false
  912 + }
  913 + ],
  914 + id: 342222225767566566347,
  915 + checked: false,
  916 + name: "班434长",
  917 + pid: "4",
  918 + user: false
  919 + },
  920 + {
  921 + children: [{
  922 + children: [],
  923 + id: 2456867457786,
  924 + checked: false,
  925 + name: "学生a",
  926 + pid: "",
  927 + user: true
  928 + }],
  929 + id: 158990,
  930 + checked: false,
  931 + name: "助班34",
  932 + pid: "14",
  933 + user: false
  934 + },
  935 + {
  936 + children: [{
  937 + children: [],
  938 + id: 2456775656686,
  939 + checked: false,
  940 + name: "学34生a",
  941 + pid: "",
  942 + user: true
  943 + }],
  944 + id: 157677,
  945 + checked: false,
  946 + name: "助44班",
  947 + pid: "14",
  948 + user: false
  949 + },
  950 + {
  951 + children: [{
  952 + children: [],
  953 + id: 244523567786,
  954 + checked: false,
  955 + name: "学生344a",
  956 + pid: "",
  957 + user: true
  958 + }],
  959 + id: 1523235465,
  960 + checked: false,
  961 + name: "助班34",
  962 + pid: "14",
  963 + user: false
  964 + },
  965 + {
  966 + children: [{
  967 + children: [],
  968 + id: 2445556567786,
  969 + checked: false,
  970 + name: "学生a233",
  971 + pid: "",
  972 + user: true
  973 + },
  974 + {
  975 + children: [],
  976 + id: "128334907655681",
  977 + name: "学生2",
  978 + checked: false,
  979 + pid: "",
  980 + user: true
  981 + },
  982 + {
  983 + children: [],
  984 + id: 996014234556625,
  985 + name: "小陆212",
  986 + checked: false,
  987 + pid: "",
  988 + user: true
  989 + }, {
  990 + children: [],
  991 + id: "1283349073444655681",
  992 + name: "学生223",
  993 + checked: false,
  994 + pid: "",
  995 + user: true
  996 + },
  997 + {
  998 + children: [],
  999 + id: 996014234523256625,
  1000 + name: "小陆22312",
  1001 + checked: false,
  1002 + pid: "",
  1003 + user: true
  1004 + },
  1005 + {
  1006 + children: [],
  1007 + id: "17578235681",
  1008 + name: "学生232",
  1009 + checked: false,
  1010 + pid: "",
  1011 + user: true
  1012 + },
  1013 + {
  1014 + children: [],
  1015 + id: 95451234556625,
  1016 + name: "小陆2212",
  1017 + checked: false,
  1018 + pid: "",
  1019 + user: true
  1020 + },
  1021 + {
  1022 + children: [],
  1023 + id: "128332224655681",
  1024 + name: "学生45",
  1025 + checked: false,
  1026 + pid: "",
  1027 + user: true
  1028 + },
  1029 + {
  1030 + children: [],
  1031 + id: 9960142455534556625,
  1032 + name: "小陆4552",
  1033 + checked: false,
  1034 + pid: "",
  1035 + user: true
  1036 + },
  1037 + ],
  1038 + id: 154555,
  1039 + checked: false,
  1040 + name: "助班344",
  1041 + pid: "14",
  1042 + user: false
  1043 + }
  1044 + ]
  1045 + },
  1046 + {
  1047 + id: 66422666998,
  1048 + name: "校长3",
  1049 + pid: "-1",
  1050 + checked: false,
  1051 + user: false,
  1052 + children: [{
  1053 + id: 88834365768789009444,
  1054 + name: "小陆",
  1055 + checked: false,
  1056 + pid: "-1",
  1057 + user: true
  1058 + }]
  1059 + },
  1060 + {
  1061 + id: 664226434366666666998,
  1062 + name: "校长43",
  1063 + pid: "-1",
  1064 + checked: false,
  1065 + user: false,
  1066 + children: [{
  1067 + id: 888232787878334,
  1068 + name: "小陆",
  1069 + checked: false,
  1070 + pid: "-1",
  1071 + user: true
  1072 + }]
  1073 + },
  1074 + {
  1075 + id: 664226434378766998,
  1076 + name: "校长43",
  1077 + pid: "-1",
  1078 + checked: false,
  1079 + user: false,
  1080 + children: [{
  1081 + id: 88887879845555980,
  1082 + name: "小陆",
  1083 + checked: false,
  1084 + pid: "-1",
  1085 + user: true
  1086 + }]
  1087 + },
  1088 + {
  1089 + id: 664214366998,
  1090 + name: "校长443",
  1091 + pid: "-1",
  1092 + checked: false,
  1093 + user: false,
  1094 + children: [{
  1095 + id: 885655454545454545678,
  1096 + name: "小陆",
  1097 + checked: false,
  1098 + pid: "-1",
  1099 + user: true
  1100 + }]
  1101 + },
  1102 + {
  1103 + id: 66421777884366998,
  1104 + name: "校长44443",
  1105 + pid: "-1",
  1106 + checked: false,
  1107 + user: false,
  1108 + children: [{
  1109 + id: 88565444444346556678,
  1110 + name: "小陆",
  1111 + checked: false,
  1112 + pid: "-1",
  1113 + user: true
  1114 + }]
  1115 + },
  1116 + {
  1117 + id: 66421777884366998,
  1118 + name: "校长44443",
  1119 + pid: "-1",
  1120 + checked: false,
  1121 + user: false,
  1122 + children: [{
  1123 + id: 88565444444346556678,
  1124 + name: "小陆",
  1125 + checked: false,
  1126 + pid: "-1",
  1127 + user: true
  1128 + }]
  1129 + },
  1130 + {
  1131 + id: 66421777884366998,
  1132 + name: "校长44443",
  1133 + pid: "-1",
  1134 + checked: false,
  1135 + user: false,
  1136 + children: [{
  1137 + id: 88565444444346556678,
  1138 + name: "小陆",
  1139 + checked: false,
  1140 + pid: "-1",
  1141 + user: true
  1142 + }]
  1143 + },
  1144 + {
  1145 + id: 66421777884366998,
  1146 + name: "校长44443",
  1147 + pid: "-1",
  1148 + checked: false,
  1149 + user: false,
  1150 + children: [{
  1151 + id: 88565444444346556678,
  1152 + name: "小陆",
  1153 + checked: false,
  1154 + pid: "-1",
  1155 + user: true
  1156 + }]
  1157 + },
  1158 + {
  1159 + id: 66421777884366998,
  1160 + name: "校长44443",
  1161 + pid: "-1",
  1162 + checked: false,
  1163 + user: false,
  1164 + children: [{
  1165 + id: 88565444444346556678,
  1166 + name: "小陆",
  1167 + checked: false,
  1168 + pid: "-1",
  1169 + user: true
  1170 + }]
  1171 + },
  1172 + {
  1173 + id: 66421777884366998,
  1174 + name: "校长44443",
  1175 + pid: "-1",
  1176 + checked: false,
  1177 + user: false,
  1178 + children: [{
  1179 + id: 88565444444346556678,
  1180 + name: "小陆",
  1181 + checked: false,
  1182 + pid: "-1",
  1183 + user: true
  1184 + }]
  1185 + },
  1186 + {
  1187 + id: 66421777884366998,
  1188 + name: "校长44443",
  1189 + pid: "-1",
  1190 + checked: false,
  1191 + user: false,
  1192 + children: [{
  1193 + id: 88565444444346556678,
  1194 + name: "小陆",
  1195 + checked: false,
  1196 + pid: "-1",
  1197 + user: true
  1198 + }]
  1199 + },
  1200 +
  1201 +]
  1202 +
  1203 +export default dataList
@@ -57,7 +57,7 @@ @@ -57,7 +57,7 @@
57 }, 57 },
58 "quickapp" : {}, 58 "quickapp" : {},
59 "mp-weixin" : { 59 "mp-weixin" : {
60 - "appid" : "wx0ad61d7bf6808e02", 60 + "appid" : "wx594747d3848d7a10",
61 "setting" : { 61 "setting" : {
62 "urlCheck" : false, 62 "urlCheck" : false,
63 "minified" : true, 63 "minified" : true,
  1 +{
  2 + "id": "yyh-tab",
  3 + "name": "tab切换,自定义位置、颜色、数据",
  4 + "version": "1.0.1",
  5 + "description": "tab切换,自定义位置、颜色、数据(小程序、app、h5)",
  6 + "keywords": [
  7 + "tab切换",
  8 + "自定义位置",
  9 + "颜色",
  10 + "数据"
  11 + ]
  12 +}
@@ -13,25 +13,13 @@ @@ -13,25 +13,13 @@
13 "style": { 13 "style": {
14 "navigationBarTitleText": "设备", 14 "navigationBarTitleText": "设备",
15 "backgroundColorTop": "gray", 15 "backgroundColorTop": "gray",
16 - "backgroundColorBottom": "gray",  
17 - "app-plus": {  
18 - "scrollIndicator": "none",  
19 - "titleNView": {  
20 - "titleText": "", //不要设置标题  
21 - "buttons": [{  
22 - "text": "搜索",  
23 - "fontSize": "16",  
24 - "float": "right",  
25 - "color": "blue"  
26 - }],  
27 - "searchInput": {  
28 - "align": "left",  
29 - "placeholder": "输入设备SN或名称搜索",  
30 - "borderRadius": "50upx",  
31 - "backgroundColor": "#fff"  
32 - }  
33 - }  
34 - } 16 + "backgroundColorBottom": "gray"
  17 + }
  18 + },
  19 + {
  20 + "path": "pages/device/deviceDetail",
  21 + "style": {
  22 + "navigationBarTitleText": "设备详情"
35 } 23 }
36 }, 24 },
37 { 25 {
@@ -39,7 +27,14 @@ @@ -39,7 +27,14 @@
39 "style": { 27 "style": {
40 "navigationBarTitleText": "告警" 28 "navigationBarTitleText": "告警"
41 } 29 }
42 - }, { 30 + },
  31 + {
  32 + "path": "pages/alert/alertDetail",
  33 + "style": {
  34 + "navigationBarTitleText": "告警详情"
  35 + }
  36 + },
  37 + {
43 "path": "pages/personal/personal", 38 "path": "pages/personal/personal",
44 "style": { 39 "style": {
45 "navigationBarTitleText": "个人中心" 40 "navigationBarTitleText": "个人中心"
@@ -84,16 +79,13 @@ @@ -84,16 +79,13 @@
84 "style": { 79 "style": {
85 "navigationBarTitleText": "意见反馈", 80 "navigationBarTitleText": "意见反馈",
86 "app-plus": { 81 "app-plus": {
87 - "scrollIndicator": "none" //当前页面不显示滚动条 82 + "scrollIndicator": "none"
88 } 83 }
89 } 84 }
90 }, { 85 }, {
91 "path": "pages/index/camera/camera", 86 "path": "pages/index/camera/camera",
92 "style": { 87 "style": {
93 "navigationBarTitleText": "查看摄像头" 88 "navigationBarTitleText": "查看摄像头"
94 - // "app-plus": {  
95 - // "scrollIndicator": "none" //当前页面不显示滚动条  
96 - // }  
97 } 89 }
98 90
99 }, { 91 }, {
@@ -102,6 +94,27 @@ @@ -102,6 +94,27 @@
102 "navigationBarTitleText": "查看组态" 94 "navigationBarTitleText": "查看组态"
103 } 95 }
104 96
  97 + },
  98 + {
  99 + "path": "pages/device/org/org",
  100 + "style": {
  101 + "navigationBarTitleText": "组织筛选"
  102 + }
  103 +
  104 + },
  105 + {
  106 + "path": "pages/index/orgStatus/statusDetail",
  107 + "style": {
  108 + "navigationBarTitleText": "组态详情"
  109 + }
  110 +
  111 + },
  112 + {
  113 + "path": "pages/alert/org/org",
  114 + "style": {
  115 + "navigationBarTitleText": "组织筛选"
  116 + }
  117 +
105 } 118 }
106 ], 119 ],
107 "globalStyle": { 120 "globalStyle": {
1 <template> 1 <template>
2 - <view class="content">  
3 - <text>告警</text>  
4 - <!-- 公共组件-每个页面必须引入 -->  
5 - <public-module></public-module>  
6 - <f-tabbar :isFillHeight="false"></f-tabbar>  
7 - </view> 2 + <view class="alert-page">
  3 + <f-navbar>
  4 + <view class="u-flex" slot="right" style="justify-content: space-between;flex-direction: row;">
  5 + <view style="width: 580rpx;visibility: hidden;"><u--input prefixIcon="search" placeholder="输入设备SN或名称搜索" border="surround" shape="circle"></u--input></view>
  6 + <view style="margin-left: 7rpx;">
  7 + <view class=""><text style="color:#333333;font-size: 14px;">筛选</text></view>
  8 + </view>
  9 + <view style="margin-left: 7rpx;"><image @click="openSearchDialog" style="width: 40rpx;height: 40rpx;" src="../../static/shaixuan.png" mode=""></image></view>
  10 + </view>
  11 + </f-navbar>
  12 + <!-- 公共组件-每个页面必须引入 -->
  13 + <public-module></public-module>
  14 + <view class="org-sty">
  15 + <view class="org-item">
  16 + <view class="u-flex" style="flex-direction: row;margin-top: 26rpx;margin-left: 15rpx;">
  17 + <text style="color:#333333;font-size: 15px;margin-left: 14rpx;">组织关系</text>
  18 + </view>
  19 + <view style="margin-top: 5rpx;margin-left: 15rpx;flex-direction: row;" class="u-flex">
  20 + <image style="margin-left: 14rpx;width: 30rpx;height: 30rpx;" src="../../static/org.png" mode=""></image>
  21 + <text style="margin-left: 10rpx;color:#666666;font-size: 12px;">设备数:1234</text>
  22 + </view>
  23 + </view>
  24 + <view class="org-item" style="">
  25 + <image @click="openOrg" style="width: 6px;height: 10px;float: right; margin-right: 34rpx; margin-top: 58rpx;" src="../../static/right-arrow.png" mode=""></image>
  26 + </view>
  27 + </view>
  28 + <view class="device-list">
  29 + <view @click="openAlertDetail(item.id)" class="list-item" v-for="(item, index) in list" :key="index">
  30 + <view class="item">
  31 + <view style="margin-top: -3rpx;">
  32 + <text style="color:#333333;font-size: 15px;">{{ item.name1 }}</text>
  33 + </view>
  34 + <view class="u-flex" style="flex-direction: column;margin-top: -1rpx;">
  35 + <view style="text-align: left;width: 279rpx;">
  36 + <text style="color:#666666;font-size: 14px;">{{ item.name2 }}</text>
  37 + </view>
  38 + <view style="text-align: left;">
  39 + <text style="color:#666666;font-size: 14px;">{{ item.name3 }}</text>
  40 + </view>
  41 + <view style="text-align: left;">
  42 + <text style="color:#999999;font-size: 14px;">{{ item.time }}</text>
  43 + </view>
  44 + </view>
  45 + </view>
  46 + <view class="item">
  47 + <view class="u-flex" style="flex-direction: row;margin-top: -6rpx;">
  48 + <image style="width: 30rpx;height: 30rpx;margin-top: 5rpx;margin-right: 5rpx;" :src="item.name4" mode=""></image>
  49 + <view class="">
  50 + <text style="color: #333333;font-size: 13px;margin-left: 5rpx;margin-top: 20rpx;">{{ item.name5 }}</text>
  51 + </view>
  52 + </view>
  53 + </view>
  54 + </view>
  55 + </view>
  56 + <view style="height:20rpx"></view>
  57 + <!-- 告警筛选 -->
  58 + <u-popup @close="close" closeable bgColor="transparent" :overlay="true" :show="show" mode="bottom">
  59 + <view style="height: 1100rpx;background:#FFFFFF;border-radius: 20rpx;overflow-y: scroll;">
  60 + <view style="text-align: center;position: relative;top: 68rpx;margin-top: -40rpx;"><text style="font-size: 16px;color: #333333;">筛选条件</text></view>
  61 + <view style="margin-top: 97rpx;margin-left: 43rpx;">
  62 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">告警状态</text></view>
  63 + <view
  64 + class="u-flex"
  65 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  66 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  67 + >
  68 + <view
  69 + v-for="(item, index) in alertStatus"
  70 + :key="index"
  71 + style="margin: 10rpx;line-height: 50rpx;text-align: center;
  72 + width:180rpx;height: 60rpx;
  73 + background-color:#F6F6F6;border-radius:32px"
  74 + >
  75 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  76 + </view>
  77 + </view>
  78 + </view>
  79 + <view style="margin-top: 145rpx;margin-left: 43rpx;">
  80 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">设备类型</text></view>
  81 + <view
  82 + class="u-flex"
  83 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  84 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  85 + >
  86 + <view
  87 + v-for="(item, index) in deviceType"
  88 + :key="index"
  89 + style="margin: 10rpx;line-height: 50rpx;text-align: center;
  90 + width:180rpx;height: 60rpx;
  91 + background-color:#F6F6F6;border-radius:32px"
  92 + >
  93 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  94 + </view>
  95 + </view>
  96 + </view>
  97 + <view style="margin-top: 136rpx;margin-left: 43rpx;">
  98 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">告警等级</text></view>
  99 + <view
  100 + class="u-flex"
  101 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  102 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  103 + >
  104 + <view
  105 + v-for="(item, index) in alertLevel"
  106 + :key="index"
  107 + style="margin: 10rpx;line-height: 50rpx;text-align: center;
  108 + width:180rpx;height: 60rpx;
  109 + background-color:#F6F6F6;border-radius:32px"
  110 + >
  111 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  112 + </view>
  113 + </view>
  114 + </view>
  115 + <view style="margin-top: 136rpx;margin-left: 43rpx;">
  116 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">选择时间</text></view>
  117 + <view
  118 + class="u-flex"
  119 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  120 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  121 + >
  122 + <view
  123 + v-for="(item, index) in timeArea"
  124 + :key="index"
  125 + style="margin: 10rpx;line-height: 50rpx;text-align: center;
  126 + width:180rpx;height: 60rpx;
  127 + background-color:#F6F6F6;border-radius:32px"
  128 + >
  129 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  130 + </view>
  131 + </view>
  132 + </view>
  133 + <view style="margin-top: 136rpx;margin-left: 43rpx;">
  134 + <view class="u-flex" style="margin-left: 10rpx;margin-top: 15rpx;width:750rpx;height: 60rpx;flex-direction: row;">
  135 + <u--form labelPosition="left" :model="timeData" :rules="rules" ref="form1" style="padding-left: 26rpx;width: 617rpx!important;">
  136 + <u-form-item
  137 + style="font-size: 14px;"
  138 + label="选择日期"
  139 + prop="selectTime"
  140 + labelWidth="80"
  141 + borderBottom
  142 + @click="
  143 + showCalendar = true;
  144 + hideKeyboard();
  145 + "
  146 + >
  147 + <u--input v-model="timeData.selectTime" placeholder="请选择日期" border="none"></u--input>
  148 + </u-form-item>
  149 + </u--form>
  150 + </view>
  151 + </view>
  152 + <view class="u-flex" style="flex-direction: row;margin-top: 128rpx;margin-left: 55rpx;">
  153 + <view style="width: 300rpx"><u-button type="info" shape="circle" text="重置"></u-button></view>
  154 + <view style="width: 300rpx;margin-left:46rpx ;"><u-button type="primary" shape="circle" text="确认"></u-button></view>
  155 + </view>
  156 + <view style="height: 30rpx;"></view>
  157 + </view>
  158 + </u-popup>
  159 + <u-calendar
  160 + :show="showCalendar"
  161 + mode="range"
  162 + @confirm="calendarConfirm"
  163 + @close="calendarClose"
  164 + startText="开始时间"
  165 + endText="结束时间"
  166 + confirmDisabledText="请选择日期"
  167 + :formatter="formatter"
  168 + ></u-calendar>
  169 + <f-tabbar></f-tabbar>
  170 + </view>
8 </template> 171 </template>
9 172
10 <script> 173 <script>
11 import fTabbar from '@/components/module/f-tabbar/f-tabbar'; 174 import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  175 +import fNavbar from '@/components/module/f-navbar/f-navbar';
  176 +
12 export default { 177 export default {
13 - components: {  
14 - fTabbar  
15 - },  
16 - data() {  
17 - return {  
18 - }  
19 - },  
20 - onLoad(e) {  
21 - // 隐藏原生的tabbar  
22 - uni.hideTabBar();  
23 - },  
24 -} 178 + components: {
  179 + fTabbar,
  180 + fNavbar
  181 + },
  182 + data() {
  183 + return {
  184 + timeData: {
  185 + selectTime: '',
  186 + getTimeGap: ''
  187 + },
  188 + showCalendar: false,
  189 + show: false,
  190 + alertStatus: [
  191 + {
  192 + index: 1,
  193 + name: '全部',
  194 + bgColor: '#377DFF',
  195 + textColor: '#377DFF'
  196 + },
  197 + {
  198 + index: 2,
  199 + name: '激活未确认',
  200 + bgColor: '#F6F6F6',
  201 + textColor: '#F6F6F6'
  202 + },
  203 + {
  204 + index: 3,
  205 + name: '激活已确认',
  206 + bgColor: '#F6F6F6',
  207 + textColor: '#F6F6F6'
  208 + },
  209 + {
  210 + index: 4,
  211 + name: '清除未确认',
  212 + bgColor: '#F6F6F6',
  213 + textColor: '#F6F6F6'
  214 + },
  215 + {
  216 + index: 5,
  217 + name: '清除已确认',
  218 + bgColor: '#F6F6F6',
  219 + textColor: '#F6F6F6'
  220 + },
  221 + {
  222 + index: 6,
  223 + name: '清除已确认',
  224 + bgColor: '#F6F6F6',
  225 + textColor: '#F6F6F6'
  226 + }
  227 + ],
  228 + deviceType: [
  229 + {
  230 + index: 1,
  231 + name: '全部',
  232 + bgColor: '#377DFF',
  233 + textColor: '#377DFF'
  234 + },
  235 + {
  236 + index: 2,
  237 + name: '网关设备',
  238 + bgColor: '#F6F6F6',
  239 + textColor: '#F6F6F6'
  240 + },
  241 + {
  242 + index: 3,
  243 + name: '网关子设备',
  244 + bgColor: '#F6F6F6',
  245 + textColor: '#F6F6F6'
  246 + },
  247 + {
  248 + index: 4,
  249 + name: '直连设备',
  250 + bgColor: '#F6F6F6',
  251 + textColor: '#F6F6F6'
  252 + }
  253 + ],
  254 + alertLevel: [
  255 + {
  256 + index: 1,
  257 + name: '全部',
  258 + bgColor: '#377DFF',
  259 + textColor: '#377DFF'
  260 + },
  261 + {
  262 + index: 2,
  263 + name: '危险',
  264 + bgColor: '#F6F6F6',
  265 + textColor: '#F6F6F6'
  266 + },
  267 + {
  268 + index: 3,
  269 + name: '重要',
  270 + bgColor: '#F6F6F6',
  271 + textColor: '#F6F6F6'
  272 + },
  273 + {
  274 + index: 4,
  275 + name: '次要',
  276 + bgColor: '#F6F6F6',
  277 + textColor: '#F6F6F6'
  278 + },
  279 + {
  280 + index: 4,
  281 + name: '警告',
  282 + bgColor: '#F6F6F6',
  283 + textColor: '#F6F6F6'
  284 + },
  285 + {
  286 + index: 4,
  287 + name: '不确定',
  288 + bgColor: '#F6F6F6',
  289 + textColor: '#F6F6F6'
  290 + }
  291 + ],
  292 + timeArea: [
  293 + {
  294 + index: 1,
  295 + name: '全部',
  296 + value: '全部',
  297 + bgColor: '#F6F6F6',
  298 + textColor: '#F6F6F6'
  299 + },
  300 + {
  301 + index: 2,
  302 + name: '30分钟',
  303 + value: '30',
  304 + bgColor: '#F6F6F6',
  305 + textColor: '#F6F6F6'
  306 + },
  307 + {
  308 + index: 3,
  309 + name: '1小时',
  310 + value: '30',
  311 + bgColor: '#F6F6F6',
  312 + textColor: '#F6F6F6'
  313 + },
  314 + {
  315 + index: 4,
  316 + name: '2小时',
  317 + value: '120',
  318 + bgColor: '#F6F6F6',
  319 + textColor: '#F6F6F6'
  320 + },
  321 + {
  322 + index: 5,
  323 + name: '近一天',
  324 + value: '24',
  325 + bgColor: '#F6F6F6',
  326 + textColor: '#F6F6F6'
  327 + },
  328 + {
  329 + index: 6,
  330 + name: '',
  331 + value: '',
  332 + bgColor: '#F6F6F6',
  333 + textColor: '#F6F6F6'
  334 + }
  335 + ],
  336 + list: [
  337 + {
  338 + name1: '1号楼1楼三单元水表',
  339 + name2: 'CO₂:65.32',
  340 + name3: '告警状态:清除已确认',
  341 + name4: '../../static/danger.png',
  342 + name5: '危险',
  343 + time: '2022-04-01 02:12:23',
  344 + id: 'xx1'
  345 + },
  346 + {
  347 + name1: '2号楼1楼三单元水表',
  348 + name2: 'PH:9.8',
  349 + name3: '告警状态:激活未确认',
  350 + name4: '../../static/major.png',
  351 + name5: '重要',
  352 + time: '2022-04-01 02:12:23',
  353 + id: 'xx2'
  354 + },
  355 + {
  356 + name1: '3号楼1楼三单元水表',
  357 + name2: 'NH3:600',
  358 + name3: '告警状态:激活未确认',
  359 + name4: '../../static/secondary.png',
  360 + name5: '次要',
  361 + time: '2022-04-01 02:12:23',
  362 + id: 'xx3'
  363 + },
  364 + {
  365 + name1: '4号楼1楼三单元水表',
  366 + name2: '水深:1.4',
  367 + name3: '告警状态:激活未确认',
  368 + name4: '../../static/secondary.png',
  369 + name5: '次要',
  370 + time: '2022-04-01 02:12:23',
  371 + id: 'xx4'
  372 + },
  373 + {
  374 + name1: '5号楼1楼三单元水表',
  375 + name2: 'COD:125',
  376 + name3: '告警状态:激活未确认',
  377 + name4: '../../static/noshue.png',
  378 + name5: '不确定',
  379 + time: '2022-04-01 02:12:23',
  380 + id: 'xx5'
  381 + }
  382 + ]
  383 + };
  384 + },
  385 + onLoad(e) {
  386 + // 隐藏原生的tabbar
  387 + uni.hideTabBar();
  388 + },
  389 + methods: {
  390 + openOrg() {
  391 + uni.navigateTo({
  392 + url: './org/org'
  393 + });
  394 + },
  395 + open() {},
  396 + close() {
  397 + this.show = false;
  398 + },
  399 + openSearchDialog() {
  400 + this.show = true;
  401 + },
  402 + hideKeyboard() {
  403 + uni.hideKeyboard();
  404 + },
  405 + calendarConfirm(e) {
  406 + this.showCalendar = false;
  407 + this.timeData.selectTime = `${e[0]} / ${e[e.length - 1]}`;
  408 + },
  409 + calendarClose() {
  410 + this.showCalendar = false;
  411 + },
  412 + openAlertDetail() {
  413 + uni.navigateTo({
  414 + url: './alertDetail'
  415 + });
  416 + }
  417 + }
  418 +};
25 </script> 419 </script>
26 420
27 <style lang="scss" scoped> 421 <style lang="scss" scoped>
  422 +.alert-page {
  423 + margin-top: 5rpx;
  424 +}
  425 +.device-list {
  426 + display: flex;
  427 + flex-direction: column;
  428 + padding-left: 18rpx;
  429 + .list-item {
  430 + width: 713rpx;
  431 + height: 233rpx;
  432 + background-color: #fff;
  433 + margin-top: 24rpx;
  434 + display: flex;
  435 + flex-direction: row;
  436 + border-radius: 10px;
  437 + justify-content: space-between;
  438 + .item {
  439 + margin: 30rpx;
  440 + }
  441 + }
  442 +}
  443 +.org-sty {
  444 + width: 750rpx;
  445 + height: 150rpx;
  446 + background-color: #fff;
  447 + display: flex;
  448 + flex-direction: row;
  449 + justify-content: space-between;
  450 + .org-item {
  451 + width: 350rpx;
  452 + height: 200rpx;
  453 + }
  454 +}
  455 +.u-form {
  456 + width: 618rpx !important;
  457 +}
28 </style> 458 </style>
  1 +<template>
  2 + <view class="alert-detail-page">
  3 + <!-- 公共组件-每个页面必须引入 -->
  4 + <public-module></public-module>
  5 + <view style="border-radius: 20px;width: 688rpx;height: 573rpx;background-color: #FFFFFF;">
  6 + <u-list @scrolltolower="scrolltolower">
  7 + <u-list-item v-for="(item, index) in list" :key="index"><u-cell :title="item.name" :value="item.val"></u-cell></u-list-item>
  8 + </u-list>
  9 + </view>
  10 + <view style="color:#333333,font-size:15px;margin-top: 20rpx;">处理结果</view>
  11 + <view style="margin-top: 20rpx;;border-radius: 20px;width: 688rpx;height: 273rpx;background-color: #FFFFFF;">
  12 + <u--form labelPosition="left" :model="formModel" ref="form1">
  13 + <u-form-item label="." prop="result" ref="item3">
  14 + <u--textarea border="none" height="96" placeholder="请输入处理结果" v-model="formModel.result" count></u--textarea>
  15 + </u-form-item>
  16 + </u--form>
  17 + </view>
  18 + <view style="width: 500rpx;margin-left: 80rpx;margin-top: 44rpx;"><u-button @click="handleSubmit" type="primary" shape="circle" text="处理"></u-button></view>
  19 + <f-tabbar></f-tabbar>
  20 + </view>
  21 +</template>
  22 +
  23 +<script>
  24 +import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  25 +export default {
  26 + components: {
  27 + fTabbar
  28 + },
  29 + data() {
  30 + return {
  31 + formModel: {
  32 + result: ''
  33 + },
  34 + list: [
  35 + {
  36 + name: '新疆1-59-25栏位网关子设备',
  37 + val: '22'
  38 + },
  39 + {
  40 + name: '告警级别',
  41 + val: '危险'
  42 + },
  43 + {
  44 + name: '所属组织',
  45 + val: '1-59-25栏位'
  46 + },
  47 + {
  48 + name: '告警值',
  49 + val: '856'
  50 + },
  51 + {
  52 + name: '告警时间',
  53 + val: '2022-01-25 12:53:22'
  54 + },
  55 + {
  56 + name: '告警状态',
  57 + val: '激活未确认'
  58 + }
  59 + ]
  60 + };
  61 + },
  62 + onLoad(e) {
  63 + // 隐藏原生的tabbar
  64 + uni.hideTabBar();
  65 + },
  66 + methods: {
  67 + handleSubmit() {}
  68 + }
  69 +};
  70 +</script>
  71 +
  72 +<style lang="scss" scoped>
  73 +.alert-detail-page {
  74 + padding: 30rpx;
  75 +}
  76 +</style>
  1 +<template>
  2 + <view class="org-content">
  3 + <!-- 公共组件-每个页面必须引入 -->
  4 + <public-module></public-module>
  5 + <view>
  6 + <luyj-tree search-placeholder="请输入搜索内容" :is-check="true" :search-if="true" v-slot:default="{ item }" :max="max" :trees="tree">
  7 + <view>
  8 + <view class="content-item">
  9 + <view class="word">{{ item.name }}</view>
  10 + </view>
  11 + </view>
  12 + </luyj-tree>
  13 + </view>
  14 + <f-tabbar></f-tabbar>
  15 + </view>
  16 +</template>
  17 +
  18 +<script>
  19 +import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  20 +import dataList from '@/config/mockOrg.js';
  21 +
  22 +export default {
  23 + components: {
  24 + fTabbar
  25 + },
  26 + data() {
  27 + return {
  28 + tree: dataList,
  29 + max: 5
  30 + };
  31 + },
  32 + onLoad(e) {
  33 + // 隐藏原生的tabbar
  34 + uni.hideTabBar();
  35 + }
  36 +};
  37 +</script>
  38 +
  39 +<style lang="scss" scoped>
  40 +.org-content {
  41 + padding: 0 10rpx;
  42 +}
  43 +</style>
1 <template> 1 <template>
2 <view class="device-page"> 2 <view class="device-page">
  3 + <f-navbar>
  4 + <view class="u-flex" slot="left" style="justify-content: space-between;flex-direction: row;">
  5 + <view style="width: 580rpx;"><u--input prefixIcon="search" placeholder="输入设备SN或名称搜索" border="surround" shape="circle"></u--input></view>
  6 + <view style="margin-left: 7rpx;">
  7 + <view class=""><text style="color:#333333;font-size: 14px;">筛选</text></view>
  8 + </view>
  9 + <view style="margin-left: 7rpx;"><image @click="openSearchDialog" style="width: 40rpx;height: 40rpx;" src="../../static/shaixuan.png" mode=""></image></view>
  10 + </view>
  11 + </f-navbar>
3 <!-- 公共组件-每个页面必须引入 --> 12 <!-- 公共组件-每个页面必须引入 -->
4 <public-module></public-module> 13 <public-module></public-module>
5 <view class="org-sty"> 14 <view class="org-sty">
6 <view class="org-item"> 15 <view class="org-item">
7 <view class="u-flex" style="flex-direction: row;margin-top: 26rpx;margin-left: 15rpx;"> 16 <view class="u-flex" style="flex-direction: row;margin-top: 26rpx;margin-left: 15rpx;">
8 - <image style="width: 30rpx;height: 30rpx;" src="../../static/org.png" mode=""></image>  
9 <text style="color:#333333;font-size: 15px;margin-left: 14rpx;">组织关系</text> 17 <text style="color:#333333;font-size: 15px;margin-left: 14rpx;">组织关系</text>
10 </view> 18 </view>
11 - <view style="margin-top: 5rpx;margin-left: 15rpx" class=""><text style="color:#666666;font-size: 12px;">设备数:1234</text></view> 19 + <view style="margin-top: 5rpx;margin-left: 15rpx;flex-direction: row;" class="u-flex">
  20 + <image style="margin-left: 14rpx;width: 30rpx;height: 30rpx;" src="../../static/org.png" mode=""></image>
  21 + <text style="margin-left: 10rpx;color:#666666;font-size: 12px;">设备数:1234</text>
  22 + </view>
12 </view> 23 </view>
13 <view class="org-item" style=""> 24 <view class="org-item" style="">
14 - <image style="width: 10px;height: 10px;float: right; margin-right: 34rpx; margin-top: 58rpx;" src="../../static/right-arrow.png" mode=""></image> 25 + <image @click="openOrg" style="width: 6px;height: 10px;float: right; margin-right: 34rpx; margin-top: 58rpx;" src="../../static/right-arrow.png" mode=""></image>
15 </view> 26 </view>
16 </view> 27 </view>
17 <view class="device-list"> 28 <view class="device-list">
18 - <view class="list-item" v-for="(item, index) in list" :key="index"> 29 + <view @click="openDeviceDetail(item.id)" class="list-item" v-for="(item, index) in list" :key="index">
19 <view class="item"> 30 <view class="item">
20 <view> 31 <view>
21 <text style="color:#333333;font-size: 15px;">{{ item.name1 }}</text> 32 <text style="color:#333333;font-size: 15px;">{{ item.name1 }}</text>
@@ -39,54 +50,210 @@ @@ -39,54 +50,210 @@
39 </view> 50 </view>
40 </view> 51 </view>
41 </view> 52 </view>
  53 + <view style="height: 30rpx;"></view>
  54 + <!-- 设备筛选 -->
  55 + <u-popup @close="close" closeable bgColor="transparent" :overlay="true" :show="show" mode="bottom">
  56 + <view style="height: 900rpx;background:#f5f5f5;border-radius: 20rpx;">
  57 + <view style="text-align: center;position: relative;top: 68rpx;margin-top: -40rpx;"><text style="font-size: 16px;color: #333333;">筛选条件</text></view>
  58 + <view style="margin-top: 97rpx;margin-left: 43rpx;">
  59 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">设备状态</text></view>
  60 + <view
  61 + class="u-flex"
  62 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  63 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  64 + >
  65 + <view
  66 + v-for="(item, index) in deviceStatus"
  67 + :key="index"
  68 + style="margin: 10rpx;line-height: 45rpx;text-align: center;
  69 + width:180rpx;height: 60rpx;
  70 + border: 0.02px solid rgba(55, 125, 255, 0.3);
  71 + background-color:#F6F6F6;border-radius:32px"
  72 + >
  73 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  74 + </view>
  75 + </view>
  76 + </view>
  77 + <view style="margin-top: 145rpx;margin-left: 43rpx;">
  78 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">告警状态</text></view>
  79 + <view
  80 + class="u-flex"
  81 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  82 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  83 + >
  84 + <view
  85 + v-for="(item, index) in alertStatus"
  86 + :key="index"
  87 + style="margin: 10rpx;line-height: 45rpx;text-align: center;
  88 + width:180rpx;height: 60rpx;
  89 + border: 0.02px solid rgba(55, 125, 255, 0.3);
  90 + background-color:#F6F6F6;border-radius:32px"
  91 + >
  92 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  93 + </view>
  94 + </view>
  95 + </view>
  96 + <view style="margin-top: 66rpx;margin-left: 43rpx;">
  97 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">设备类型</text></view>
  98 + <view
  99 + class="u-flex"
  100 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  101 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  102 + >
  103 + <view
  104 + v-for="(item, index) in typeStatus"
  105 + :key="index"
  106 + style="margin: 10rpx;line-height: 45rpx;text-align: center;
  107 + width:180rpx;height: 60rpx;
  108 + border: 0.02px solid rgba(55, 125, 255, 0.3);
  109 + background-color:#F6F6F6;border-radius:32px"
  110 + >
  111 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  112 + </view>
  113 + </view>
  114 + </view>
  115 + <view class="u-flex" style="flex-direction: row;margin-top: 128rpx;margin-left: 55rpx;">
  116 + <view style="width: 300rpx"><u-button type="info" shape="circle" text="重置"></u-button></view>
  117 + <view style="width: 300rpx;margin-left:46rpx ;"><u-button type="success" shape="circle" text="确认"></u-button></view>
  118 + </view>
  119 + </view>
  120 + </u-popup>
42 <f-tabbar></f-tabbar> 121 <f-tabbar></f-tabbar>
43 </view> 122 </view>
44 </template> 123 </template>
45 124
46 <script> 125 <script>
47 import fTabbar from '@/components/module/f-tabbar/f-tabbar'; 126 import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  127 +import fNavbar from '@/components/module/f-navbar/f-navbar';
48 128
49 export default { 129 export default {
50 components: { 130 components: {
51 - fTabbar 131 + fTabbar,
  132 + fNavbar
52 }, 133 },
53 data() { 134 data() {
54 return { 135 return {
  136 + show: false,
  137 + deviceStatus: [
  138 + {
  139 + index: 1,
  140 + name: '全部',
  141 + bgColor: '#377DFF',
  142 + textColor: '#377DFF'
  143 + },
  144 + {
  145 + index: 2,
  146 + name: '在线',
  147 + bgColor: '#F6F6F6',
  148 + textColor: '#F6F6F6'
  149 + },
  150 + {
  151 + index: 3,
  152 + name: '离线',
  153 + bgColor: '#F6F6F6',
  154 + textColor: '#F6F6F6'
  155 + },
  156 + {
  157 + index: 4,
  158 + name: '待激活',
  159 + bgColor: '#F6F6F6',
  160 + textColor: '#F6F6F6'
  161 + }
  162 + ],
  163 + alertStatus: [
  164 + {
  165 + index: 1,
  166 + name: '全部',
  167 + bgColor: '#377DFF',
  168 + textColor: '#377DFF'
  169 + },
  170 + {
  171 + index: 2,
  172 + name: '告警',
  173 + bgColor: '#F6F6F6',
  174 + textColor: '#F6F6F6'
  175 + },
  176 + {
  177 + index: 3,
  178 + name: '正常',
  179 + bgColor: '#F6F6F6',
  180 + textColor: '#F6F6F6'
  181 + }
  182 + ],
  183 + typeStatus: [
  184 + {
  185 + index: 1,
  186 + name: '全部',
  187 + bgColor: '#377DFF',
  188 + textColor: '#377DFF'
  189 + },
  190 + {
  191 + index: 2,
  192 + name: '网关设备',
  193 + bgColor: '#F6F6F6',
  194 + textColor: '#F6F6F6'
  195 + },
  196 + {
  197 + index: 3,
  198 + name: '网关子设备',
  199 + bgColor: '#F6F6F6',
  200 + textColor: '#F6F6F6'
  201 + },
  202 + {
  203 + index: 4,
  204 + name: '直连设备',
  205 + bgColor: '#F6F6F6',
  206 + textColor: '#F6F6F6'
  207 + }
  208 + ],
55 list: [ 209 list: [
56 { 210 {
57 name1: '1号楼1楼三单元水表', 211 name1: '1号楼1楼三单元水表',
58 name2: '设备编号:SN987633433', 212 name2: '设备编号:SN987633433',
59 name3: '所属组:XXXXXX', 213 name3: '所属组:XXXXXX',
60 name4: '../../static/online.png', 214 name4: '../../static/online.png',
61 - name5: '在线' 215 + name5: '在线',
  216 + id: 'xx1'
62 }, 217 },
63 { 218 {
64 name1: '2号楼1楼三单元水表', 219 name1: '2号楼1楼三单元水表',
65 name2: '设备编号:SN987633433', 220 name2: '设备编号:SN987633433',
66 name3: '所属组:XXXXXX', 221 name3: '所属组:XXXXXX',
67 name4: '../../static/online.png', 222 name4: '../../static/online.png',
68 - name5: '在线' 223 + name5: '在线',
  224 + id: 'xx2'
69 }, 225 },
70 { 226 {
71 name1: '3号楼1楼三单元水表', 227 name1: '3号楼1楼三单元水表',
72 name2: '设备编号:SN987633433', 228 name2: '设备编号:SN987633433',
73 name3: '所属组:XXXXXX', 229 name3: '所属组:XXXXXX',
74 name4: '../../static/baojing.png', 230 name4: '../../static/baojing.png',
75 - name5: '离线' 231 + name5: '离线',
  232 + id: 'xx3'
76 }, 233 },
77 { 234 {
78 name1: '4号楼1楼三单元水表', 235 name1: '4号楼1楼三单元水表',
79 name2: '设备编号:SN987633433', 236 name2: '设备编号:SN987633433',
80 name3: '所属组:XXXXXX', 237 name3: '所属组:XXXXXX',
81 name4: '../../static/unonline.png', 238 name4: '../../static/unonline.png',
82 - name5: '未激活' 239 + name5: '未激活',
  240 + id: 'xx4'
83 }, 241 },
84 { 242 {
85 name1: '5号楼1楼三单元水表', 243 name1: '5号楼1楼三单元水表',
86 name2: '设备编号:SN987633433', 244 name2: '设备编号:SN987633433',
87 name3: '所属组:XXXXXX', 245 name3: '所属组:XXXXXX',
88 name4: '../../static/online.png', 246 name4: '../../static/online.png',
89 - name5: '在线' 247 + name5: '在线',
  248 + id: 'xx5'
  249 + },
  250 + {
  251 + name1: '6号楼1楼三单元水表',
  252 + name2: '设备编号:SN987633433',
  253 + name3: '所属组:XXXXXX',
  254 + name4: '../../static/online.png',
  255 + name5: '在线',
  256 + id: 'xx5'
90 } 257 }
91 ] 258 ]
92 }; 259 };
@@ -94,13 +261,33 @@ export default { @@ -94,13 +261,33 @@ export default {
94 onLoad() { 261 onLoad() {
95 // 隐藏原生的tabbar 262 // 隐藏原生的tabbar
96 uni.hideTabBar(); 263 uni.hideTabBar();
  264 + },
  265 + methods: {
  266 + openOrg() {
  267 + uni.navigateTo({
  268 + url: './org/org'
  269 + });
  270 + },
  271 + open() {},
  272 + close() {
  273 + this.show = false;
  274 + },
  275 + openSearchDialog() {
  276 + this.show = true;
  277 + },
  278 + openDeviceDetail(e) {
  279 + console.log(e);
  280 + uni.navigateTo({
  281 + url: 'deviceDetail'
  282 + });
  283 + }
97 } 284 }
98 }; 285 };
99 </script> 286 </script>
100 287
101 <style lang="scss" scoped> 288 <style lang="scss" scoped>
102 .device-page { 289 .device-page {
103 - padding: 0rpx 15rpx; 290 + // padding: 0rpx 15rpx;
104 min-height: 100vh; 291 min-height: 100vh;
105 background-color: #f8f9fa; 292 background-color: #f8f9fa;
106 } 293 }
@@ -120,7 +307,9 @@ export default { @@ -120,7 +307,9 @@ export default {
120 .device-list { 307 .device-list {
121 display: flex; 308 display: flex;
122 flex-direction: column; 309 flex-direction: column;
  310 + padding-left: 20rpx;
123 .list-item { 311 .list-item {
  312 + width: 713rpx;
124 height: 200rpx; 313 height: 200rpx;
125 background-color: #fff; 314 background-color: #fff;
126 margin-top: 24rpx; 315 margin-top: 24rpx;
  1 +<template>
  2 + <view class="device-detail-page">
  3 + <!-- 公共组件-每个页面必须引入 -->
  4 + <public-module></public-module>
  5 + <tab :lists="lists" :tab_color="tab_color" @switchover="switchover" :gauge="gauge"></tab>
  6 + <view style="margin-top:140rpx;" v-show="showTabPage == 1"><basicInfo /></view>
  7 + <view style="margin-top:140rpx;" v-show="showTabPage == 2"><realTimeData /></view>
  8 + <view style="margin-top:140rpx;" v-show="showTabPage == 3"><historyData /></view>
  9 + <view style="margin-top:140rpx;" v-show="showTabPage == 4"><alertHistory /></view>
  10 + <view style="margin-top:140rpx;" v-show="showTabPage == 5"><commondRecord /></view>
  11 + <f-tabbar></f-tabbar>
  12 + </view>
  13 +</template>
  14 +
  15 +<script>
  16 +import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  17 +import Tab from '@/components/yyh-tab/Tab.vue';
  18 +import basicInfo from './tabDetail/basicInfo.vue';
  19 +import realTimeData from './tabDetail/realtimeData.vue';
  20 +import alertHistory from './tabDetail/alertHistory.vue';
  21 +import historyData from './tabDetail/historyData.vue';
  22 +import commondRecord from './tabDetail/commondRecord.vue';
  23 +
  24 +export default {
  25 + components: {
  26 + fTabbar,
  27 + Tab,
  28 + basicInfo,
  29 + realTimeData,
  30 + alertHistory,
  31 + historyData,
  32 + commondRecord
  33 + },
  34 + data() {
  35 + return {
  36 + lists: [{ id: 1, name: '基础信息' }, { id: 2, name: '实时数据' }, { id: 3, name: '历史数据' }, { id: 4, name: '告警记录' }, { id: 5, name: '命令记录' }],
  37 + //tab切换选中的颜色
  38 + tab_color: '#3b87f6',
  39 + // tab组件position: fixed布局距离头部的位置大小(rpx)
  40 + gauge: 0,
  41 + showTabPage: 1
  42 + };
  43 + },
  44 + onLoad(e) {
  45 + // 隐藏原生的tabbar
  46 + uni.hideTabBar();
  47 + },
  48 + methods: {
  49 + switchover: function(id) {
  50 + console.log(id);
  51 + this.showTabPage = id;
  52 + }
  53 + }
  54 +};
  55 +</script>
  56 +
  57 +<style lang="scss" scoped>
  58 +.device-detail-page {
  59 +}
  60 +</style>
  1 +<template>
  2 + <view class="org-content">
  3 + <!-- 公共组件-每个页面必须引入 -->
  4 + <public-module></public-module>
  5 + <view>
  6 + <luyj-tree search-placeholder="请输入搜索内容" :is-check="true" :search-if="true" v-slot:default="{ item }" :max="max" :trees="tree">
  7 + <view>
  8 + <view class="content-item">
  9 + <view class="word">{{ item.name }}</view>
  10 + </view>
  11 + </view>
  12 + </luyj-tree>
  13 + </view>
  14 + <f-tabbar></f-tabbar>
  15 + </view>
  16 +</template>
  17 +
  18 +<script>
  19 +import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  20 +import dataList from '@/config/mockOrg.js';
  21 +
  22 +export default {
  23 + components: {
  24 + fTabbar
  25 + },
  26 + data() {
  27 + return {
  28 + tree: dataList,
  29 + max: 5
  30 + };
  31 + },
  32 + onLoad(e) {
  33 + // 隐藏原生的tabbar
  34 + uni.hideTabBar();
  35 + }
  36 +};
  37 +</script>
  38 +
  39 +<style lang="scss" scoped>
  40 +.org-content {
  41 + padding: 0 10rpx;
  42 +}
  43 +</style>
  1 +<template>
  2 + <view class="alert-page">
  3 + <!-- 公共组件-每个页面必须引入 -->
  4 + <public-module></public-module>
  5 + <view style="width: 192rpx;margin: 19rpx;"><u-button @click="openSearchDialog" shape="circle" type="info" icon="search" text="筛选"></u-button></view>
  6 + <view class="device-list">
  7 + <view @click="openDeviceDetail(item.id)" class="list-item" v-for="(item, index) in list" :key="index">
  8 + <view class="item">
  9 + <view style="margin-top: =13rpx;">
  10 + <text style="color:#333333;font-size: 15px;">{{ item.name1 }}</text>
  11 + </view>
  12 + <view class="u-flex" style="flex-direction: column;justify-content: flex-start;margin-top: -1rpx;">
  13 + <view style="text-align: left;width: 279rpx;">
  14 + <text style="color:#666666;font-size: 14px;">{{ item.name2 }}</text>
  15 + </view>
  16 + <view style="text-align: left;">
  17 + <text style="color:#666666;font-size: 14px;">{{ item.name3 }}</text>
  18 + </view>
  19 + <view style="text-align: left">
  20 + <text style="color:#666666;font-size: 14px;">{{ item.time }}</text>
  21 + </view>
  22 + </view>
  23 + </view>
  24 + <view class="item">
  25 + <view class="u-flex" style="flex-direction: row;margin-top: -6rpx;">
  26 + <image style="width: 30rpx;height: 30rpx;margin-top: 5rpx;margin-right: 5rpx;" :src="item.name4" mode=""></image>
  27 + <view class="">
  28 + <text style="color: #377DFF;font-size: 13px;margin-left: 5rpx;margin-top: 20rpx;">{{ item.name5 }}</text>
  29 + </view>
  30 + </view>
  31 + </view>
  32 + </view>
  33 + </view>
  34 + <view style="height: 30rpx;"></view>
  35 + <!-- 告警筛选 -->
  36 + <u-popup @close="close" closeable bgColor="transparent" :overlay="true" :show="show" mode="bottom">
  37 + <view style="height: 1100rpx;background:#FFFFFF;border-radius: 20rpx;overflow-y: scroll;">
  38 + <view style="text-align: center;position: relative;top: 68rpx;margin-top: -40rpx;"><text style="font-size: 16px;color: #333333;">筛选条件</text></view>
  39 + <view style="margin-top: 97rpx;margin-left: 43rpx;">
  40 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">告警状态</text></view>
  41 + <view
  42 + class="u-flex"
  43 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  44 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  45 + >
  46 + <view
  47 + v-for="(item, index) in alertStatus"
  48 + :key="index"
  49 + style="margin: 10rpx;line-height: 50rpx;text-align: center;
  50 + width:180rpx;height: 60rpx;
  51 + background-color:#F6F6F6;border-radius:32px"
  52 + >
  53 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  54 + </view>
  55 + </view>
  56 + </view>
  57 + <view style="margin-top: 145rpx;margin-left: 43rpx;">
  58 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">设备类型</text></view>
  59 + <view
  60 + class="u-flex"
  61 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  62 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  63 + >
  64 + <view
  65 + v-for="(item, index) in deviceType"
  66 + :key="index"
  67 + style="margin: 10rpx;line-height: 50rpx;text-align: center;
  68 + width:180rpx;height: 60rpx;
  69 + background-color:#F6F6F6;border-radius:32px"
  70 + >
  71 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  72 + </view>
  73 + </view>
  74 + </view>
  75 + <view style="margin-top: 136rpx;margin-left: 43rpx;">
  76 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">告警等级</text></view>
  77 + <view
  78 + class="u-flex"
  79 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  80 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  81 + >
  82 + <view
  83 + v-for="(item, index) in alertLevel"
  84 + :key="index"
  85 + style="margin: 10rpx;line-height: 50rpx;text-align: center;
  86 + width:180rpx;height: 60rpx;
  87 + background-color:#F6F6F6;border-radius:32px"
  88 + >
  89 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  90 + </view>
  91 + </view>
  92 + </view>
  93 + <view style="margin-top: 136rpx;margin-left: 43rpx;">
  94 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">选择时间</text></view>
  95 + <view
  96 + class="u-flex"
  97 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  98 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  99 + >
  100 + <view
  101 + v-for="(item, index) in timeArea"
  102 + :key="index"
  103 + style="margin: 10rpx;line-height: 50rpx;text-align: center;
  104 + width:180rpx;height: 60rpx;
  105 + background-color:#F6F6F6;border-radius:32px"
  106 + >
  107 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  108 + </view>
  109 + </view>
  110 + </view>
  111 + <view style="margin-top: 136rpx;margin-left: 43rpx;">
  112 + <view class="u-flex" style="margin-left: 10rpx;margin-top: 15rpx;width:750rpx;height: 60rpx;flex-direction: row;">
  113 + <u--form labelPosition="left" :model="timeData" :rules="rules" ref="form1" style="padding-left: 26rpx;width: 617rpx!important;">
  114 + <u-form-item
  115 + style="font-size: 14px;"
  116 + label="选择日期"
  117 + prop="selectTime"
  118 + labelWidth="80"
  119 + borderBottom
  120 + @click="
  121 + showCalendar = true;
  122 + hideKeyboard();
  123 + "
  124 + >
  125 + <u--input v-model="timeData.selectTime" placeholder="请选择日期" border="none"></u--input>
  126 + </u-form-item>
  127 + </u--form>
  128 + </view>
  129 + </view>
  130 + <view class="u-flex" style="flex-direction: row;margin-top: 128rpx;margin-left: 55rpx;">
  131 + <view style="width: 300rpx"><u-button type="info" shape="circle" text="重置"></u-button></view>
  132 + <view style="width: 300rpx;margin-left:46rpx ;"><u-button type="primary" shape="circle" text="确认"></u-button></view>
  133 + </view>
  134 + <view style="height: 30rpx;"></view>
  135 + </view>
  136 + </u-popup>
  137 + <u-calendar
  138 + :show="showCalendar"
  139 + mode="range"
  140 + @confirm="calendarConfirm"
  141 + @close="calendarClose"
  142 + startText="开始时间"
  143 + endText="结束时间"
  144 + confirmDisabledText="请选择日期"
  145 + :formatter="formatter"
  146 + ></u-calendar>
  147 + <f-tabbar :isFillHeight="false"></f-tabbar>
  148 + </view>
  149 +</template>
  150 +
  151 +<script>
  152 +import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  153 +export default {
  154 + components: {
  155 + fTabbar
  156 + },
  157 + data() {
  158 + return {
  159 + show: false,
  160 + timeData: {
  161 + selectTime: '',
  162 + getTimeGap: ''
  163 + },
  164 + showCalendar: false,
  165 + show: false,
  166 + alertStatus: [
  167 + {
  168 + index: 1,
  169 + name: '全部',
  170 + bgColor: '#377DFF',
  171 + textColor: '#377DFF'
  172 + },
  173 + {
  174 + index: 2,
  175 + name: '激活未确认',
  176 + bgColor: '#F6F6F6',
  177 + textColor: '#F6F6F6'
  178 + },
  179 + {
  180 + index: 3,
  181 + name: '激活已确认',
  182 + bgColor: '#F6F6F6',
  183 + textColor: '#F6F6F6'
  184 + },
  185 + {
  186 + index: 4,
  187 + name: '清除未确认',
  188 + bgColor: '#F6F6F6',
  189 + textColor: '#F6F6F6'
  190 + },
  191 + {
  192 + index: 5,
  193 + name: '清除已确认',
  194 + bgColor: '#F6F6F6',
  195 + textColor: '#F6F6F6'
  196 + },
  197 + {
  198 + index: 6,
  199 + name: '清除已确认',
  200 + bgColor: '#F6F6F6',
  201 + textColor: '#F6F6F6'
  202 + }
  203 + ],
  204 + deviceType: [
  205 + {
  206 + index: 1,
  207 + name: '全部',
  208 + bgColor: '#377DFF',
  209 + textColor: '#377DFF'
  210 + },
  211 + {
  212 + index: 2,
  213 + name: '网关设备',
  214 + bgColor: '#F6F6F6',
  215 + textColor: '#F6F6F6'
  216 + },
  217 + {
  218 + index: 3,
  219 + name: '网关子设备',
  220 + bgColor: '#F6F6F6',
  221 + textColor: '#F6F6F6'
  222 + },
  223 + {
  224 + index: 4,
  225 + name: '直连设备',
  226 + bgColor: '#F6F6F6',
  227 + textColor: '#F6F6F6'
  228 + }
  229 + ],
  230 + alertLevel: [
  231 + {
  232 + index: 1,
  233 + name: '全部',
  234 + bgColor: '#377DFF',
  235 + textColor: '#377DFF'
  236 + },
  237 + {
  238 + index: 2,
  239 + name: '危险',
  240 + bgColor: '#F6F6F6',
  241 + textColor: '#F6F6F6'
  242 + },
  243 + {
  244 + index: 3,
  245 + name: '重要',
  246 + bgColor: '#F6F6F6',
  247 + textColor: '#F6F6F6'
  248 + },
  249 + {
  250 + index: 4,
  251 + name: '次要',
  252 + bgColor: '#F6F6F6',
  253 + textColor: '#F6F6F6'
  254 + },
  255 + {
  256 + index: 4,
  257 + name: '警告',
  258 + bgColor: '#F6F6F6',
  259 + textColor: '#F6F6F6'
  260 + },
  261 + {
  262 + index: 4,
  263 + name: '不确定',
  264 + bgColor: '#F6F6F6',
  265 + textColor: '#F6F6F6'
  266 + }
  267 + ],
  268 + timeArea: [
  269 + {
  270 + index: 1,
  271 + name: '全部',
  272 + value: '全部',
  273 + bgColor: '#F6F6F6',
  274 + textColor: '#F6F6F6'
  275 + },
  276 + {
  277 + index: 2,
  278 + name: '30分钟',
  279 + value: '30',
  280 + bgColor: '#F6F6F6',
  281 + textColor: '#F6F6F6'
  282 + },
  283 + {
  284 + index: 3,
  285 + name: '1小时',
  286 + value: '30',
  287 + bgColor: '#F6F6F6',
  288 + textColor: '#F6F6F6'
  289 + },
  290 + {
  291 + index: 4,
  292 + name: '2小时',
  293 + value: '120',
  294 + bgColor: '#F6F6F6',
  295 + textColor: '#F6F6F6'
  296 + },
  297 + {
  298 + index: 5,
  299 + name: '近一天',
  300 + value: '24',
  301 + bgColor: '#F6F6F6',
  302 + textColor: '#F6F6F6'
  303 + },
  304 + {
  305 + index: 6,
  306 + name: '',
  307 + value: '',
  308 + bgColor: '#F6F6F6',
  309 + textColor: '#F6F6F6'
  310 + }
  311 + ],
  312 + list: [
  313 + {
  314 + name1: '1号楼1楼三单元水表',
  315 + name2: 'CO₂:65.32',
  316 + name3: '告警状态:清除已确认',
  317 + name4: '../../../static/danger.png',
  318 + name5: '危险',
  319 + time: '2022-04-01 02:12:23',
  320 + id: 'xx1'
  321 + },
  322 + {
  323 + name1: '2号楼1楼三单元水表',
  324 + name2: 'PH:9.8',
  325 + name3: '告警状态:激活未确认',
  326 + name4: '../../../static/major.png',
  327 + name5: '重要',
  328 + time: '2022-04-01 02:12:23',
  329 + id: 'xx2'
  330 + },
  331 + {
  332 + name1: '3号楼1楼三单元水表',
  333 + name2: 'NH3:600',
  334 + name3: '告警状态:激活未确认',
  335 + name4: '../../../static/secondary.png',
  336 + name5: '次要',
  337 + time: '2022-04-01 02:12:23',
  338 + id: 'xx3'
  339 + },
  340 + {
  341 + name1: '4号楼1楼三单元水表',
  342 + name2: '水深:1.4',
  343 + name3: '告警状态:激活未确认',
  344 + name4: '../../../static/secondary.png',
  345 + name5: '次要',
  346 + time: '2022-04-01 02:12:23',
  347 + id: 'xx4'
  348 + },
  349 + {
  350 + name1: '5号楼1楼三单元水表',
  351 + name2: 'COD:125',
  352 + name3: '告警状态:激活未确认',
  353 + name4: '../../../static/noshue.png',
  354 + name5: '不确定',
  355 + time: '2022-04-01 02:12:23',
  356 + id: 'xx5'
  357 + }
  358 + ]
  359 + };
  360 + },
  361 + onLoad(e) {
  362 + // 隐藏原生的tabbar
  363 + uni.hideTabBar();
  364 + },
  365 + methods: {
  366 + open() {},
  367 + close() {
  368 + this.show = false;
  369 + },
  370 + openSearchDialog() {
  371 + this.show = true;
  372 + },
  373 + hideKeyboard() {
  374 + uni.hideKeyboard();
  375 + },
  376 + calendarConfirm(e) {
  377 + this.showCalendar = false;
  378 + this.timeData.selectTime = `${e[0]} / ${e[e.length - 1]}`;
  379 + },
  380 + calendarClose() {
  381 + this.showCalendar = false;
  382 + }
  383 + }
  384 +};
  385 +</script>
  386 +
  387 +<style lang="scss" scoped>
  388 +.alert-page {
  389 + margin-top: -39rpx;
  390 +}
  391 +.device-list {
  392 + display: flex;
  393 + flex-direction: column;
  394 + padding-left: 18rpx;
  395 + margin-top: -18rpx;
  396 + .list-item {
  397 + width: 713rpx;
  398 + height: 233rpx;
  399 + background-color: #fff;
  400 + margin-top: 24rpx;
  401 + display: flex;
  402 + flex-direction: row;
  403 + border-radius: 10px;
  404 + justify-content: space-between;
  405 + .item {
  406 + margin: 30rpx;
  407 + }
  408 + }
  409 +}
  410 +</style>
  1 +<template>
  2 + <view class="basic-page">
  3 + <!-- 公共组件-每个页面必须引入 -->
  4 + <public-module></public-module>
  5 + <view class="u-flex" style="flex-direction: row;justify-content: space-between;align-items: center;height: 150rpx;background-color: #fff;border-radius: 20px;">
  6 + <view style="margin-left: 28rpx;"><text style="color:#333333;font-size: 15px;">网关设备1</text></view>
  7 + <view style="margin-left: -295rpx;"><text style="color:#377DFF;font-size: 14px;">在线</text></view>
  8 + <view style="height: 80rpx;margin-top: 39rpx;margin-right: 30rpx;">
  9 + <u-button @click="showIssueModel" size="mini" type="primary" shape="circle" text="下发命令"></u-button>
  10 + </view>
  11 + </view>
  12 + <view style="margin-top: 74rpx;height: 577rpx;background-color: #fff;border-radius: 20px;">
  13 + <u-list @scrolltolower="scrolltolower">
  14 + <u-list-item v-for="(item, index) in indexList" :key="index"><u-cell :value="item.value1" :title="item.name1"></u-cell></u-list-item>
  15 + </u-list>
  16 + </view>
  17 + <!-- 下发指令 -->
  18 + <u-modal :showConfirmButton="false" :show="showModel" :title="title">
  19 + <view style="width: 750rpx;">
  20 + <view style="height: 276rpx;border:0.1rpx solid #F0F0F0">
  21 + <u-form labelPosition="left" :model="formModel" :rules="rules" ref="form1">
  22 + <u-form-item label="." prop="intro" ref="item3">
  23 + <u--textarea border="none" placeholder="请输入命令内容" v-model="formModel.intro" count></u--textarea>
  24 + </u-form-item>
  25 + </u-form>
  26 + </view>
  27 + <view class="u-flex" style="justify-content: space-between;margin-top: -20rpx;">
  28 + <view style="width: 220rpx;"><u-button shape="circle" type="info" text="取消" customStyle="margin-top: 50px" @click="cancel"></u-button></view>
  29 + <view style="width: 220rpx;"><u-button shape="circle" type="primary" text="确定" customStyle="margin-top: 50px" @click="submit"></u-button></view>
  30 + </view>
  31 + </view>
  32 + </u-modal>
  33 + <f-tabbar></f-tabbar>
  34 + </view>
  35 +</template>
  36 +
  37 +<script>
  38 +import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  39 +export default {
  40 + components: {
  41 + fTabbar
  42 + },
  43 + data() {
  44 + return {
  45 + formModel: {
  46 + intro: ''
  47 + },
  48 + showModel: false,
  49 + title: '命令下发',
  50 + indexList: [
  51 + {
  52 + id: 1,
  53 + name1: '设备编号',
  54 + value1: 'SN98652320AOL5'
  55 + },
  56 + {
  57 + name1: '设备类型',
  58 + value1: '网关子设备'
  59 + },
  60 + {
  61 + name1: '所属组织',
  62 + value1: '1-59-25栏位'
  63 + },
  64 + {
  65 + name1: '最后连接时间',
  66 + value1: '2022-01-25 12:53:22'
  67 + },
  68 + {
  69 + name1: '是否告警',
  70 + value1: '否'
  71 + },
  72 + {
  73 + name1: '设备描述',
  74 + value1: '设备无任何问题,运行稳定'
  75 + }
  76 + ]
  77 + };
  78 + },
  79 + onLoad(e) {
  80 + // 隐藏原生的tabbar
  81 + uni.hideTabBar();
  82 + },
  83 + methods: {
  84 + showIssueModel() {
  85 + this.showModel = true;
  86 + },
  87 + cancel() {
  88 + this.showModel = false;
  89 + },
  90 + submit() {}
  91 + }
  92 +};
  93 +</script>
  94 +
  95 +<style lang="scss" scoped>
  96 +.basic-page {
  97 + padding: 15rpx;
  98 +}
  99 +
  100 +/deep/ .u-form-item {
  101 + margin-left: -89rpx;
  102 +}
  103 +</style>
  1 +<template>
  2 + <view class="alert-page">
  3 + <view style="width: 192rpx;margin: 19rpx;"><u-button @click="openSearchDialog" shape="circle" type="info" icon="search" text="筛选"></u-button></view>
  4 + <!-- 公共组件-每个页面必须引入 -->
  5 + <public-module></public-module>
  6 + <view class="device-list">
  7 + <view @click="openAlertDetail(item.id)" class="list-item" v-for="(item, index) in list" :key="index">
  8 + <view class="item">
  9 + <view style="margin-top: 18rpx;">
  10 + <text style="color:#333333;font-size: 15px;">{{ item.name1 }}</text>
  11 + </view>
  12 + <view class="u-flex" style="flex-direction: column;margin-top: -1rpx;">
  13 + <view style="text-align: left;width: 283rpx;">
  14 + <text style="color:#666666;font-size: 14px;">{{ item.name2 }}</text>
  15 + </view>
  16 + <view style="text-align: left;">
  17 + <text style="color:#999999;font-size: 14px;">{{ item.time }}</text>
  18 + </view>
  19 + </view>
  20 + </view>
  21 + <view class="item">
  22 + <view class="u-flex" style="margin-top: 28rpx;flex-direction: column;justify-content: space-between;">
  23 + <view style="text-align:center;line-height:30rpx;width: 100rpx;height: 40rpx;background-color: #377DFF;">
  24 + <text style="color: #FFFFFF;font-size: 11px;">{{ item.name3 }}</text>
  25 + </view>
  26 + <view style="text-align:center;line-height:30rpx;margin-top: 10rpx;width: 100rpx;height: 40rpx;background-color: #377DFF;">
  27 + <text style="color: #FFFFFF;font-size: 11px;">{{ item.name4 }}</text>
  28 + </view>
  29 + </view>
  30 + </view>
  31 + </view>
  32 + </view>
  33 + <view style="height: 20rpx;"></view>
  34 + <!-- 告警筛选 -->
  35 + <u-popup @close="close" closeable bgColor="transparent" :overlay="true" :show="show" mode="bottom">
  36 + <view style="height: 1100rpx;background:#FFFFFF;border-radius: 20rpx;overflow-y: scroll;">
  37 + <view style="text-align: center;position: relative;top: 68rpx;margin-top: -40rpx;"><text style="font-size: 16px;color: #333333;">筛选条件</text></view>
  38 + <view style="margin-top: 97rpx;margin-left: 43rpx;">
  39 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">告警状态</text></view>
  40 + <view
  41 + class="u-flex"
  42 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  43 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  44 + >
  45 + <view
  46 + v-for="(item, index) in alertStatus"
  47 + :key="index"
  48 + style="margin: 10rpx;line-height: 50rpx;text-align: center;
  49 + width:180rpx;height: 60rpx;
  50 + background-color:#F6F6F6;border-radius:32px"
  51 + >
  52 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  53 + </view>
  54 + </view>
  55 + </view>
  56 + <view style="margin-top: 145rpx;margin-left: 43rpx;">
  57 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">设备类型</text></view>
  58 + <view
  59 + class="u-flex"
  60 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  61 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  62 + >
  63 + <view
  64 + v-for="(item, index) in deviceType"
  65 + :key="index"
  66 + style="margin: 10rpx;line-height: 50rpx;text-align: center;
  67 + width:180rpx;height: 60rpx;
  68 + background-color:#F6F6F6;border-radius:32px"
  69 + >
  70 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  71 + </view>
  72 + </view>
  73 + </view>
  74 + <view style="margin-top: 136rpx;margin-left: 43rpx;">
  75 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">告警等级</text></view>
  76 + <view
  77 + class="u-flex"
  78 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  79 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  80 + >
  81 + <view
  82 + v-for="(item, index) in alertLevel"
  83 + :key="index"
  84 + style="margin: 10rpx;line-height: 50rpx;text-align: center;
  85 + width:180rpx;height: 60rpx;
  86 + background-color:#F6F6F6;border-radius:32px"
  87 + >
  88 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  89 + </view>
  90 + </view>
  91 + </view>
  92 + <view style="margin-top: 136rpx;margin-left: 43rpx;">
  93 + <view style="width: 750rpx;margin-left: 14rpx;" class=""><text style="color: #333333;font-size: 14px;">选择时间</text></view>
  94 + <view
  95 + class="u-flex"
  96 + style="margin-top: 15rpx;width:650rpx;height: 60rpx;flex-direction: row;
  97 + flex-wrap: wrap;justify-content: space-between; align-content: space-between;"
  98 + >
  99 + <view
  100 + v-for="(item, index) in timeArea"
  101 + :key="index"
  102 + style="margin: 10rpx;line-height: 50rpx;text-align: center;
  103 + width:180rpx;height: 60rpx;
  104 + background-color:#F6F6F6;border-radius:32px"
  105 + >
  106 + <text style="color:#333333;font-size: 13px;">{{ item.name }}</text>
  107 + </view>
  108 + </view>
  109 + </view>
  110 + <view style="margin-top: 136rpx;margin-left: 43rpx;">
  111 + <view class="u-flex" style="margin-left: 10rpx;margin-top: 15rpx;width:750rpx;height: 60rpx;flex-direction: row;">
  112 + <u--form labelPosition="left" :model="timeData" :rules="rules" ref="form1" style="padding-left: 26rpx;width: 617rpx!important;">
  113 + <u-form-item
  114 + style="font-size: 14px;"
  115 + label="选择日期"
  116 + prop="selectTime"
  117 + labelWidth="80"
  118 + borderBottom
  119 + @click="
  120 + showCalendar = true;
  121 + hideKeyboard();
  122 + "
  123 + >
  124 + <u--input v-model="timeData.selectTime" placeholder="请选择日期" border="none"></u--input>
  125 + </u-form-item>
  126 + </u--form>
  127 + </view>
  128 + </view>
  129 + <view class="u-flex" style="flex-direction: row;margin-top: 128rpx;margin-left: 55rpx;">
  130 + <view style="width: 300rpx"><u-button type="info" shape="circle" text="重置"></u-button></view>
  131 + <view style="width: 300rpx;margin-left:46rpx ;"><u-button type="primary" shape="circle" text="确认"></u-button></view>
  132 + </view>
  133 + <view style="height: 30rpx;"></view>
  134 + </view>
  135 + </u-popup>
  136 + <u-calendar
  137 + :show="showCalendar"
  138 + mode="range"
  139 + @confirm="calendarConfirm"
  140 + @close="calendarClose"
  141 + startText="开始时间"
  142 + endText="结束时间"
  143 + confirmDisabledText="请选择日期"
  144 + :formatter="formatter"
  145 + ></u-calendar>
  146 + <f-tabbar></f-tabbar>
  147 + </view>
  148 +</template>
  149 +
  150 +<script>
  151 +import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  152 +
  153 +export default {
  154 + components: {
  155 + fTabbar
  156 + },
  157 + data() {
  158 + return {
  159 + show: false,
  160 + timeData: {
  161 + selectTime: '',
  162 + getTimeGap: ''
  163 + },
  164 + showCalendar: false,
  165 + show: false,
  166 + alertStatus: [
  167 + {
  168 + index: 1,
  169 + name: '全部',
  170 + bgColor: '#377DFF',
  171 + textColor: '#377DFF'
  172 + },
  173 + {
  174 + index: 2,
  175 + name: '激活未确认',
  176 + bgColor: '#F6F6F6',
  177 + textColor: '#F6F6F6'
  178 + },
  179 + {
  180 + index: 3,
  181 + name: '激活已确认',
  182 + bgColor: '#F6F6F6',
  183 + textColor: '#F6F6F6'
  184 + },
  185 + {
  186 + index: 4,
  187 + name: '清除未确认',
  188 + bgColor: '#F6F6F6',
  189 + textColor: '#F6F6F6'
  190 + },
  191 + {
  192 + index: 5,
  193 + name: '清除已确认',
  194 + bgColor: '#F6F6F6',
  195 + textColor: '#F6F6F6'
  196 + },
  197 + {
  198 + index: 6,
  199 + name: '清除已确认',
  200 + bgColor: '#F6F6F6',
  201 + textColor: '#F6F6F6'
  202 + }
  203 + ],
  204 + deviceType: [
  205 + {
  206 + index: 1,
  207 + name: '全部',
  208 + bgColor: '#377DFF',
  209 + textColor: '#377DFF'
  210 + },
  211 + {
  212 + index: 2,
  213 + name: '网关设备',
  214 + bgColor: '#F6F6F6',
  215 + textColor: '#F6F6F6'
  216 + },
  217 + {
  218 + index: 3,
  219 + name: '网关子设备',
  220 + bgColor: '#F6F6F6',
  221 + textColor: '#F6F6F6'
  222 + },
  223 + {
  224 + index: 4,
  225 + name: '直连设备',
  226 + bgColor: '#F6F6F6',
  227 + textColor: '#F6F6F6'
  228 + }
  229 + ],
  230 + alertLevel: [
  231 + {
  232 + index: 1,
  233 + name: '全部',
  234 + bgColor: '#377DFF',
  235 + textColor: '#377DFF'
  236 + },
  237 + {
  238 + index: 2,
  239 + name: '危险',
  240 + bgColor: '#F6F6F6',
  241 + textColor: '#F6F6F6'
  242 + },
  243 + {
  244 + index: 3,
  245 + name: '重要',
  246 + bgColor: '#F6F6F6',
  247 + textColor: '#F6F6F6'
  248 + },
  249 + {
  250 + index: 4,
  251 + name: '次要',
  252 + bgColor: '#F6F6F6',
  253 + textColor: '#F6F6F6'
  254 + },
  255 + {
  256 + index: 4,
  257 + name: '警告',
  258 + bgColor: '#F6F6F6',
  259 + textColor: '#F6F6F6'
  260 + },
  261 + {
  262 + index: 4,
  263 + name: '不确定',
  264 + bgColor: '#F6F6F6',
  265 + textColor: '#F6F6F6'
  266 + }
  267 + ],
  268 + timeArea: [
  269 + {
  270 + index: 1,
  271 + name: '全部',
  272 + value: '全部',
  273 + bgColor: '#F6F6F6',
  274 + textColor: '#F6F6F6'
  275 + },
  276 + {
  277 + index: 2,
  278 + name: '30分钟',
  279 + value: '30',
  280 + bgColor: '#F6F6F6',
  281 + textColor: '#F6F6F6'
  282 + },
  283 + {
  284 + index: 3,
  285 + name: '1小时',
  286 + value: '30',
  287 + bgColor: '#F6F6F6',
  288 + textColor: '#F6F6F6'
  289 + },
  290 + {
  291 + index: 4,
  292 + name: '2小时',
  293 + value: '120',
  294 + bgColor: '#F6F6F6',
  295 + textColor: '#F6F6F6'
  296 + },
  297 + {
  298 + index: 5,
  299 + name: '近一天',
  300 + value: '24',
  301 + bgColor: '#F6F6F6',
  302 + textColor: '#F6F6F6'
  303 + },
  304 + {
  305 + index: 6,
  306 + name: '',
  307 + value: '',
  308 + bgColor: '#F6F6F6',
  309 + textColor: '#F6F6F6'
  310 + }
  311 + ],
  312 + list: [
  313 + {
  314 + name1: '1号楼1楼三单元水表',
  315 + name2: '下发命令:MQTT命令',
  316 + time: '2022-04-01 02:12:23',
  317 + id: 'xx1',
  318 + name3: '下发成功',
  319 + name4: '响应成功'
  320 + },
  321 + {
  322 + name1: '1号楼1楼三单元水表',
  323 + name2: '下发命令:MQTT命令',
  324 + time: '2022-04-01 02:12:23',
  325 + id: 'xx1',
  326 + name3: '下发成功',
  327 + name4: '响应成功'
  328 + },
  329 + {
  330 + name1: '1号楼1楼三单元水表',
  331 + name2: '下发命令:MQTT命令',
  332 + time: '2022-04-01 02:12:23',
  333 + id: 'xx1',
  334 + name3: '下发成功',
  335 + name4: '响应成功'
  336 + },
  337 + {
  338 + name1: '1号楼1楼三单元水表',
  339 + name2: '下发命令:MQTT命令',
  340 + time: '2022-04-01 02:12:23',
  341 + id: 'xx1',
  342 + name3: '下发成功',
  343 + name4: '响应成功'
  344 + },
  345 + {
  346 + name1: '1号楼1楼三单元水表',
  347 + name2: '下发命令:MQTT命令',
  348 + time: '2022-04-01 02:12:23',
  349 + id: 'xx1',
  350 + name3: '下发成功',
  351 + name4: '响应成功'
  352 + }
  353 + ]
  354 + };
  355 + },
  356 + onLoad(e) {
  357 + // 隐藏原生的tabbar
  358 + uni.hideTabBar();
  359 + },
  360 + methods: {
  361 + open() {},
  362 + close() {
  363 + this.show = false;
  364 + },
  365 + openSearchDialog() {
  366 + this.show = true;
  367 + },
  368 + hideKeyboard() {
  369 + uni.hideKeyboard();
  370 + },
  371 + calendarConfirm(e) {
  372 + this.showCalendar = false;
  373 + this.timeData.selectTime = `${e[0]} / ${e[e.length - 1]}`;
  374 + },
  375 + calendarClose() {
  376 + this.showCalendar = false;
  377 + }
  378 + }
  379 +};
  380 +</script>
  381 +
  382 +<style lang="scss" scoped>
  383 +.alert-page {
  384 + margin-top: 5rpx;
  385 +}
  386 +.device-list {
  387 + display: flex;
  388 + flex-direction: column;
  389 + padding-left: 18rpx;
  390 + .list-item {
  391 + width: 713rpx;
  392 + height: 233rpx;
  393 + background-color: #fff;
  394 + margin-top: 24rpx;
  395 + display: flex;
  396 + flex-direction: row;
  397 + border-radius: 10px;
  398 + justify-content: space-between;
  399 + .item {
  400 + margin: 30rpx;
  401 + }
  402 + }
  403 +}
  404 +</style>
  1 +<template>
  2 + <view class="history-page">
  3 + <!-- 公共组件-每个页面必须引入 -->
  4 + <public-module></public-module>
  5 + <view class="form-style" style="width: 700rpx;height: 800rpx;background-color: #fff;">
  6 + <u-form :label-style="{ 'font-size': '0rpx' }" style="padding-left: 26rpx;">
  7 + <u-form-item
  8 + label="."
  9 + prop="selectTime"
  10 + @click="
  11 + showCalendar = true;
  12 + hideKeyboard();
  13 + "
  14 + >
  15 + <view class="u-flex" style="flex-direction: row;">
  16 + <view style="margin-left: -63rpx;"><image style="width: 30rpx;height: 30rpx;" src="../../../static/can-der.png" mode=""></image></view>
  17 + <view style="margin-left: 23rpx;">
  18 + <u--input v-model="timeData.selectTime" disabled disabledColor="#ffffff" placeholder="请选择日期" border="none"></u--input>
  19 + </view>
  20 + </view>
  21 + </u-form-item>
  22 + <u-form-item label="." prop="getTimeGap" @click="openTimeGap">
  23 + <view class="u-flex" style="flex-direction: row;">
  24 + <view style="margin-left: -63rpx;"><image style="width: 30rpx;height: 30rpx;" src="../../../static/time.png" mode=""></image></view>
  25 + <view style="margin-left: 23rpx;">
  26 + <u--input v-model="timeData.getTimeGap" disabled disabledColor="#ffffff" placeholder="请选择时间区间" border="none"></u--input>
  27 + </view>
  28 + </view>
  29 + </u-form-item>
  30 + <u-form-item label="." prop="getType" @click="openOther">
  31 + <u--input v-model="timeData.getType" disabled disabledColor="#ffffff" placeholder="请选择类型" border="none"></u--input>
  32 + <!-- <view style="width: 638rpx;height: 50rpx;border-radius: 40px;background-color: #377DFF;border:1px solid #377DFF;margin-left:-60rpx">
  33 + <u--input v-model="timeData.getType" disabled disabledColor="#ffffff" placeholder="请选择类型" border="none"></u--input>
  34 + </view> -->
  35 + </u-form-item>
  36 + </u-form>
  37 + <view class="charts-box"><qiun-data-charts type="column" :chartData="chartData" /></view>
  38 + </view>
  39 + <view style="border-radius: 20px;margin-top: 30rpx;width: 700rpx;height: 700rpx;background-color: #fff;">
  40 + <u-list @scrolltolower="scrolltolower">
  41 + <u-list-item v-for="(item, index) in indexList" :key="index"><u-cell :value="item.value" :title="item.name"></u-cell></u-list-item>
  42 + </u-list>
  43 + </view>
  44 + <u-calendar
  45 + :show="showCalendar"
  46 + mode="range"
  47 + @confirm="calendarConfirm"
  48 + @close="calendarClose"
  49 + startText="开始时间"
  50 + endText="结束时间"
  51 + confirmDisabledText="请选择日期"
  52 + :formatter="formatter"
  53 + ></u-calendar>
  54 + <u-picker @confirm="confirmTimeGap" :show="showTimeGap" :columns="columns" keyName="label"></u-picker>
  55 + <u-picker @confirm="confirmOtherGap" :show="showOtherType" :columns="columnOther" keyName="label"></u-picker>
  56 + <f-tabbar></f-tabbar>
  57 + </view>
  58 +</template>
  59 +
  60 +<script>
  61 +import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  62 +export default {
  63 + components: {
  64 + fTabbar
  65 + },
  66 + data() {
  67 + return {
  68 + indexList: [
  69 + {
  70 + name: '变量值',
  71 + value: '更新时间'
  72 + },
  73 + {
  74 + name: '1',
  75 + value: '2022-03-01 18:16:33'
  76 + },
  77 + {
  78 + name: '69',
  79 + value: '2022-03-01 18:16:33'
  80 + },
  81 + {
  82 + name: '12',
  83 + value: '2022-03-01 18:16:33'
  84 + },
  85 + {
  86 + name: '49',
  87 + value: '2022-03-01 18:16:33'
  88 + },
  89 + {
  90 + name: '95',
  91 + value: '2022-03-01 18:16:33'
  92 + },
  93 + {
  94 + name: '95',
  95 + value: '2022-03-01 18:16:33'
  96 + }
  97 + ],
  98 + chartData: {
  99 + categories: ['2016', '2017', '2018', '2019', '2020', '2021'],
  100 + series: [
  101 + {
  102 + name: '目标值',
  103 + data: [35, 36, 31, 33, 13, 34]
  104 + },
  105 + {
  106 + name: '完成量',
  107 + data: [18, 27, 21, 24, 6, 28]
  108 + }
  109 + ]
  110 + },
  111 + showTimeGap: false,
  112 + showOtherType: false,
  113 + showCalendar: false,
  114 + timeData: {
  115 + selectTime: '',
  116 + getTimeGap: '',
  117 + getType: ''
  118 + },
  119 + columnOther: [
  120 + [
  121 + {
  122 + label: 'CO2',
  123 + id: 1
  124 + },
  125 + {
  126 + label: 'PH',
  127 + id: 2
  128 + }
  129 + ]
  130 + ],
  131 + columns: [
  132 + [
  133 + {
  134 + label: '5分钟',
  135 + id: 5
  136 + },
  137 + {
  138 + label: '10分钟',
  139 + id: 10
  140 + },
  141 + {
  142 + label: '15分钟',
  143 + id: 15
  144 + },
  145 + {
  146 + label: '30分钟',
  147 + id: 30
  148 + },
  149 + {
  150 + label: '1个小时',
  151 + id: 60
  152 + },
  153 + {
  154 + label: '2个小时',
  155 + id: 120
  156 + },
  157 + {
  158 + label: '6个小时',
  159 + id: 360
  160 + }
  161 + ]
  162 + ]
  163 + };
  164 + },
  165 + onLoad(e) {
  166 + // 隐藏原生的tabbar
  167 + uni.hideTabBar();
  168 + },
  169 + methods: {
  170 + hideKeyboard() {
  171 + uni.hideKeyboard();
  172 + },
  173 + calendarConfirm(e) {
  174 + this.showCalendar = false;
  175 + this.timeData.selectTime = `${e[0]} / ${e[e.length - 1]}`;
  176 + },
  177 + calendarClose() {
  178 + this.showCalendar = false;
  179 + },
  180 + openTimeGap() {
  181 + this.showTimeGap = true;
  182 + },
  183 + openOther() {
  184 + this.showOtherType = true;
  185 + },
  186 + confirmTimeGap(e) {
  187 + this.timeData.getTimeGap = e.value[0].label;
  188 + this.showTimeGap = false;
  189 + },
  190 + confirmOtherGap(e) {
  191 + this.timeData.getType = e.value[0].label;
  192 + this.showOtherType = false;
  193 + }
  194 + }
  195 +};
  196 +</script>
  197 +
  198 +<style lang="scss" scoped>
  199 +.history-page {
  200 + padding-top: -12rpx;
  201 + padding-left: 23rpx;
  202 +}
  203 +.charts-box {
  204 + width: 100%;
  205 + height: 600rpx;
  206 +}
  207 +.form-style {
  208 + /deep/.u-form {
  209 + .u-form-item {
  210 + margin-left: -57rpx !important;
  211 + }
  212 + }
  213 +}
  214 +</style>
  1 +<template>
  2 + <view class="realtime-page">
  3 + <!-- 公共组件-每个页面必须引入 -->
  4 + <public-module></public-module>
  5 + <view class="u-flex" style="margin-top: -44rpx;flex-direction: column;justify-content: space-between; align-content: space-between;">
  6 + <view
  7 + class="u-flex"
  8 + v-for="(item, index) in list"
  9 + :key="index"
  10 + style="border-radius: 20px;flex-direction: row;justify-content: space-between;margin: 15rpx;
  11 + background-color: #fff;height: 200rpx;width: 698rpx;"
  12 + >
  13 + <view style="margin: 20rpx;">
  14 + <view style="margin-top: 4rpx;">
  15 + <text style="color:#333333;font-size: 16px;">{{ item.name }}</text>
  16 + </view>
  17 + <view style="margin-top: 14rpx;">
  18 + <text style="color:#999999;font-size: 13px;">{{ item.time }}</text>
  19 + </view>
  20 + </view>
  21 + <view style="margin-right: 30rpx;margin-top: -58rpx;">
  22 + <text style="color:#333333;font-size: 17px;">{{ item.value }}</text>
  23 + </view>
  24 + </view>
  25 + </view>
  26 + <f-tabbar></f-tabbar>
  27 + </view>
  28 +</template>
  29 +
  30 +<script>
  31 +import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  32 +export default {
  33 + components: {
  34 + fTabbar
  35 + },
  36 + data() {
  37 + return {
  38 + list: [
  39 + {
  40 + name: 'CO2',
  41 + time: '2021-12-25 14:25:52',
  42 + value: '85.6'
  43 + },
  44 + {
  45 + name: 'PH',
  46 + time: '2021-12-25 14:25:52',
  47 + value: '10'
  48 + },
  49 + {
  50 + name: 'NH3',
  51 + time: '2021-12-25 14:25:52',
  52 + value: '635'
  53 + },
  54 + {
  55 + name: '水深',
  56 + time: '2021-12-25 14:25:52',
  57 + value: '2.21'
  58 + }
  59 + ]
  60 + };
  61 + },
  62 + onLoad(e) {
  63 + // 隐藏原生的tabbar
  64 + uni.hideTabBar();
  65 + }
  66 +};
  67 +</script>
  68 +
  69 +<style lang="scss" scoped>
  70 +.realtime-page {
  71 + padding: 20rpx;
  72 +}
  73 +</style>
@@ -4,10 +4,10 @@ @@ -4,10 +4,10 @@
4 <public-module></public-module> 4 <public-module></public-module>
5 <view class="form-page"> 5 <view class="form-page">
6 <u--form labelPosition="left" :model="feedbackData" :rules="rules" ref="form1"> 6 <u--form labelPosition="left" :model="feedbackData" :rules="rules" ref="form1">
7 - <u-form-item label="主题" prop="userInfo.name" borderBottom ref="item1"> 7 + <u-form-item required label="主题" prop="userInfo.name" borderBottom ref="item1">
8 <u--input placeholder="请输入主题" v-model="feedbackData.userInfo.name" border="none"></u--input> 8 <u--input placeholder="请输入主题" v-model="feedbackData.userInfo.name" border="none"></u--input>
9 </u-form-item> 9 </u-form-item>
10 - <u-form-item label="姓名" prop="userInfo.name" borderBottom ref="item1"> 10 + <u-form-item required label="姓名" prop="userInfo.name" borderBottom ref="item1">
11 <u--input placeholder="请输入姓名" v-model="feedbackData.userInfo.name" border="none"></u--input> 11 <u--input placeholder="请输入姓名" v-model="feedbackData.userInfo.name" border="none"></u--input>
12 </u-form-item> 12 </u-form-item>
13 <u-form-item label="手机" prop="userInfo.name" borderBottom ref="item1"> 13 <u-form-item label="手机" prop="userInfo.name" borderBottom ref="item1">
@@ -26,7 +26,7 @@ @@ -26,7 +26,7 @@
26 <u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple :maxCount="6"></u-upload> 26 <u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple :maxCount="6"></u-upload>
27 </u-form-item> 27 </u-form-item>
28 <u-form-item label="反馈" prop="userInfo.name" borderBottom ref="item1"> 28 <u-form-item label="反馈" prop="userInfo.name" borderBottom ref="item1">
29 - <u--textarea placeholder="不低于3个字" v-model="feedbackData.intro" count></u--textarea> 29 + <u--textarea placeholder="请输入反馈信息" v-model="feedbackData.intro" count></u--textarea>
30 </u-form-item> 30 </u-form-item>
31 </u--form> 31 </u--form>
32 <u-button class="buttonSty" shape="circle" type="primary" text="提交" customStyle="margin-top: 17rpx" @click="submit"></u-button> 32 <u-button class="buttonSty" shape="circle" type="primary" text="提交" customStyle="margin-top: 17rpx" @click="submit"></u-button>
@@ -37,6 +37,7 @@ @@ -37,6 +37,7 @@
37 <view style="height: 72rpx;"></view> 37 <view style="height: 72rpx;"></view>
38 <!-- #endif --> 38 <!-- #endif -->
39 </view> 39 </view>
  40 + <view style="height: 20rpx;"></view>
40 <f-tabbar></f-tabbar> 41 <f-tabbar></f-tabbar>
41 </view> 42 </view>
42 </template> 43 </template>
@@ -119,9 +120,16 @@ export default { @@ -119,9 +120,16 @@ export default {
119 <style lang="scss" scoped> 120 <style lang="scss" scoped>
120 .feedback-page { 121 .feedback-page {
121 min-height: 100vh; 122 min-height: 100vh;
122 - background-color: #fff; 123 + background-color: #f8f9fa;
  124 + padding-top: 9rpx;
  125 + padding-left: 27rpx;
123 } 126 }
124 .form-page { 127 .form-page {
  128 + width: 700rpx;
  129 + background-color: #ffffff;
  130 + border-radius: 20px;
  131 + margin-top: 20rpx;
  132 + padding-left: 15rpx;
125 padding: 0 20rpx; 133 padding: 0 20rpx;
126 } 134 }
127 //#ifndef MP 135 //#ifndef MP
@@ -2,7 +2,20 @@ @@ -2,7 +2,20 @@
2 <view class="camera-page"> 2 <view class="camera-page">
3 <!-- 公共组件-每个页面必须引入 --> 3 <!-- 公共组件-每个页面必须引入 -->
4 <public-module></public-module> 4 <public-module></public-module>
5 - <view class="camera-item"><text>设备</text></view> 5 + <view class="org-sty">
  6 + <view class="org-item">
  7 + <view class="u-flex" style="flex-direction: row;margin-top: 26rpx;margin-left: 15rpx;">
  8 + <text style="color:#333333;font-size: 15px;margin-left: 14rpx;">组织关系</text>
  9 + </view>
  10 + <view style="margin-top: 5rpx;margin-left: 15rpx;flex-direction: row;" class="u-flex">
  11 + <image style="margin-left: 14rpx;width: 30rpx;height: 30rpx;" src="../../../static/org.png" mode=""></image>
  12 + <text style="margin-left: 10rpx;color:#666666;font-size: 12px;">设备数:1234</text>
  13 + </view>
  14 + </view>
  15 + <view class="org-item" style="">
  16 + <image @click="openOrg" style="width: 6px;height: 10px;float: right; margin-right: 34rpx; margin-top: 58rpx;" src="../../../static/right-arrow.png" mode=""></image>
  17 + </view>
  18 + </view>
6 <view class="camera-container"> 19 <view class="camera-container">
7 <view class="container-item"> 20 <view class="container-item">
8 <view @click="openCameraDetail(item.url)" v-for="(item, index) in list" :key="index" class="item"> 21 <view @click="openCameraDetail(item.url)" v-for="(item, index) in list" :key="index" class="item">
@@ -70,6 +83,19 @@ export default { @@ -70,6 +83,19 @@ export default {
70 min-height: 100vh; 83 min-height: 100vh;
71 background-color: #fff; 84 background-color: #fff;
72 } 85 }
  86 +.org-sty {
  87 + width: 750rpx;
  88 + height: 150rpx;
  89 + margin-top: 1rpx;
  90 + background-color: #fff;
  91 + display: flex;
  92 + flex-direction: row;
  93 + justify-content: space-between;
  94 + .org-item {
  95 + width: 350rpx;
  96 + height: 200rpx;
  97 + }
  98 +}
73 .camera-item { 99 .camera-item {
74 height: 200rpx; 100 height: 200rpx;
75 border: 0.1px solid gray; 101 border: 0.1px solid gray;
@@ -3,40 +3,6 @@ @@ -3,40 +3,6 @@
3 <!-- 公共组件-每个页面必须引入 --> 3 <!-- 公共组件-每个页面必须引入 -->
4 <public-module></public-module> 4 <public-module></public-module>
5 <view> 5 <view>
6 - <view class="grid-container">  
7 - <view class="grid-item">  
8 - <view class="item-center">  
9 - <view class="center"><image style="width: 100rpx;height: 100rpx;margin-top: 20rpx;" src="../../static/form.png" mode=""></image></view>  
10 - <view class="center" style="position:relative;left:-34rpx;text-align: center;font-size: 13px;line-height: 144rpx;">  
11 - <text style="font-size:13px;color:#333333">维修工单</text>  
12 - </view>  
13 - </view>  
14 - </view>  
15 - <view class="grid-item">  
16 - <view class="item-center">  
17 - <view class="center"><image style="width: 100rpx;height: 100rpx;margin-top: 20rpx;" src="../../static/camer.png" mode=""></image></view>  
18 - <view class="center" style="position:relative;left:-34rpx;text-align: center;font-size: 13px;line-height: 144rpx;">  
19 - <text @click="openCamera" style="font-size:13px;color:#333333">摄像头管理</text>  
20 - </view>  
21 - </view>  
22 - </view>  
23 - <view class="grid-item">  
24 - <view class="item-center">  
25 - <view class="center"><image style="width: 100rpx;height: 100rpx;margin-top: 20rpx;" src="../../static/device.png" mode=""></image></view>  
26 - <view class="center" style="position:relative;left:-34rpx;text-align: center;font-size: 13px;line-height: 144rpx;">  
27 - <text style="font-size:13px;color:#333333">设备接入</text>  
28 - </view>  
29 - </view>  
30 - </view>  
31 - <view class="grid-item">  
32 - <view class="item-center">  
33 - <view class="center"><image style="width: 100rpx;height: 100rpx;margin-top: 20rpx;" src="../../static/status.png" mode=""></image></view>  
34 - <view class="center" style="position:relative;left:-34rpx;text-align: center;font-size: 13px;line-height: 144rpx;">  
35 - <text @click="openOrgStatus" style="font-size:13px;color:#333333">组态</text>  
36 - </view>  
37 - </view>  
38 - </view>  
39 - </view>  
40 <!-- 基础统计 --> 6 <!-- 基础统计 -->
41 <view class="basic-sty"> 7 <view class="basic-sty">
42 <view class=""><text style="font-size: 15px;color:#333333">基础统计</text></view> 8 <view class=""><text style="font-size: 15px;color:#333333">基础统计</text></view>
@@ -83,6 +49,40 @@ @@ -83,6 +49,40 @@
83 </view> 49 </view>
84 </view> 50 </view>
85 </view> 51 </view>
  52 + <view class="grid-container">
  53 + <view class="grid-item">
  54 + <view class="item-center">
  55 + <view class="center"><image style="width: 100rpx;height: 100rpx;margin-top: 20rpx;" src="../../static/form.png" mode=""></image></view>
  56 + <view class="center" style="position:relative;left:-34rpx;text-align: center;font-size: 13px;line-height: 144rpx;">
  57 + <text style="font-size:13px;color:#333333">维修工单</text>
  58 + </view>
  59 + </view>
  60 + </view>
  61 + <view @click="openCamera" class="grid-item">
  62 + <view class="item-center">
  63 + <view class="center"><image style="width: 100rpx;height: 100rpx;margin-top: 20rpx;" src="../../static/camer.png" mode=""></image></view>
  64 + <view class="center" style="position:relative;left:-34rpx;text-align: center;font-size: 13px;line-height: 144rpx;">
  65 + <text style="font-size:13px;color:#333333">摄像头管理</text>
  66 + </view>
  67 + </view>
  68 + </view>
  69 + <view class="grid-item">
  70 + <view class="item-center">
  71 + <view class="center"><image style="width: 100rpx;height: 100rpx;margin-top: 20rpx;" src="../../static/device.png" mode=""></image></view>
  72 + <view class="center" style="position:relative;left:-34rpx;text-align: center;font-size: 13px;line-height: 144rpx;">
  73 + <text style="font-size:13px;color:#333333">设备接入</text>
  74 + </view>
  75 + </view>
  76 + </view>
  77 + <view @click="openOrgStatus" class="grid-item">
  78 + <view class="item-center">
  79 + <view class="center"><image style="width: 100rpx;height: 100rpx;margin-top: 20rpx;" src="../../static/status.png" mode=""></image></view>
  80 + <view class="center" style="position:relative;left:-34rpx;text-align: center;font-size: 13px;line-height: 144rpx;">
  81 + <text style="font-size:13px;color:#333333">组态</text>
  82 + </view>
  83 + </view>
  84 + </view>
  85 + </view>
86 </view> 86 </view>
87 <f-tabbar></f-tabbar> 87 <f-tabbar></f-tabbar>
88 </view> 88 </view>
@@ -129,6 +129,7 @@ export default { @@ -129,6 +129,7 @@ export default {
129 grid-template-columns: repeat(2, 350rpx); 129 grid-template-columns: repeat(2, 350rpx);
130 grid-template-rows: repeat(2, 200rpx); 130 grid-template-rows: repeat(2, 200rpx);
131 grid-gap: 20rpx; 131 grid-gap: 20rpx;
  132 + margin-top: 50rpx;
132 } 133 }
133 134
134 .grid-item { 135 .grid-item {
@@ -152,7 +153,7 @@ export default { @@ -152,7 +153,7 @@ export default {
152 } 153 }
153 .basic-sty { 154 .basic-sty {
154 padding: 0 10rpx; 155 padding: 0 10rpx;
155 - margin-top: 50rpx; 156 + // margin-top: 50rpx;
156 .basic { 157 .basic {
157 width: 750rpx; 158 width: 750rpx;
158 height: 500rpx; 159 height: 500rpx;
1 <template> 1 <template>
2 - <view class="content">  
3 - <text>组态</text>  
4 - <!-- 公共组件-每个页面必须引入 -->  
5 - <public-module></public-module>  
6 - <f-tabbar></f-tabbar> 2 + <view class="status-page">
  3 + <f-navbar navbarType="2" @leftClick="leftClick">
  4 + <view class="u-flex" slot="left" style="justify-content: space-between;flex-direction: row;">
  5 + <view style="width: 700rpx;"><u--input prefixIcon="search" placeholder="请输入组态名称" border="surround" shape="circle"></u--input></view>
  6 + </view>
  7 + </f-navbar>
  8 + <!-- 公共组件-每个页面必须引入 -->
  9 + <public-module></public-module>
  10 + <view class="status-container">
  11 + <view @click="openStatusDetail(item.id)" v-for="(item, index) in list" :key="index" class="status-item u-flex" style="flex-direction: column;justify-content: space-between;">
  12 + <view style="margin-top: 38rpx;"><image style="width: 198rpx;height: 119rpx;" :src="item.icon" mode=""></image></view>
  13 + <view style="position: relative;top: -25rpx;">
  14 + <text style="color: #333333;font-size: 14px;">{{ item.name }}</text>
  15 + </view>
  16 + </view>
  17 + </view>
  18 + <f-tabbar></f-tabbar>
7 </view> 19 </view>
8 </template> 20 </template>
9 21
10 <script> 22 <script>
11 import fTabbar from '@/components/module/f-tabbar/f-tabbar'; 23 import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  24 +import fNavbar from '@/components/module/f-navbar/f-navbar';
12 25
13 export default { 26 export default {
14 - components:{  
15 - fTabbar,  
16 - },  
17 - data() {  
18 - return {  
19 - }  
20 - },  
21 - onLoad() {  
22 - // 隐藏原生的tabbar  
23 - uni.hideTabBar();  
24 - },  
25 -  
26 -} 27 + components: {
  28 + fTabbar,
  29 + fNavbar
  30 + },
  31 + data() {
  32 + return {
  33 + list: [
  34 + {
  35 + id:1,
  36 + name: '智慧办公室1',
  37 + icon: '../../../static/test.png'
  38 + },
  39 + {
  40 + id:2,
  41 + name: '智慧办公室2',
  42 + icon: '../../../static/test.png'
  43 + },
  44 + ]
  45 + };
  46 + },
  47 + onLoad() {
  48 + // 隐藏原生的tabbar
  49 + uni.hideTabBar();
  50 + },
  51 + methods: {
  52 + leftClick() {
  53 + return false;
  54 + },
  55 + openStatusDetail(e){
  56 + console.log(e);
  57 + uni.navigateTo({
  58 + url:'statusDetail'
  59 + })
  60 + }
  61 + }
  62 +};
27 </script> 63 </script>
28 64
29 <style lang="scss" scoped> 65 <style lang="scss" scoped>
30 - 66 +.status-page {
  67 + padding: 15rpx 15rpx;
  68 +}
  69 +.status-container {
  70 + width: 700rpx;
  71 + height: 250rpx;
  72 + display: flex;
  73 + flex-wrap: wrap;
  74 + align-content: space-between;
  75 + justify-content: space-between;
  76 + flex-direction: row;
  77 + .status-item {
  78 + width: 300rpx;
  79 + height: 250rpx;
  80 + margin: 23rpx;
  81 + background-color: #ffffff;
  82 + border-radius: 20px;
  83 + }
  84 +}
31 </style> 85 </style>
  1 +<template>
  2 + <view class="content">
  3 + <!-- 公共组件-每个页面必须引入 -->
  4 + <public-module></public-module>
  5 + <f-tabbar :isFillHeight="false"></f-tabbar>
  6 + </view>
  7 +</template>
  8 +
  9 +<script>
  10 +import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  11 +export default {
  12 + components: {
  13 + fTabbar
  14 + },
  15 + data() {
  16 + return {};
  17 + },
  18 + onLoad(e) {
  19 + // 隐藏原生的tabbar
  20 + uni.hideTabBar();
  21 + }
  22 +};
  23 +</script>
  24 +
  25 +<style lang="scss" scoped></style>
  1 +<template>
  2 + <view>
  3 + <view class="head">
  4 + <view class="search_input">
  5 + <image src="../../static/img/search.png"></image>
  6 + <input type="text" placeholder="请输入想搜索的文章" />
  7 + </view>
  8 + </view>
  9 + <tab :lists="lists" :tab_color="tab_color" @switchover="switchover" :gauge="gauge"></tab>
  10 + <!-- 占位符 -->
  11 + <view style="width: 100%;height: 220rpx;"></view>
  12 + <view class="special">
  13 + <view class="special_list">
  14 + <view class="special_list_top">
  15 + <view class="left">
  16 + 标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题标题 标题标题标题
  17 + </view>
  18 + <view class="right">
  19 + <image src="../../static/img/banner.png"></image>
  20 + </view>
  21 + </view>
  22 + <view class="special_list_bottom">
  23 + <text>
  24 + 来源:法院法院法院
  25 + </text>
  26 + <text>
  27 + 2021-03-21 19:40
  28 + </text>
  29 +
  30 + </view>
  31 + </view>
  32 + </view>
  33 + </view>
  34 +</template>
  35 +
  36 +<script>
  37 + import Tab from '../../components/Tab.vue';
  38 + export default {
  39 + components:{
  40 + Tab
  41 + },
  42 + data() {
  43 + return {
  44 + //tab切换数组
  45 + lists:[
  46 + {id:1,name:'普法文章'},
  47 + {id:2,name:'测试数据1'},
  48 + {id:3,name:'测试数据测试数据'},
  49 + {id:4,name:'测试数据阿萨德'},
  50 + {id:5,name:'测试数据阿萨德'},
  51 + {id:6,name:'测试数据大声道'},
  52 + {id:7,name:'测试数据fff'},
  53 + {id:8,name:'测试数据1'},
  54 +
  55 + ],
  56 + //tab切换选中的颜色
  57 + tab_color:'#3b87f6',
  58 + // tab组件position: fixed布局距离头部的位置大小(rpx)
  59 + gauge:120
  60 + };
  61 + },
  62 + methods:{
  63 + switchover:function(id){
  64 + console.log(id)
  65 + }
  66 + }
  67 + }
  68 +</script>
  69 +
  70 +<style lang="scss">
  71 +
  72 + .head{
  73 + width: 100%;
  74 + height: 120rpx;
  75 + padding: 0rpx 30rpx;
  76 + box-sizing: border-box;
  77 + background: #3b87f6;
  78 + display: flex;
  79 + align-items: center;
  80 + position: fixed;
  81 + top: 0rpx;
  82 + z-index: 99;
  83 + .search_input {
  84 + width: 100%;
  85 + height: 60rpx;
  86 + background: #fff;
  87 + border-radius: 50rpx;
  88 + display: flex;
  89 + align-items: center;
  90 +
  91 + image {
  92 + width: 28rpx;
  93 + height: 28rpx;
  94 + margin-left: 26rpx;
  95 + }
  96 +
  97 + input {
  98 + font-size: 26rpx;
  99 + margin-left: 25rpx;
  100 + }
  101 + }
  102 + }
  103 + .special{
  104 + width: 100%;
  105 + padding: 0rpx 30rpx;
  106 + box-sizing: border-box;
  107 + .special_list{
  108 + width: 100%;
  109 + height: 270rpx;
  110 + border-bottom: 2rpx solid #e7e7e7;
  111 + padding: 40rpx 0rpx;
  112 + box-sizing: border-box;
  113 + .special_list_top{
  114 + display: flex;
  115 + justify-content: space-between;
  116 + .left{
  117 + width: 65%;
  118 + height: 140rpx;
  119 + line-height: 46rpx;
  120 + overflow : hidden;
  121 + text-overflow: ellipsis;
  122 + display: -webkit-box;
  123 + -webkit-line-clamp: 3;
  124 + -webkit-box-orient: vertical;
  125 + }
  126 + .right{
  127 + width: 30%;
  128 + height: 140rpx;
  129 + image{
  130 + width: 100%;
  131 + height: 100%;
  132 + }
  133 + }
  134 + }
  135 + .special_list_bottom{
  136 + width: 100%;
  137 + height: 100rpx;
  138 + line-height: 100rpx;
  139 + display: flex;
  140 + justify-content: space-between;
  141 + font-size: 24rpx;
  142 + color: #999999;
  143 + }
  144 + }
  145 + }
  146 +</style>
@@ -22,7 +22,13 @@ @@ -22,7 +22,13 @@
22 </view> 22 </view>
23 <view class="u-flex-1"> 23 <view class="u-flex-1">
24 <view @click="openLoginFunc" class="u-font-lg" style="color:black;font-weight: bold;">请点击登录</view> 24 <view @click="openLoginFunc" class="u-font-lg" style="color:black;font-weight: bold;">请点击登录</view>
25 - <view @click="clickAccountFunc" style="color:black;" class="detail">绑定账号</view> 25 + <view
  26 + @click="clickAccountFunc"
  27 + style="margin-top: 15rpx;text-align: center;border-radius: 22px;;background-color: #FFFFFF;width: 150rpx;height: 50rpx;"
  28 + class="detail"
  29 + >
  30 + <text style="color:#3388FF;font-size: 12px;">绑定账号</text>
  31 + </view>
26 </view> 32 </view>
27 </block> 33 </block>
28 <view><u-icon @click="openPersonalInfo" name="arrow-right" color="black" size="13"></u-icon></view> 34 <view><u-icon @click="openPersonalInfo" name="arrow-right" color="black" size="13"></u-icon></view>
@@ -52,61 +58,90 @@ @@ -52,61 +58,90 @@
52 </view> 58 </view>
53 <!-- #endif --> 59 <!-- #endif -->
54 </view> 60 </view>
55 - <view style="height: 50rpx;"></view>  
56 - <view class="cell-group">  
57 - <view  
58 - class="cell-item u-flex"  
59 - @click="onJump(item.url)"  
60 - :style="[{ animation: 'show ' + ((index + 1) * 0.2 + 0.2) + 's' }]"  
61 - v-for="(item, index) in list"  
62 - :key="index"  
63 - >  
64 - <u-icon :name="item.icon" size="14" color="#333"></u-icon>  
65 - <view class="title u-flex-m">{{ item.title }}</view>  
66 - <u-icon name="arrow-right" size="14" color="#333"></u-icon> 61 + <view
  62 + class="u-flex"
  63 + style="position: relative;top:-25rpx;z-index:54;background: #FFFFFF;;border-radius: 17px 17px 0px 0px;;height: 750rpx;width: 750rpx;flex-direction: column;justify-content: space-between;"
  64 + >
  65 + <view style="margin-top: 100rpx;">
  66 + <view @click="openSysNotify" class="u-flex" style="flex-direction: row;justify-content: space-between;align-content: space-between;">
  67 + <view style="width: 125rpx;"><image style="width:35rpx;height: 35rpx;" src="../../static/sys-not.png" mode=""></image></view>
  68 + <view style="position: relative;left: -58rpx;width: 420rpx;"><text style="color: #333333;font-size: 15px;">系统通知</text></view>
  69 + <view style="position: relative;right: -112rpx;width: 100rpx;">
  70 + <image style="width: 13rpx;height: 17rpx;" src="../../static/arrow-right.png" mode=""></image>
  71 + </view>
  72 + </view>
  73 + <view @click="openFeedBack" class="u-flex" style="margin-top: 60rpx;flex-direction: row;justify-content: space-between;align-content: space-between;">
  74 + <view style="width: 125rpx;"><image style="width:35rpx;height: 35rpx;" src="../../static/find-sugg.png" mode=""></image></view>
  75 + <view style="position: relative;left: -58rpx;width: 420rpx;"><text style="color: #333333;font-size: 15px;">意见反馈</text></view>
  76 + <view style="position: relative;right: -112rpx;width: 100rpx;">
  77 + <image style="width: 13rpx;height: 17rpx;" src="../../static/arrow-right.png" mode=""></image>
  78 + </view>
  79 + </view>
67 </view> 80 </view>
  81 + <view class="u-flex" style="justify-content: center;width: 600rpx;"><u-button @click="onLoginoutFunc" type="primary" shape="circle" text="退出账号"></u-button></view>
68 </view> 82 </view>
69 - <view class="u-flex" style="justify-content: center;">  
70 - <button class="submit" size="default" @click="onLoginoutFunc" :style="{ background: PrimaryButtonColor }">退出账号</button>  
71 - </view> 83 + <f-tabbar></f-tabbar>
72 <!-- 绑定账号 --> 84 <!-- 绑定账号 -->
73 <view> 85 <view>
74 - <u-modal confirmText="绑定账号" @confirm="bindConfirm" :show="show" :title="title"> 86 + <u-modal :showConfirmButton="false" :show="show" :title="title">
75 <view v-if="!bindPhone" class="loginPhone"> 87 <view v-if="!bindPhone" class="loginPhone">
76 - <view class="form-row">  
77 - <u--input class="input" prefixIcon="account-fill" type="text" placeholder="登录账号" border="surround" v-model="account"></u--input> 88 + <view class="form-row" style="background:#F7F9FF;border-radius: 48px;width: 532rpx;height: 80rpx;border: 0.01rpx solid #F7F9FF;">
  89 + <u--input border="surround" shape="circle" class="input" prefixIcon="account-fill" type="text" placeholder="登录账号" v-model="account"></u--input>
78 </view> 90 </view>
79 - <view class="form-row"> 91 + <view class="form-row" style="margin-top: 20rpx;background: #F7F9FF;border-radius: 48px;width: 532rpx;height: 80rpx;border: 0.01rpx solid #F7F9FF;">
80 <u--input 92 <u--input
81 class="input" 93 class="input"
  94 + border="surround"
  95 + shape="circle"
82 prefixIcon="lock-fill" 96 prefixIcon="lock-fill"
83 :suffixIcon="showPasswordIcon" 97 :suffixIcon="showPasswordIcon"
84 suffixIconStyle="color: #909399" 98 suffixIconStyle="color: #909399"
85 type="password" 99 type="password"
86 placeholder="登录密码" 100 placeholder="登录密码"
87 - border="surround"  
88 v-model="password" 101 v-model="password"
89 @change="passwordChange" 102 @change="passwordChange"
90 ></u--input> 103 ></u--input>
91 </view> 104 </view>
92 - <view class="u-flex" style="flex-direction: row;margin-top: 20rpx;justify-content: space-between;"> 105 + <view class="u-flex" style="flex-direction: row;margin-top: 20rpx;">
93 <view style="visibility: hidden;">手机验证码登录</view> 106 <view style="visibility: hidden;">手机验证码登录</view>
94 <view style="color: #0079fe;font-size: 14px;" @click="bindPhoneFunc">手机绑定</view> 107 <view style="color: #0079fe;font-size: 14px;" @click="bindPhoneFunc">手机绑定</view>
95 </view> 108 </view>
96 </view> 109 </view>
97 <view v-else class="loginPhone"> 110 <view v-else class="loginPhone">
98 - <view class="form-row">  
99 - <u--input class="input" type="text" v-model="phone" placeholder="请输入手机号码" placeholder-style="font-weight:normal;color:#bbbbbb;"></u--input> 111 + <view class="form-row" style="background:#F7F9FF;border-radius: 48px;width: 532rpx;height: 80rpx;border: 0.01rpx solid #F7F9FF;">
  112 + <u--input
  113 + border="surround"
  114 + shape="circle"
  115 + class="input"
  116 + type="text"
  117 + v-model="phone"
  118 + placeholder="请输入手机号码"
  119 + placeholder-style="font-weight:normal;color:#bbbbbb;"
  120 + ></u--input>
100 </view> 121 </view>
101 - <view class="form-row">  
102 - <u--input class="input" type="text" v-model="vCode" placeholder="请输入验证码" placeholder-style="font-weight:normal;color:#bbbbbb;"></u--input>  
103 - <view class="getvcode" :class="{ forhidden: readonly }" @click="getVcode">{{ codeText }}</view> 122 + <view class="form-row" style="margin-top: 20rpx;background:#F7F9FF;border-radius: 48px;width: 532rpx;height: 80rpx;border: 0.01rpx solid #F7F9FF;">
  123 + <u--input
  124 + border="surround"
  125 + shape="circle"
  126 + class="input"
  127 + type="text"
  128 + v-model="vCode"
  129 + placeholder="请输入验证码"
  130 + placeholder-style="font-weight:normal;color:#bbbbbb;"
  131 + ></u--input>
  132 + <view style="color:#377DFF" class="getvcode" :class="{ forhidden: readonly }" @click="getVcode">{{ codeText }}</view>
104 </view> 133 </view>
105 - <view class="u-flex" style="flex-direction: row;margin-top: 20rpx;justify-content: space-between;"> 134 + <view class="u-flex" style="flex-direction: row;margin-top: 20rpx;">
106 <view style="visibility: hidden;">手机验证码登录</view> 135 <view style="visibility: hidden;">手机验证码登录</view>
107 <view style="color: #0079fe;font-size: 14px;" @click="bindAccountFunc">账号绑定</view> 136 <view style="color: #0079fe;font-size: 14px;" @click="bindAccountFunc">账号绑定</view>
108 </view> 137 </view>
109 </view> 138 </view>
  139 + <view class="">
  140 + <view class="u-flex" style="flex-direction: row;margin-top: 288rpx;margin-left: -538rpx;">
  141 + <view style="width: 230rpx"><u-button @click="show = false" type="info" shape="circle" text="取消"></u-button></view>
  142 + <view style="width: 230rpx;margin-left: 65rpx;"><u-button @click="bindConfirm" type="primary" shape="circle" text="确认"></u-button></view>
  143 + </view>
  144 + </view>
110 </u-modal> 145 </u-modal>
111 </view> 146 </view>
112 <!-- 退出登录 --> 147 <!-- 退出登录 -->
@@ -123,7 +158,6 @@ @@ -123,7 +158,6 @@
123 </view> 158 </view>
124 </u-popup> 159 </u-popup>
125 </view> 160 </view>
126 - <f-tabbar></f-tabbar>  
127 </view> 161 </view>
128 </template> 162 </template>
129 163
@@ -174,6 +208,16 @@ export default { @@ -174,6 +208,16 @@ export default {
174 ...mapState(['userInfo']) 208 ...mapState(['userInfo'])
175 }, 209 },
176 methods: { 210 methods: {
  211 + openSysNotify() {
  212 + uni.navigateTo({
  213 + url: '../systemNotify/systemNotify'
  214 + });
  215 + },
  216 + openFeedBack() {
  217 + uni.navigateTo({
  218 + url: '../feedback/feedback'
  219 + });
  220 + },
177 onJump(url) { 221 onJump(url) {
178 uni.navigateTo({ 222 uni.navigateTo({
179 url: url 223 url: url
@@ -192,9 +236,7 @@ export default { @@ -192,9 +236,7 @@ export default {
192 clickAccountFunc() { 236 clickAccountFunc() {
193 this.show = true; 237 this.show = true;
194 }, 238 },
195 - bindConfirm() {  
196 - this.show = false;  
197 - }, 239 + bindConfirm() {},
198 bindPhoneFunc() { 240 bindPhoneFunc() {
199 this.bindPhone = true; 241 this.bindPhone = true;
200 }, 242 },
@@ -259,8 +301,11 @@ export default { @@ -259,8 +301,11 @@ export default {
259 </script> 301 </script>
260 302
261 <style lang="scss" scoped> 303 <style lang="scss" scoped>
  304 +.personal {
  305 + background-color: #ffffff;
  306 +}
262 .headBox { 307 .headBox {
263 - background-color: #fff; 308 + background: linear-gradient(90deg, #8c9ef2 0%, #5f6ee6 100%);
264 border-top: 0.01px solid #f5f5f5; 309 border-top: 0.01px solid #f5f5f5;
265 height: 250rpx; 310 height: 250rpx;
266 311
@@ -322,7 +367,7 @@ export default { @@ -322,7 +367,7 @@ export default {
322 .cell-item { 367 .cell-item {
323 border-bottom: 2rpx solid #eee; 368 border-bottom: 2rpx solid #eee;
324 background-color: #fff; 369 background-color: #fff;
325 - border-radius: 10rpx; 370 + border-radius: 30rpx;
326 padding: 20rpx 24rpx; 371 padding: 20rpx 24rpx;
327 372
328 .title { 373 .title {
@@ -369,7 +414,7 @@ export default { @@ -369,7 +414,7 @@ export default {
369 height: 50rpx; 414 height: 50rpx;
370 color: #333; 415 color: #333;
371 line-height: 52rpx; 416 line-height: 52rpx;
372 - background: #eee; 417 + // background: #eee;
373 min-width: 188rpx; 418 min-width: 188rpx;
374 text-align: center; 419 text-align: center;
375 border-radius: 8rpx; 420 border-radius: 8rpx;
@@ -380,8 +425,8 @@ export default { @@ -380,8 +425,8 @@ export default {
380 z-index: 11; 425 z-index: 11;
381 426
382 &.forhidden { 427 &.forhidden {
383 - background: #eee;  
384 - color: #cccccc; 428 + // background: #eee;
  429 + // color: #cccccc;
385 } 430 }
386 } 431 }
387 } 432 }
@@ -2,8 +2,15 @@ @@ -2,8 +2,15 @@
2 <view class="set-page"> 2 <view class="set-page">
3 <!-- 公共组件-每个页面必须引入 --> 3 <!-- 公共组件-每个页面必须引入 -->
4 <public-module></public-module> 4 <public-module></public-module>
5 - <view class="u-m-t-20"><text style="color:#8f9ca2">基本资料</text></view>  
6 - <view style="border: 0.1px solid #e4e4e4;margin-top: 20rpx;padding-left: 15rpx;"> 5 + <view
  6 + class="u-flex"
  7 + style="border-radius: 20px;margin-top: 37rpx;padding-left: 15rpx;;justify-content: space-between;width: 690rpx;height: 200rpx;background-color: #FFFFFF;"
  8 + >
  9 + <view style=""><image style="width: 130rpx;height: 130rpx;" src="../../static/avatar-test.png" mode=""></image></view>
  10 + <view style="margin-right: 40rpx;"><image style="width: 13rpx;height: 17rpx;" src="../../static/arrow-right.png" mode=""></image></view>
  11 + </view>
  12 + <view class="u-m-t-20"><text style="color:#8f9ca2;font-size: 14px;">基本资料</text></view>
  13 + <view style="background-color: #FFFFFF;border-radius: 20px;margin-top: 20rpx;padding-left: 15rpx;">
7 <u--form labelPosition="left" :model="myInfoModel" :rules="rules" ref="myInfoFormRef"> 14 <u--form labelPosition="left" :model="myInfoModel" :rules="rules" ref="myInfoFormRef">
8 <u-form-item labelWidth="80px" label="真实姓名" prop="userInfo.name" borderBottom ref="item1"> 15 <u-form-item labelWidth="80px" label="真实姓名" prop="userInfo.name" borderBottom ref="item1">
9 <u--input placeholder="请输入真实姓名" v-model="myInfoModel.userInfo.name" border="none"></u--input> 16 <u--input placeholder="请输入真实姓名" v-model="myInfoModel.userInfo.name" border="none"></u--input>
@@ -42,8 +49,7 @@ @@ -42,8 +49,7 @@
42 </u-form-item> 49 </u-form-item>
43 </u--form> 50 </u--form>
44 </view> 51 </view>
45 -  
46 - <view><button class="submit" size="default" @click="onSubmitFunc" :style="{ background: PrimaryColor }">确认</button></view> 52 + <view style="width: 500rpx;margin-left: 86rpx;"><button class="submit" size="default" @click="onSubmitFunc" :style="{ background: PrimaryColor }">确认</button></view>
47 <!-- #ifdef MP --> 53 <!-- #ifdef MP -->
48 <view class="u-m-t-40"><text style="visibility: hidden;">#</text></view> 54 <view class="u-m-t-40"><text style="visibility: hidden;">#</text></view>
49 <!-- #endif --> 55 <!-- #endif -->
  1 +<template>
  2 + <view class="u-page">
  3 + <view class="u-demo-block">
  4 + <text class="u-demo-block__title">基础使用</text>
  5 + <view class="u-demo-block__content">
  6 + <u--input
  7 + placeholder="请输入内容"
  8 + border="surround"
  9 + v-model="value"
  10 + @change="change"
  11 + ></u--input>
  12 + </view>
  13 + </view>
  14 + <view class="u-demo-block">
  15 + <text class="u-demo-block__title">可清空内容</text>
  16 + <view class="u-demo-block__content">
  17 + <u--input
  18 + placeholder="请输入内容"
  19 + border="surround"
  20 + clearable
  21 + ></u--input>
  22 + </view>
  23 + </view>
  24 + <view class="u-demo-block">
  25 + <text class="u-demo-block__title">数字键盘</text>
  26 + <view class="u-demo-block__content">
  27 + <u--input
  28 + placeholder="请输入内容"
  29 + border="surround"
  30 + type="number"
  31 + clearable
  32 + ></u--input>
  33 + </view>
  34 + </view>
  35 + <view class="u-demo-block">
  36 + <text class="u-demo-block__title">密码类型</text>
  37 + <view class="u-demo-block__content">
  38 + <u--input
  39 + placeholder="请输入内容"
  40 + border="surround"
  41 + password
  42 + clearable
  43 + ></u--input>
  44 + </view>
  45 + </view>
  46 + <view class="u-demo-block">
  47 + <text class="u-demo-block__title">显示下划线</text>
  48 + <view class="u-demo-block__content">
  49 + <u--input
  50 + placeholder="请输入内容"
  51 + border="bottom"
  52 + clearable
  53 + ></u--input>
  54 + </view>
  55 + </view>
  56 + <view class="u-demo-block">
  57 + <text class="u-demo-block__title">禁用状态</text>
  58 + <view class="u-demo-block__content">
  59 + <u--input
  60 + placeholder="禁用状态"
  61 + border="surround"
  62 + disabled
  63 + ></u--input>
  64 + </view>
  65 + </view>
  66 + <view class="u-demo-block">
  67 + <text class="u-demo-block__title">圆形</text>
  68 + <view class="u-demo-block__content">
  69 + <u--input
  70 + placeholder="请输入内容"
  71 + border="surround"
  72 + shape="circle"
  73 + ></u--input>
  74 + </view>
  75 + </view>
  76 + <view class="u-demo-block">
  77 + <text class="u-demo-block__title">前后图标</text>
  78 + <view class="u-demo-block__content">
  79 + <u--input
  80 + placeholder="前置图标"
  81 + prefixIcon="search"
  82 + prefixIconStyle="font-size: 22px;color: #909399"
  83 + ></u--input>
  84 + </view>
  85 + <view
  86 + class="u-demo-block__content"
  87 + style="margin-top: 15px;"
  88 + >
  89 + <u--input
  90 + placeholder="后置图标"
  91 + suffixIcon="map-fill"
  92 + suffixIconStyle="color: #909399"
  93 + ></u--input>
  94 + </view>
  95 + </view>
  96 + <view class="u-demo-block">
  97 + <text class="u-demo-block__title">前后插槽</text>
  98 + <view class="u-demo-block__content">
  99 + <!-- 注意:由于兼容性差异,如果需要使用前后插槽,nvue下需使用u--input,非nvue下需使用u-input -->
  100 + <!-- #ifndef APP-NVUE -->
  101 + <u-input placeholder="前置插槽">
  102 + <!-- #endif -->
  103 + <!-- #ifdef APP-NVUE -->
  104 + <u--input placeholder="前置插槽">
  105 + <!-- #endif -->
  106 + <u--text
  107 + text="http://"
  108 + slot="prefix"
  109 + margin="0 3px 0 0"
  110 + type="tips"
  111 + ></u--text>
  112 + <!-- #ifndef APP-NVUE -->
  113 + </u-input>
  114 + <!-- #endif -->
  115 + <!-- #ifdef APP-NVUE -->
  116 + </u--input>
  117 + <!-- #endif -->
  118 + </view>
  119 + <view
  120 + class="u-demo-block__content"
  121 + style="margin-top: 15px;"
  122 + >
  123 + <!-- 注意:由于兼容性差异,如果需要使用前后插槽,nvue下需使用u--input,非nvue下需使用u-input -->
  124 + <!-- #ifndef APP-NVUE -->
  125 + <u-input placeholder="后置插槽">
  126 + <!-- #endif -->
  127 + <!-- #ifdef APP-NVUE -->
  128 + <u--input placeholder="后置插槽">
  129 + <!-- #endif -->
  130 + <template slot="suffix">
  131 + <u-code
  132 + ref="uCode"
  133 + @change="codeChange"
  134 + seconds="20"
  135 + changeText="X秒重新获取哈哈哈"
  136 + ></u-code>
  137 + <u-button
  138 + @tap="getCode"
  139 + :text="tips"
  140 + type="success"
  141 + size="mini"
  142 + ></u-button>
  143 + </template>
  144 + <!-- #ifndef APP-NVUE -->
  145 + </u-input>
  146 + <!-- #endif -->
  147 + <!-- #ifdef APP-NVUE -->
  148 + </u--input>
  149 + <!-- #endif -->
  150 + </view>
  151 + </view>
  152 + <u-gap
  153 + bgColor="#fff"
  154 + height="50"
  155 + ></u-gap>
  156 + </view>
  157 +</template>
  158 +
  159 +<script>
  160 + export default {
  161 + data() {
  162 + return {
  163 + tips: '',
  164 + value: ''
  165 + }
  166 + },
  167 + watch: {
  168 + value(newValue, oldValue) {
  169 + // console.log('v-model', newValue);
  170 + }
  171 + },
  172 + methods: {
  173 + codeChange(text) {
  174 + this.tips = text;
  175 + },
  176 + getCode() {
  177 + if (this.$refs.uCode.canGetCode) {
  178 + // 模拟向后端请求验证码
  179 + uni.showLoading({
  180 + title: '正在获取验证码'
  181 + })
  182 + setTimeout(() => {
  183 + uni.hideLoading();
  184 + // 这里此提示会被this.start()方法中的提示覆盖
  185 + uni.$u.toast('验证码已发送');
  186 + // 通知验证码组件内部开始倒计时
  187 + this.$refs.uCode.start();
  188 + }, 2000);
  189 + } else {
  190 + uni.$u.toast('倒计时结束后再发送');
  191 + }
  192 + },
  193 + change(e) {
  194 + console.log('change', e);
  195 + }
  196 + }
  197 + }
  198 +</script>
  199 +
  200 +<style lang="scss">
  201 +
  202 +</style>
1 <template> 1 <template>
2 - <view class="content"> 2 + <view class="notify-detail-page">
3 <!-- 公共组件-每个页面必须引入 --> 3 <!-- 公共组件-每个页面必须引入 -->
4 <public-module></public-module> 4 <public-module></public-module>
5 <view> 5 <view>
6 - <view class="u-flex" style="justify-content: center;border-bottom: 0.1px solid #ffffff;"><text>今天晚上开会</text></view>  
7 - <view style="margin-top: 5rpx;">  
8 - <u-list height="140rpx">  
9 - <u-list-item v-for="(item, index) in notifyList" :key="index">  
10 - <u-cell @click="clickNotifyDetail(item.id)" :value="`${item.time}`" :title="`${item.name}`">  
11 - <u-avatar slot="icon" shape="circle" size="35" :src="item.imageUrl"></u-avatar>  
12 - </u-cell>  
13 - </u-list-item>  
14 - </u-list>  
15 - </view>  
16 - <view class=""><text>内容</text></view> 6 + <view class="u-flex" style="margin-top: 10rpx;justify-content: center;"><text>今天晚上开会</text></view>
  7 + <view style="border-radius: 20px;;margin-top: 20rpx;width: 696rpx;height: 1000rpx;background-color: #FFFFFF;">
  8 + <u-list height="140rpx">
  9 + <u-list-item v-for="(item, index) in notifyList" :key="index">
  10 + <u-cell @click="clickNotifyDetail(item.id)" :value="`${item.time}`" :title="`${item.name}`">
  11 + <u-avatar slot="icon" shape="circle" size="35" :src="item.imageUrl"></u-avatar>
  12 + </u-cell>
  13 + </u-list-item>
  14 + </u-list>
  15 + <view class=""><text>内容</text></view>
  16 + </view>
17 </view> 17 </view>
18 <f-tabbar></f-tabbar> 18 <f-tabbar></f-tabbar>
19 </view> 19 </view>
@@ -47,4 +47,11 @@ export default { @@ -47,4 +47,11 @@ export default {
47 }; 47 };
48 </script> 48 </script>
49 49
50 -<style lang="scss" scoped></style> 50 +<style lang="scss" scoped>
  51 +.notify-detail-page {
  52 + min-height: 100vh;
  53 + background-color: #f8f9fa;
  54 + padding-top: 10rpx;
  55 + padding-left: 27rpx;
  56 +}
  57 +</style>
@@ -4,8 +4,8 @@ @@ -4,8 +4,8 @@
4 <public-module></public-module> 4 <public-module></public-module>
5 <view> 5 <view>
6 <u-list @scrolltolower="scrolltolower"> 6 <u-list @scrolltolower="scrolltolower">
7 - <u-list-item v-for="(item, index) in notifyList" :key="index">  
8 - <u-cell @click="clickNotifyDetail(item.id)" isLink :value="`${item.time}`" :title="`${item.name}`"> 7 + <u-list-item style="margin-top: 20rpx;background: #FFFFFF;width: 695rpx;border-radius: 20px;" v-for="(item, index) in notifyList" :key="index">
  8 + <u-cell :border="false" @click="clickNotifyDetail(item.id)" isLink :value="`${item.time}`" :title="`${item.name}`">
9 <u-avatar slot="icon" shape="circle" size="35" :src="item.imageUrl"></u-avatar> 9 <u-avatar slot="icon" shape="circle" size="35" :src="item.imageUrl"></u-avatar>
10 </u-cell> 10 </u-cell>
11 </u-list-item> 11 </u-list-item>
@@ -99,6 +99,14 @@ export default { @@ -99,6 +99,14 @@ export default {
99 <style lang="scss" scoped> 99 <style lang="scss" scoped>
100 .notify-page { 100 .notify-page {
101 min-height: 100vh; 101 min-height: 100vh;
102 - background-color: #fff; 102 + background-color: #f8f9fa;
  103 + padding-top: 10rpx;
  104 + padding-left: 27rpx;
  105 +}
  106 +/deep/.u-list-item {
  107 + background: #ffffff;
  108 + width: 695rpx;
  109 + border-radius: 20px;
  110 + margin-top: 20rpx;
103 } 111 }
104 </style> 112 </style>

974 Bytes

1.16 KB | W: | H:

892 Bytes | W: | H:

  • 2-up
  • Swipe
  • Onion skin