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