简柏林 / thingskit-app · Commits

Commit b32cbbdd04b77c03fe2cd3ffc8db465fa32bcce5

Authored by 黄 x
1 parent 5e57dc64

更新小程序文件

Inline Side-by-side
Showing 42 changed files with 4109 additions and 307 deletions
... ... @@ -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 62 const homePath = '/pages/index/index';
63 63 //白色表达值
... ...
1 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 33 </template>
34 34
35 35 <script>
36 36 import base from '@/config/baseUrl.js';
37 37
38 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 140 </script>
140 141
141 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 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 57 },
58 58 "quickapp" : {},
59 59 "mp-weixin" : {
60   - "appid" : "wx0ad61d7bf6808e02",
  60 + "appid" : "wx594747d3848d7a10",
61 61 "setting" : {
62 62 "urlCheck" : false,
63 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 +}
\ No newline at end of file
... ...
... ... @@ -13,25 +13,13 @@
13 13 "style": {
14 14 "navigationBarTitleText": "设备",
15 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 27 "style": {
40 28 "navigationBarTitleText": "告警"
41 29 }
42   - }, {
  30 + },
  31 + {
  32 + "path": "pages/alert/alertDetail",
  33 + "style": {
  34 + "navigationBarTitleText": "告警详情"
  35 + }
  36 + },
  37 + {
43 38 "path": "pages/personal/personal",
44 39 "style": {
45 40 "navigationBarTitleText": "个人中心"
... ... @@ -84,16 +79,13 @@
84 79 "style": {
85 80 "navigationBarTitleText": "意见反馈",
86 81 "app-plus": {
87   - "scrollIndicator": "none" //当前页面不显示滚动条
  82 + "scrollIndicator": "none"
88 83 }
89 84 }
90 85 }, {
91 86 "path": "pages/index/camera/camera",
92 87 "style": {
93 88 "navigationBarTitleText": "查看摄像头"
94   - // "app-plus": {
95   - // "scrollIndicator": "none" //当前页面不显示滚动条
96   - // }
97 89 }
98 90
99 91 }, {
... ... @@ -102,6 +94,27 @@
102 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 120 "globalStyle": {
... ...
1 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 171 </template>
9 172
10 173 <script>
11 174 import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  175 +import fNavbar from '@/components/module/f-navbar/f-navbar';
  176 +
12 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 419 </script>
26 420
27 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 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 1 <template>
2 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 13 <public-module></public-module>
5 14 <view class="org-sty">
6 15 <view class="org-item">
7 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 17 <text style="color:#333333;font-size: 15px;margin-left: 14rpx;">组织关系</text>
10 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 23 </view>
13 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 26 </view>
16 27 </view>
17 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 30 <view class="item">
20 31 <view>
21 32 <text style="color:#333333;font-size: 15px;">{{ item.name1 }}</text>
... ... @@ -39,54 +50,210 @@
39 50 </view>
40 51 </view>
41 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 121 <f-tabbar></f-tabbar>
43 122 </view>
44 123 </template>
45 124
46 125 <script>
47 126 import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  127 +import fNavbar from '@/components/module/f-navbar/f-navbar';
48 128
49 129 export default {
50 130 components: {
51   - fTabbar
  131 + fTabbar,
  132 + fNavbar
52 133 },
53 134 data() {
54 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 209 list: [
56 210 {
57 211 name1: '1号楼1楼三单元水表',
58 212 name2: '设备编号：SN987633433',
59 213 name3: '所属组:XXXXXX',
60 214 name4: '../../static/online.png',
61   - name5: '在线'
  215 + name5: '在线',
  216 + id: 'xx1'
62 217 },
63 218 {
64 219 name1: '2号楼1楼三单元水表',
65 220 name2: '设备编号：SN987633433',
66 221 name3: '所属组:XXXXXX',
67 222 name4: '../../static/online.png',
68   - name5: '在线'
  223 + name5: '在线',
  224 + id: 'xx2'
69 225 },
70 226 {
71 227 name1: '3号楼1楼三单元水表',
72 228 name2: '设备编号：SN987633433',
73 229 name3: '所属组:XXXXXX',
74 230 name4: '../../static/baojing.png',
75   - name5: '离线'
  231 + name5: '离线',
  232 + id: 'xx3'
76 233 },
77 234 {
78 235 name1: '4号楼1楼三单元水表',
79 236 name2: '设备编号：SN987633433',
80 237 name3: '所属组:XXXXXX',
81 238 name4: '../../static/unonline.png',
82   - name5: '未激活'
  239 + name5: '未激活',
  240 + id: 'xx4'
83 241 },
84 242 {
85 243 name1: '5号楼1楼三单元水表',
86 244 name2: '设备编号：SN987633433',
87 245 name3: '所属组:XXXXXX',
88 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 261 onLoad() {
95 262 // 隐藏原生的tabbar
96 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 286 </script>
100 287
101 288 <style lang="scss" scoped>
102 289 .device-page {
103   - padding: 0rpx 15rpx;
  290 + // padding: 0rpx 15rpx;
104 291 min-height: 100vh;
105 292 background-color: #f8f9fa;
106 293 }
... ... @@ -120,7 +307,9 @@ export default {
120 307 .device-list {
121 308 display: flex;
122 309 flex-direction: column;
  310 + padding-left: 20rpx;
123 311 .list-item {
  312 + width: 713rpx;
124 313 height: 200rpx;
125 314 background-color: #fff;
126 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 4 <public-module></public-module>
5 5 <view class="form-page">
6 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 8 <u--input placeholder="请输入主题" v-model="feedbackData.userInfo.name" border="none"></u--input>
9 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 11 <u--input placeholder="请输入姓名" v-model="feedbackData.userInfo.name" border="none"></u--input>
12 12 </u-form-item>
13 13 <u-form-item label="手机" prop="userInfo.name" borderBottom ref="item1">
... ... @@ -26,7 +26,7 @@
26 26 <u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple :maxCount="6"></u-upload>
27 27 </u-form-item>
28 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 30 </u-form-item>
31 31 </u--form>
32 32 <u-button class="buttonSty" shape="circle" type="primary" text="提交" customStyle="margin-top: 17rpx" @click="submit"></u-button>
... ... @@ -37,6 +37,7 @@
37 37 <view style="height: 72rpx;"></view>
38 38 <!-- #endif -->
39 39 </view>
  40 + <view style="height: 20rpx;"></view>
40 41 <f-tabbar></f-tabbar>
41 42 </view>
42 43 </template>
... ... @@ -119,9 +120,16 @@ export default {
119 120 <style lang="scss" scoped>
120 121 .feedback-page {
121 122 min-height: 100vh;
122   - background-color: #fff;
  123 + background-color: #f8f9fa;
  124 + padding-top: 9rpx;
  125 + padding-left: 27rpx;
123 126 }
124 127 .form-page {
  128 + width: 700rpx;
  129 + background-color: #ffffff;
  130 + border-radius: 20px;
  131 + margin-top: 20rpx;
  132 + padding-left: 15rpx;
125 133 padding: 0 20rpx;
126 134 }
127 135 //#ifndef MP
... ...
... ... @@ -2,7 +2,20 @@
2 2 <view class="camera-page">
3 3 <!-- 公共组件-每个页面必须引入 -->
4 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 19 <view class="camera-container">
7 20 <view class="container-item">
8 21 <view @click="openCameraDetail(item.url)" v-for="(item, index) in list" :key="index" class="item">
... ... @@ -70,6 +83,19 @@ export default {
70 83 min-height: 100vh;
71 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 99 .camera-item {
74 100 height: 200rpx;
75 101 border: 0.1px solid gray;
... ...
... ... @@ -3,40 +3,6 @@
3 3 <!-- 公共组件-每个页面必须引入 -->
4 4 <public-module></public-module>
5 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 7 <view class="basic-sty">
42 8 <view class=""><text style="font-size: 15px;color:#333333">基础统计</text></view>
... ... @@ -83,6 +49,40 @@
83 49 </view>
84 50 </view>
85 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 86 </view>
87 87 <f-tabbar></f-tabbar>
88 88 </view>
... ... @@ -129,6 +129,7 @@ export default {
129 129 grid-template-columns: repeat(2, 350rpx);
130 130 grid-template-rows: repeat(2, 200rpx);
131 131 grid-gap: 20rpx;
  132 + margin-top: 50rpx;
132 133 }
133 134
134 135 .grid-item {
... ... @@ -152,7 +153,7 @@ export default {
152 153 }
153 154 .basic-sty {
154 155 padding: 0 10rpx;
155   - margin-top: 50rpx;
  156 + // margin-top: 50rpx;
156 157 .basic {
157 158 width: 750rpx;
158 159 height: 500rpx;
... ...
1 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 19 </view>
8 20 </template>
9 21
10 22 <script>
11 23 import fTabbar from '@/components/module/f-tabbar/f-tabbar';
  24 +import fNavbar from '@/components/module/f-navbar/f-navbar';
12 25
13 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 63 </script>
28 64
29 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 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 22 </view>
23 23 <view class="u-flex-1">
24 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 32 </view>
27 33 </block>
28 34 <view><u-icon @click="openPersonalInfo" name="arrow-right" color="black" size="13"></u-icon></view>
... ... @@ -52,61 +58,90 @@
52 58 </view>
53 59 <!-- #endif -->
54 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 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 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 85 <view>
74   - <u-modal confirmText="绑定账号" @confirm="bindConfirm" :show="show" :title="title">
  86 + <u-modal :showConfirmButton="false" :show="show" :title="title">
75 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 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 92 <u--input
81 93 class="input"
  94 + border="surround"
  95 + shape="circle"
82 96 prefixIcon="lock-fill"
83 97 :suffixIcon="showPasswordIcon"
84 98 suffixIconStyle="color: #909399"
85 99 type="password"
86 100 placeholder="登录密码"
87   - border="surround"
88 101 v-model="password"
89 102 @change="passwordChange"
90 103 ></u--input>
91 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 106 <view style="visibility: hidden;">手机验证码登录</view>
94 107 <view style="color: #0079fe;font-size: 14px;" @click="bindPhoneFunc">手机绑定</view>
95 108 </view>
96 109 </view>
97 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 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 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 135 <view style="visibility: hidden;">手机验证码登录</view>
107 136 <view style="color: #0079fe;font-size: 14px;" @click="bindAccountFunc">账号绑定</view>
108 137 </view>
109 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 145 </u-modal>
111 146 </view>
112 147 <!-- 退出登录 -->
... ... @@ -123,7 +158,6 @@
123 158 </view>
124 159 </u-popup>
125 160 </view>
126   - <f-tabbar></f-tabbar>
127 161 </view>
128 162 </template>
129 163
... ... @@ -174,6 +208,16 @@ export default {
174 208 ...mapState(['userInfo'])
175 209 },
176 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 221 onJump(url) {
178 222 uni.navigateTo({
179 223 url: url
... ... @@ -192,9 +236,7 @@ export default {
192 236 clickAccountFunc() {
193 237 this.show = true;
194 238 },
195   - bindConfirm() {
196   - this.show = false;
197   - },
  239 + bindConfirm() {},
198 240 bindPhoneFunc() {
199 241 this.bindPhone = true;
200 242 },
... ... @@ -259,8 +301,11 @@ export default {
259 301 </script>
260 302
261 303 <style lang="scss" scoped>
  304 +.personal {
  305 + background-color: #ffffff;
  306 +}
262 307 .headBox {
263   - background-color: #fff;
  308 + background: linear-gradient(90deg, #8c9ef2 0%, #5f6ee6 100%);
264 309 border-top: 0.01px solid #f5f5f5;
265 310 height: 250rpx;
266 311
... ... @@ -322,7 +367,7 @@ export default {
322 367 .cell-item {
323 368 border-bottom: 2rpx solid #eee;
324 369 background-color: #fff;
325   - border-radius: 10rpx;
  370 + border-radius: 30rpx;
326 371 padding: 20rpx 24rpx;
327 372
328 373 .title {
... ... @@ -369,7 +414,7 @@ export default {
369 414 height: 50rpx;
370 415 color: #333;
371 416 line-height: 52rpx;
372   - background: #eee;
  417 + // background: #eee;
373 418 min-width: 188rpx;
374 419 text-align: center;
375 420 border-radius: 8rpx;
... ... @@ -380,8 +425,8 @@ export default {
380 425 z-index: 11;
381 426
382 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 2 <view class="set-page">
3 3 <!-- 公共组件-每个页面必须引入 -->
4 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 14 <u--form labelPosition="left" :model="myInfoModel" :rules="rules" ref="myInfoFormRef">
8 15 <u-form-item labelWidth="80px" label="真实姓名" prop="userInfo.name" borderBottom ref="item1">
9 16 <u--input placeholder="请输入真实姓名" v-model="myInfoModel.userInfo.name" border="none"></u--input>
... ... @@ -42,8 +49,7 @@
42 49 </u-form-item>
43 50 </u--form>
44 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 53 <!-- #ifdef MP -->
48 54 <view class="u-m-t-40"><text style="visibility: hidden;">#</text></view>
49 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 1 <template>
2   - <view class="content">
  2 + <view class="notify-detail-page">
3 3 <!-- 公共组件-每个页面必须引入 -->
4 4 <public-module></public-module>
5 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 17 </view>
18 18 <f-tabbar></f-tabbar>
19 19 </view>
... ... @@ -47,4 +47,11 @@ export default {
47 47 };
48 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 4 <public-module></public-module>
5 5 <view>
6 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 9 <u-avatar slot="icon" shape="circle" size="35" :src="item.imageUrl"></u-avatar>
10 10 </u-cell>
11 11 </u-list-item>
... ... @@ -99,6 +99,14 @@ export default {
99 99 <style lang="scss" scoped>
100 100 .notify-page {
101 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 112 </style>
... ...

974 Bytes

1.16 KB | W: | H:

892 Bytes | W: | H:

  • 2-up
  • Swipe
  • Onion skin