28 changed files with 8719 additions and 0 deletions
@ -0,0 +1,20 @@ |
|||||
|
<script> |
||||
|
export default { |
||||
|
onLaunch: function() { |
||||
|
console.log('App Launch') |
||||
|
}, |
||||
|
onShow: function() { |
||||
|
console.log('App Show') |
||||
|
}, |
||||
|
onHide: function() { |
||||
|
console.log('App Hide') |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
@import './common/uni.css'; |
||||
|
@import "./common/main.css"; |
||||
|
@import "./common/icon.css"; |
||||
|
@import "./common/iconfont.css"; |
||||
|
</style> |
||||
@ -0,0 +1,23 @@ |
|||||
|
import http from '@/common/request' |
||||
|
|
||||
|
export function getDevice(dev_eui, limit, offset) { |
||||
|
let data = {} |
||||
|
if(dev_eui){ |
||||
|
data.dev_eui = dev_eui |
||||
|
} |
||||
|
if(limit){ |
||||
|
data.limit = limit |
||||
|
} |
||||
|
if(offset){ |
||||
|
data.offset = offset |
||||
|
} |
||||
|
return http.get('/device/info',data) |
||||
|
} |
||||
|
|
||||
|
export function postDevice(dev) { |
||||
|
return http.post('/device/info',dev) |
||||
|
} |
||||
|
|
||||
|
export function delDevice(id) { |
||||
|
return http.del(`/device/${id}`) |
||||
|
} |
||||
@ -0,0 +1,22 @@ |
|||||
|
Date.prototype.format = function(format) { |
||||
|
var o = { |
||||
|
"M+": this.getMonth() + 1, //month
|
||||
|
"d+": this.getDate(), //day
|
||||
|
"h+": this.getHours(), //hour
|
||||
|
"m+": this.getMinutes(), //minute
|
||||
|
"s+": this.getSeconds(), //second
|
||||
|
"q+": Math.floor((this.getMonth() + 3) / 3), //quarter
|
||||
|
"S": this.getMilliseconds() //millisecond
|
||||
|
} |
||||
|
|
||||
|
if (/(y+)/.test(format)) { |
||||
|
format = format.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length)); |
||||
|
} |
||||
|
|
||||
|
for (var k in o) { |
||||
|
if (new RegExp("(" + k + ")").test(format)) { |
||||
|
format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length)); |
||||
|
} |
||||
|
} |
||||
|
return format; |
||||
|
} |
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,74 @@ |
|||||
|
@font-face { |
||||
|
font-family: "iconfont"; |
||||
|
src: url('//at.alicdn.com/t/font_1339011_fnx8kfgj0pj.eot?t=1565167418581'); /* IE9 */ |
||||
|
src: url('//at.alicdn.com/t/font_1339011_fnx8kfgj0pj.eot?t=1565167418581#iefix') format('embedded-opentype'), /* IE6-IE8 */ |
||||
|
url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'), |
||||
|
url('//at.alicdn.com/t/font_1339011_fnx8kfgj0pj.woff?t=1565167418581') format('woff'), |
||||
|
url('//at.alicdn.com/t/font_1339011_fnx8kfgj0pj.ttf?t=1565167418581') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ |
||||
|
url('//at.alicdn.com/t/font_1339011_fnx8kfgj0pj.svg?t=1565167418581#iconfont') format('svg'); /* iOS 4.1- */ |
||||
|
} |
||||
|
|
||||
|
.iconfont { |
||||
|
font-family: "iconfont"; |
||||
|
font-size: 16px; |
||||
|
font-style: normal; |
||||
|
-webkit-font-smoothing: antialiased; |
||||
|
-moz-osx-font-smoothing: grayscale; |
||||
|
} |
||||
|
|
||||
|
.icon-shebei:before { |
||||
|
content: "\e606"; |
||||
|
} |
||||
|
|
||||
|
.icon-lora:before { |
||||
|
content: "\e7bd"; |
||||
|
} |
||||
|
|
||||
|
.icon-NATwangguan:before { |
||||
|
content: "\e665"; |
||||
|
} |
||||
|
|
||||
|
.icon-wendu:before { |
||||
|
content: "\e61f"; |
||||
|
} |
||||
|
|
||||
|
.icon-ditu:before { |
||||
|
content: "\e601"; |
||||
|
} |
||||
|
|
||||
|
.icon-wenshidu:before { |
||||
|
content: "\e600"; |
||||
|
} |
||||
|
|
||||
|
.icon-shebei2:before { |
||||
|
content: "\e643"; |
||||
|
} |
||||
|
|
||||
|
.icon-kuaicheduanxinwangguan:before { |
||||
|
content: "\eb53"; |
||||
|
} |
||||
|
|
||||
|
.icon-kuaicheduanxinwangguan1:before { |
||||
|
content: "\eb5f"; |
||||
|
} |
||||
|
|
||||
|
.icon-wenshidu1:before { |
||||
|
content: "\e602"; |
||||
|
} |
||||
|
|
||||
|
.icon-shidu:before { |
||||
|
content: "\e653"; |
||||
|
} |
||||
|
|
||||
|
.icon-yemian-copy-copy-copy:before { |
||||
|
content: "\e603"; |
||||
|
} |
||||
|
|
||||
|
.icon-gerenzhongxinwoderenwubiaozhuntoumianxing:before { |
||||
|
content: "\e604"; |
||||
|
} |
||||
|
|
||||
|
.icon-gateway:before { |
||||
|
content: "\e615"; |
||||
|
} |
||||
|
|
||||
File diff suppressed because it is too large
@ -0,0 +1,16 @@ |
|||||
|
import Request from '@/js_sdk/luch-request/request' |
||||
|
|
||||
|
const http = new Request(); |
||||
|
|
||||
|
http.setConfig((config) => { /* 设置全局配置 */ |
||||
|
config.baseUrl = 'https://api.alinkwise.com'; /* 根域名不同 */ |
||||
|
return config; |
||||
|
}) |
||||
|
http.interceptor.request((config, cancel) => { /* 请求之前拦截器 */ |
||||
|
return config; |
||||
|
}) |
||||
|
|
||||
|
http.interceptor.response((response) => { /* 请求之后拦截器 */ |
||||
|
return response |
||||
|
}) |
||||
|
export default http; |
||||
File diff suppressed because it is too large
@ -0,0 +1,182 @@ |
|||||
|
<template> |
||||
|
<view class="search" :style="{ backgroundColor: backgroundColor }"> |
||||
|
<view class="content" :style="{ 'border-radius': radius + 'px', border: border }"> |
||||
|
<view class="content-box" :class="{ center: mode === 2 }"> |
||||
|
<text class="icon icon-search"></text> |
||||
|
<input class="input" :class="{ center: !active && mode === 2 }" :focus="isFocus" :placeholder="placeholder" v-model="inputVal" @focus="focus" @blur="blur" /> |
||||
|
<!-- <view v-if="!active && mode === 2" class="input sub" @click="getFocus">请输入搜索内容</view> --> |
||||
|
<text v-if="isDelShow" class="icon icon-del" @click="clear"></text> |
||||
|
</view> |
||||
|
<view v-show="(active && show && button === 'inside') || (isDelShow && button === 'inside')" class="searchBtn" @click="search">搜索</view> |
||||
|
</view> |
||||
|
<view v-if="button === 'outside'" class="button" :class="{ active: show || active }" @click="search"> |
||||
|
<view class="button-item">{{ !show ? searchName : '搜索' }}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
props: { |
||||
|
mode: { |
||||
|
type: Number, |
||||
|
default: 1 |
||||
|
}, |
||||
|
button: { |
||||
|
type: String, |
||||
|
default: 'outside' |
||||
|
}, |
||||
|
show: { |
||||
|
type: Boolean, |
||||
|
default: true |
||||
|
}, |
||||
|
radius: { |
||||
|
type: String, |
||||
|
default: '60' |
||||
|
}, |
||||
|
placeholder: { |
||||
|
type: String, |
||||
|
default: '请输入搜索内容' |
||||
|
}, |
||||
|
backgroundColor: { |
||||
|
type: String, |
||||
|
default: '#fff' |
||||
|
}, |
||||
|
border: { type: String, default: '1px #f5f5f5 solid' } |
||||
|
|
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
active: false, |
||||
|
inputVal: '', |
||||
|
searchName: '取消', |
||||
|
isDelShow: false, |
||||
|
isFocus: false |
||||
|
}; |
||||
|
}, |
||||
|
methods: { |
||||
|
focus() { |
||||
|
this.active = true; |
||||
|
}, |
||||
|
blur() { |
||||
|
this.isFocus = false; |
||||
|
if (!this.inputVal) { |
||||
|
this.active = false; |
||||
|
} |
||||
|
}, |
||||
|
clear() { |
||||
|
this.inputVal = ''; |
||||
|
this.active = false; |
||||
|
this.$emit('search', ''); |
||||
|
}, |
||||
|
getFocus() { |
||||
|
this.isFocus = true; |
||||
|
}, |
||||
|
search() { |
||||
|
if (!this.inputVal) return; |
||||
|
console.log(this.inputVal); |
||||
|
this.$emit('search', this.inputVal); |
||||
|
} |
||||
|
}, |
||||
|
watch: { |
||||
|
inputVal(newVal) { |
||||
|
if (newVal) { |
||||
|
this.searchName = '搜索'; |
||||
|
this.isDelShow = true; |
||||
|
} else { |
||||
|
this.searchName = '取消'; |
||||
|
this.isDelShow = false; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.search { |
||||
|
display: flex; |
||||
|
width: 100%; |
||||
|
border-bottom: 1px #f5f5f5 solid; |
||||
|
box-sizing: border-box; |
||||
|
padding: 15upx; |
||||
|
font-size: $uni-font-size-base; |
||||
|
background: #fff; |
||||
|
.content { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
width: 100%; |
||||
|
height: 60upx; |
||||
|
border: 1px #ccc solid; |
||||
|
background: #fff; |
||||
|
overflow: hidden; |
||||
|
transition: all 0.2s linear; |
||||
|
border-radius: 30px; |
||||
|
|
||||
|
.content-box { |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
&.center { |
||||
|
justify-content: center; |
||||
|
} |
||||
|
.icon { |
||||
|
padding: 0 15upx; |
||||
|
&.icon-del { |
||||
|
font-size: 38upx; |
||||
|
} |
||||
|
} |
||||
|
.input { |
||||
|
width: 100%; |
||||
|
max-width: 100%; |
||||
|
line-height: 60upx; |
||||
|
height: 60upx; |
||||
|
transition: all 0.2s linear; |
||||
|
&.center { |
||||
|
width: 200upx; |
||||
|
} |
||||
|
&.sub { |
||||
|
// position: absolute; |
||||
|
width: auto; |
||||
|
color: grey; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.searchBtn { |
||||
|
height: 100%; |
||||
|
flex-shrink: 0; |
||||
|
padding: 0 30upx; |
||||
|
background: $uni-color-success; |
||||
|
line-height: 60upx; |
||||
|
color: #fff; |
||||
|
border-left: 1px #ccc solid; |
||||
|
transition: all 0.3s; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.button { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
position: relative; |
||||
|
flex-shrink: 0; |
||||
|
width: 0; |
||||
|
transition: all 0.2s linear; |
||||
|
white-space: nowrap; |
||||
|
overflow: hidden; |
||||
|
&.active { |
||||
|
padding-left: 15upx; |
||||
|
width: 100upx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
@font-face { |
||||
|
font-family: 'iconfont'; |
||||
|
src: url('https://at.alicdn.com/t/font_989023_efq0mtli526.ttf') format('truetype'); |
||||
|
} |
||||
|
.icon { |
||||
|
font-family: iconfont; |
||||
|
font-size: 32upx; |
||||
|
font-style: normal; |
||||
|
color: #999; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,173 @@ |
|||||
|
<template> |
||||
|
<view class='refreshBox' :style="isTranform"> |
||||
|
<view class='refresh' :style="isZoom" :class="isEnd==2?'animationSmall':''"> |
||||
|
<view class='refreshWord' v-if="isEnd == 0">松开刷新</view> |
||||
|
<view class='refreshCirle animation' v-if="isEnd == 1"></view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: 'refresh', |
||||
|
props: { |
||||
|
isTop:{ |
||||
|
type:Number, |
||||
|
default:1 |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
isTranf: 0, |
||||
|
touchStart: '', |
||||
|
touchMove: '', |
||||
|
isEnd: 0 |
||||
|
}; |
||||
|
}, |
||||
|
|
||||
|
methods: { |
||||
|
refreshStart(e) { |
||||
|
if (this.isEnd == 0 && this.isTop == 1) { |
||||
|
this.touchStart = e.changedTouches[0].pageY |
||||
|
} |
||||
|
}, |
||||
|
refreshMove(e){ |
||||
|
if (this.isEnd == 0 && this.isTop == 1) { |
||||
|
var touchStart = this.touchStart, |
||||
|
oldMove = this.touchMove, |
||||
|
newMove = e.changedTouches[0].pageY |
||||
|
if (touchStart <= newMove) { |
||||
|
var isTranf = touchStart > newMove ? 0 : newMove - touchStart |
||||
|
this.isTranf = isTranf |
||||
|
this.touchMove = e.changedTouches[0].pageY |
||||
|
} |
||||
|
} else{ |
||||
|
this.isTranf = 0 |
||||
|
this.isEnd = 0 |
||||
|
this.touchStart = 9999 |
||||
|
} |
||||
|
}, |
||||
|
refreshEnd(e) { |
||||
|
var that = this |
||||
|
if (this.isEnd == 0 && this.isTop == 1) { |
||||
|
if (this.isTranf >= 90) { |
||||
|
this.isTranf = 125 |
||||
|
this.isEnd = 1 |
||||
|
this.$emit('isRefresh'); |
||||
|
} else { |
||||
|
this.isTranf = 0 |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
endAfter(){ |
||||
|
this.isEnd = 2 |
||||
|
setTimeout(() => { |
||||
|
this.isTranf = 0 |
||||
|
this.isEnd = 0 |
||||
|
}, 600) |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
isTranform() { |
||||
|
var isTranf = this.isTranf > 150 ? 150 : this.isTranf |
||||
|
var isTemp = `transform: translateY(${isTranf-100}px);` |
||||
|
return isTemp |
||||
|
}, |
||||
|
isZoom() { |
||||
|
var isTranf = this.isTranf > 125 ? 125 : this.isTranf |
||||
|
var isTemp = `zoom:${isTranf/125};` |
||||
|
return isTemp |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
.refreshBox { |
||||
|
margin:0 auto; |
||||
|
width: 100%; |
||||
|
height: 100upx; |
||||
|
overflow: hidden; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
max-height: 300upx; |
||||
|
position: fixed; |
||||
|
z-index: 999; |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
transform: translateY(-100upx); |
||||
|
} |
||||
|
|
||||
|
.animationSmall { |
||||
|
animation: small 1.1s both; |
||||
|
} |
||||
|
|
||||
|
@keyframes small { |
||||
|
0% { |
||||
|
transform: scale(1) |
||||
|
} |
||||
|
20%{ |
||||
|
transform: scale(1.4) |
||||
|
} |
||||
|
100% { |
||||
|
transform: scale(0) |
||||
|
} |
||||
|
} |
||||
|
.refreshWord{ |
||||
|
width: 150upx; |
||||
|
height: 26upx; |
||||
|
font-size: 24upx; |
||||
|
line-height: 26upx; |
||||
|
text-align: center; |
||||
|
border-radius: 26upx; |
||||
|
} |
||||
|
|
||||
|
.refresh { |
||||
|
min-width: 50upx; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
height: 50upx; |
||||
|
background: #FFFFFF; |
||||
|
box-shadow: 0 0 16upx 0 rgba(0, 0, 0, 0.10); |
||||
|
border-radius: 50upx; |
||||
|
} |
||||
|
|
||||
|
.refreshCirle { |
||||
|
width: 26upx; |
||||
|
height: 26upx; |
||||
|
border-radius: 50%; |
||||
|
display: inline-block; |
||||
|
position: relative; |
||||
|
border: 6upx solid black; |
||||
|
border-bottom-color: transparent; |
||||
|
border-top-color: transparent; |
||||
|
} |
||||
|
|
||||
|
.animation { |
||||
|
animation: rotate 1.1s infinite; |
||||
|
animation-timing-function: cubic-bezier(0.3, 1.65, 0.7, -0.65); |
||||
|
} |
||||
|
|
||||
|
@keyframes rotate { |
||||
|
0% { |
||||
|
transform: rotate(0deg); |
||||
|
} |
||||
|
|
||||
|
100% { |
||||
|
transform: rotate(360deg); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.true { |
||||
|
color: black; |
||||
|
} |
||||
|
|
||||
|
.iconYes { |
||||
|
width: 34upx; |
||||
|
height: 34upx; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,368 @@ |
|||||
|
<template> |
||||
|
<view> |
||||
|
<view |
||||
|
class="fab-box fab" |
||||
|
:class="{ |
||||
|
leftBottom: leftBottom, |
||||
|
rightBottom: rightBottom, |
||||
|
leftTop: leftTop, |
||||
|
rightTop: rightTop |
||||
|
}" |
||||
|
> |
||||
|
<view |
||||
|
class="fab-circle" |
||||
|
:class="{ |
||||
|
left: horizontal === 'left' && direction === 'horizontal', |
||||
|
top: vertical === 'top' && direction === 'vertical', |
||||
|
bottom: vertical === 'bottom' && direction === 'vertical', |
||||
|
right: horizontal === 'right' && direction === 'horizontal' |
||||
|
}" |
||||
|
:style="{ 'background-color': styles.buttonColor }" |
||||
|
@click="open" |
||||
|
> |
||||
|
<text class="icon icon-jia" :class="{ active: showContent }"></text> |
||||
|
</view> |
||||
|
<view |
||||
|
class="fab-content" |
||||
|
:class="{ |
||||
|
left: horizontal === 'left', |
||||
|
right: horizontal === 'right', |
||||
|
flexDirection: direction === 'vertical', |
||||
|
flexDirectionStart: flexDirectionStart, |
||||
|
flexDirectionEnd: flexDirectionEnd |
||||
|
}" |
||||
|
:style="{ width: boxWidth, height: boxHeight, background: styles.backgroundColor }" |
||||
|
> |
||||
|
<view v-if="flexDirectionStart || horizontalLeft" class="fab-item first"></view> |
||||
|
<view |
||||
|
class="fab-item" |
||||
|
v-for="(item, index) in content" |
||||
|
:key="index" |
||||
|
:class="{ active: showContent }" |
||||
|
:style="{ |
||||
|
color: item.active ? styles.selectedColor : styles.color |
||||
|
}" |
||||
|
@click="taps(index, item)" |
||||
|
> |
||||
|
<image |
||||
|
class="content-image" |
||||
|
:src="item.active ? item.selectedIconPath : item.iconPath" |
||||
|
mode="" |
||||
|
></image> |
||||
|
<text class="text">{{ item.text }}</text> |
||||
|
</view> |
||||
|
<view v-if="flexDirectionEnd || horizontalRight" class="fab-item first"></view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
props: { |
||||
|
pattern: { |
||||
|
type: Object, |
||||
|
default: () => { |
||||
|
return {}; |
||||
|
} |
||||
|
}, |
||||
|
horizontal: { |
||||
|
type: String, |
||||
|
default: 'left' |
||||
|
}, |
||||
|
vertical: { |
||||
|
type: String, |
||||
|
default: 'bottom' |
||||
|
}, |
||||
|
direction: { |
||||
|
type: String, |
||||
|
default: 'horizontal' |
||||
|
}, |
||||
|
content: { |
||||
|
type: Array, |
||||
|
default: () => { |
||||
|
return []; |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
fabShow: false, |
||||
|
flug: true, |
||||
|
showContent: false, |
||||
|
styles: { |
||||
|
color: '#3c3e49', |
||||
|
selectedColor: '#007AFF', |
||||
|
backgroundColor: '#fff', |
||||
|
buttonColor: '#3c3e49' |
||||
|
} |
||||
|
}; |
||||
|
}, |
||||
|
created() { |
||||
|
if (this.top === 0) { |
||||
|
this.fabShow = true; |
||||
|
} |
||||
|
// 初始化样式 |
||||
|
this.styles = Object.assign({}, this.styles, this.pattern); |
||||
|
}, |
||||
|
methods: { |
||||
|
open() { |
||||
|
this.showContent = !this.showContent; |
||||
|
}, |
||||
|
/** |
||||
|
* 按钮点击事件 |
||||
|
*/ |
||||
|
taps(index, item) { |
||||
|
this.$emit('trigger', { |
||||
|
index, |
||||
|
item |
||||
|
}); |
||||
|
}, |
||||
|
/** |
||||
|
* 获取 位置信息 |
||||
|
*/ |
||||
|
getPosition(types, paramA, paramB) { |
||||
|
if (types === 0) { |
||||
|
return this.horizontal === paramA && this.vertical === paramB; |
||||
|
} else if (types === 1) { |
||||
|
return this.direction === paramA && this.vertical === paramB; |
||||
|
} else if (types === 2) { |
||||
|
return this.direction === paramA && this.horizontal === paramB; |
||||
|
} else { |
||||
|
return this.showContent && this.direction === paramA |
||||
|
? this.contentWidth |
||||
|
: this.contentWidthMin; |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
watch: { |
||||
|
pattern(newValue, oldValue) { |
||||
|
console.log(JSON.stringify(newValue)); |
||||
|
this.styles = Object.assign({}, this.styles, newValue); |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
contentWidth(e) { |
||||
|
return uni.upx2px((this.content.length + 1) * 110 + 20) + 'px'; |
||||
|
}, |
||||
|
contentWidthMin() { |
||||
|
return uni.upx2px(110) + 'px'; |
||||
|
}, |
||||
|
// 动态计算宽度 |
||||
|
boxWidth() { |
||||
|
return this.getPosition(3, 'horizontal'); |
||||
|
}, |
||||
|
// 动态计算高度 |
||||
|
boxHeight() { |
||||
|
return this.getPosition(3, 'vertical'); |
||||
|
}, |
||||
|
// 计算左下位置 |
||||
|
leftBottom() { |
||||
|
return this.getPosition(0, 'left', 'bottom'); |
||||
|
}, |
||||
|
// 计算右下位置 |
||||
|
rightBottom() { |
||||
|
return this.getPosition(0, 'right', 'bottom'); |
||||
|
}, |
||||
|
// 计算左上位置 |
||||
|
leftTop() { |
||||
|
return this.getPosition(0, 'left', 'top'); |
||||
|
}, |
||||
|
rightTop() { |
||||
|
return this.getPosition(0, 'right', 'top'); |
||||
|
}, |
||||
|
flexDirectionStart() { |
||||
|
return this.getPosition(1, 'vertical', 'top'); |
||||
|
}, |
||||
|
flexDirectionEnd() { |
||||
|
return this.getPosition(1, 'vertical', 'bottom'); |
||||
|
}, |
||||
|
horizontalLeft() { |
||||
|
return this.getPosition(2, 'horizontal', 'left'); |
||||
|
}, |
||||
|
horizontalRight() { |
||||
|
return this.getPosition(2, 'horizontal', 'right'); |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
.fab-box { |
||||
|
position: fixed; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
z-index: 2; |
||||
|
} |
||||
|
|
||||
|
.fab-box.top { |
||||
|
width: 60upx; |
||||
|
height: 60upx; |
||||
|
right: 30upx; |
||||
|
bottom: 60upx; |
||||
|
border: 1px #5989b9 solid; |
||||
|
background: #6699cc; |
||||
|
border-radius: 10upx; |
||||
|
color: #fff; |
||||
|
transition: all 0.3; |
||||
|
opacity: 0; |
||||
|
} |
||||
|
|
||||
|
.fab-box.active { |
||||
|
opacity: 1; |
||||
|
} |
||||
|
|
||||
|
.fab-box.fab { |
||||
|
z-index: 10; |
||||
|
} |
||||
|
|
||||
|
.fab-box.fab.leftBottom { |
||||
|
left: 30upx; |
||||
|
bottom: 60upx; |
||||
|
} |
||||
|
|
||||
|
.fab-box.fab.leftTop { |
||||
|
left: 30upx; |
||||
|
top: 80upx; |
||||
|
/* #ifdef H5 */ |
||||
|
top: calc(80upx + var(--window-top)); |
||||
|
/* #endif */ |
||||
|
} |
||||
|
|
||||
|
.fab-box.fab.rightBottom { |
||||
|
right: 30upx; |
||||
|
bottom: 60upx; |
||||
|
} |
||||
|
|
||||
|
.fab-box.fab.rightTop { |
||||
|
right: 30upx; |
||||
|
top: 80upx; |
||||
|
/* #ifdef H5 */ |
||||
|
top: calc(80upx + var(--window-top)); |
||||
|
/* #endif */ |
||||
|
} |
||||
|
|
||||
|
.fab-circle { |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
position: absolute; |
||||
|
width: 110upx; |
||||
|
height: 110upx; |
||||
|
background: #3c3e49; |
||||
|
/* background: #5989b9; */ |
||||
|
border-radius: 50%; |
||||
|
box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.2); |
||||
|
z-index: 11; |
||||
|
} |
||||
|
|
||||
|
.fab-circle.left { |
||||
|
left: 0; |
||||
|
} |
||||
|
|
||||
|
.fab-circle.right { |
||||
|
right: 0; |
||||
|
} |
||||
|
|
||||
|
.fab-circle.top { |
||||
|
top: 0; |
||||
|
} |
||||
|
|
||||
|
.fab-circle.bottom { |
||||
|
bottom: 0; |
||||
|
} |
||||
|
|
||||
|
.fab-circle .icon-jia { |
||||
|
color: #ffffff; |
||||
|
font-size: 50upx; |
||||
|
transition: all 0.3s; |
||||
|
} |
||||
|
|
||||
|
.fab-circle .icon-jia.active { |
||||
|
transform: rotate(135deg); |
||||
|
} |
||||
|
|
||||
|
.fab-content { |
||||
|
background: #6699cc; |
||||
|
box-sizing: border-box; |
||||
|
display: flex; |
||||
|
border-radius: 100upx; |
||||
|
overflow: hidden; |
||||
|
box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1); |
||||
|
transition: all 0.2s; |
||||
|
width: 110upx; |
||||
|
} |
||||
|
|
||||
|
.fab-content.left { |
||||
|
justify-content: flex-start; |
||||
|
} |
||||
|
|
||||
|
.fab-content.right { |
||||
|
justify-content: flex-end; |
||||
|
} |
||||
|
|
||||
|
.fab-content.flexDirection { |
||||
|
flex-direction: column; |
||||
|
justify-content: flex-end; |
||||
|
} |
||||
|
|
||||
|
.fab-content.flexDirectionStart { |
||||
|
flex-direction: column; |
||||
|
justify-content: flex-start; |
||||
|
} |
||||
|
|
||||
|
.fab-content.flexDirectionEnd { |
||||
|
flex-direction: column; |
||||
|
justify-content: flex-end; |
||||
|
} |
||||
|
|
||||
|
.fab-content .fab-item { |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
width: 110upx; |
||||
|
height: 110upx; |
||||
|
font-size: 24upx; |
||||
|
color: #fff; |
||||
|
opacity: 0; |
||||
|
transition: opacity 0.2s; |
||||
|
} |
||||
|
|
||||
|
.fab-content .fab-item.active { |
||||
|
opacity: 1; |
||||
|
} |
||||
|
|
||||
|
.fab-content .fab-item .content-image { |
||||
|
width: 50upx; |
||||
|
height: 50upx; |
||||
|
margin-bottom: 5upx; |
||||
|
} |
||||
|
|
||||
|
.fab-content .fab-item.first { |
||||
|
width: 110upx; |
||||
|
} |
||||
|
|
||||
|
@font-face { |
||||
|
font-family: 'iconfont'; |
||||
|
src: url('https://at.alicdn.com/t/font_1028200_xhbo4rn58rp.ttf?t=1548214263520') |
||||
|
format('truetype'); |
||||
|
} |
||||
|
|
||||
|
.icon { |
||||
|
font-family: 'iconfont' !important; |
||||
|
font-size: 16px; |
||||
|
font-style: normal; |
||||
|
-webkit-font-smoothing: antialiased; |
||||
|
-moz-osx-font-smoothing: grayscale; |
||||
|
} |
||||
|
|
||||
|
.icon-jia:before { |
||||
|
content: '\e630'; |
||||
|
} |
||||
|
|
||||
|
.icon-arrow-up:before { |
||||
|
content: '\e603'; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,35 @@ |
|||||
|
### Icon 图标 |
||||
|
|
||||
|
用于展示 icon，组件名：``uni-icon``，代码块： uIcon。 |
||||
|
|
||||
|
**使用方式：** |
||||
|
|
||||
|
在 ``script`` 中引用组件 |
||||
|
|
||||
|
```javascript |
||||
|
import uniIcon from "@/components/uni-icon/uni-icon.vue" |
||||
|
export default { |
||||
|
components: {uniIcon} |
||||
|
} |
||||
|
``` |
||||
|
|
||||
|
在 ``template`` 中使用组件 |
||||
|
|
||||
|
```html |
||||
|
<uni-icon type="contact" size="30"></uni-icon> |
||||
|
``` |
||||
|
|
||||
|
实际效果参考：[https://github.com/dcloudio/uni-ui](https://github.com/dcloudio/uni-ui) |
||||
|
|
||||
|
**Icon 属性说明：** |
||||
|
|
||||
|
|属性名 |类型|默认值 |说明| |
||||
|
|---|----|---|---| |
||||
|
|type |String |-|图标图案，参考下表| |
||||
|
|color |String |-|图标颜色 | |
||||
|
|size |Number |24|图标大小| |
||||
|
|@click |EventHandle|-|点击 Icon 触发事件| |
||||
|
|
||||
|
**type 类型：** |
||||
|
|
||||
|
 |
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,57 @@ |
|||||
|
import Request from './request' |
||||
|
const test = new Request(); |
||||
|
test.setConfig((config) => { /* 设置全局配置 */ |
||||
|
config.baseUrl = 'http://www.aaa.cn'; |
||||
|
config.header = { |
||||
|
a: 1, |
||||
|
b: 2 |
||||
|
} |
||||
|
return config |
||||
|
}) |
||||
|
test.interceptor.request((config, cancel) => { /* 请求之前拦截器 */ |
||||
|
config.header = { |
||||
|
...config.header, |
||||
|
a: 1 |
||||
|
} |
||||
|
/* |
||||
|
if (!token) { // 如果token不存在，调用cancel 会取消本次请求，但是该函数的catch() 仍会执行
|
||||
|
cancel('token 不存在') // 接收一个参数，会传给catch((err) => {}) err.errMsg === 'token 不存在'
|
||||
|
} |
||||
|
*/ |
||||
|
return config; |
||||
|
}) |
||||
|
test.interceptor.response((response) => { /* 请求之后拦截器 */ |
||||
|
return response; |
||||
|
}) |
||||
|
|
||||
|
const http = new Request(); |
||||
|
http.setConfig((config) => { /* 设置全局配置 */ |
||||
|
config.baseUrl = 'http://www.bbb.cn'; /* 根域名不同 */ |
||||
|
config.header = { |
||||
|
a: 1, |
||||
|
b: 2 |
||||
|
} |
||||
|
return config |
||||
|
}) |
||||
|
http.interceptor.request((config, cancel) => { /* 请求之前拦截器 */ |
||||
|
config.header = { |
||||
|
...config.header, |
||||
|
b: 1 |
||||
|
} |
||||
|
/* |
||||
|
if (!token) { // 如果token不存在，调用cancel 会取消本次请求，但是该函数的catch() 仍会执行
|
||||
|
cancel('token 不存在') // 接收一个参数，会传给catch((err) => {}) err.errMsg === 'token 不存在'
|
||||
|
} |
||||
|
*/ |
||||
|
return config; |
||||
|
}) |
||||
|
http.interceptor.response((response) => { /* 请求之后拦截器 */ |
||||
|
console.log(response); |
||||
|
return response; |
||||
|
}) |
||||
|
export { |
||||
|
http, |
||||
|
test |
||||
|
}; |
||||
|
|
||||
|
|
||||
@ -0,0 +1,148 @@ |
|||||
|
**插件使用说明** |
||||
|
|
||||
|
- 基于 Promise 对象实现更简单的 request 使用方式，支持请求和响应拦截 |
||||
|
- 支持全局挂载 |
||||
|
- 支持多个全局配置实例 |
||||
|
- 支持typescript、javascript 版本(如果不使用ts版本，则可以把luch-request-ts 文件夹删除) |
||||
|
- 下载后把 http-request 文件夹放到项目 utils/ 目录下 |
||||
|
|
||||
|
|
||||
|
**Example** |
||||
|
--- |
||||
|
创建实例 |
||||
|
|
||||
|
``` javascript |
||||
|
const http = new Request(); |
||||
|
``` |
||||
|
|
||||
|
执行` GET `请求 |
||||
|
|
||||
|
``` javascript |
||||
|
http.get('/user/login', {userName: 'name', password: '123456'}).then(res => { |
||||
|
|
||||
|
}).catch(err => { |
||||
|
|
||||
|
}) |
||||
|
// 局部修改配置，局部配置优先级高于全局配置 |
||||
|
http.get('/user/login', {userName: 'name', password: '123456'}, { |
||||
|
header: {}, /* 会覆盖全局header */ |
||||
|
dataType: 'json', |
||||
|
responseType: 'text' |
||||
|
}).then(res => { |
||||
|
|
||||
|
}).catch(err => { |
||||
|
|
||||
|
}) |
||||
|
``` |
||||
|
执行` POST `请求 |
||||
|
|
||||
|
``` javascript |
||||
|
http.post('/user/login', {userName: 'name', password: '123456'} ).then(res => { |
||||
|
|
||||
|
}).catch(err => { |
||||
|
|
||||
|
}) |
||||
|
// 局部修改配置，局部配置优先级高于全局配置 |
||||
|
http.post('/user/login', {userName: 'name', password: '123456'}, { |
||||
|
header: {}, /* 会覆盖全局header */ |
||||
|
dataType: 'json', |
||||
|
responseType: 'text' |
||||
|
}).then(res => { |
||||
|
|
||||
|
}).catch(err => { |
||||
|
|
||||
|
}) |
||||
|
``` |
||||
|
|
||||
|
**全局请求配置** |
||||
|
-- |
||||
|
``` javascript |
||||
|
{ |
||||
|
baseUrl: '', /* 全局根路径，需要注意，如果请求的路径为绝对路径，则不会应用baseUrl */ |
||||
|
header: { |
||||
|
'Content-Type': 'application/json;charset=UTF-8' |
||||
|
}, |
||||
|
method: 'GET', |
||||
|
dataType: 'json', |
||||
|
responseType: 'text' |
||||
|
} |
||||
|
``` |
||||
|
|
||||
|
|
||||
|
全局配置修改` setConfig ` |
||||
|
|
||||
|
``` javascript |
||||
|
/** |
||||
|
* @description 修改全局默认配置 |
||||
|
* @param {Function} |
||||
|
*/ |
||||
|
http.setConfig((config) => { /* config 为默认全局配置*/ |
||||
|
config.baseUrl = 'http://www.bbb.cn'; /* 根域名 */ |
||||
|
config.header = { |
||||
|
a: 1, |
||||
|
b: 2 |
||||
|
} |
||||
|
return config |
||||
|
}) |
||||
|
``` |
||||
|
|
||||
|
**拦截器** |
||||
|
-- |
||||
|
|
||||
|
在请求之前拦截 |
||||
|
|
||||
|
``` javascript |
||||
|
/** |
||||
|
* @param { Function} cancel - 取消请求,调用cancel 会取消本次请求，但是该函数的catch() 仍会执行 |
||||
|
* |
||||
|
* @param {String} text ['handle cancel'| any] - catch((err) => {}) err.errMsg === 'handle cancel'。非必传，默认'handle cancel' |
||||
|
* @cancel {Object} config - catch((err) => {}) err.config === config; 非必传，默认为request拦截器修改之前的config |
||||
|
* function cancel(text, config) {} |
||||
|
*/ |
||||
|
http.interceptor.request((config, cancel) => { /* cancel 为函数，如果调用会取消本次请求。需要注意：调用cancel,本次请求的catch仍会执行。必须return config */ |
||||
|
config.header = { |
||||
|
...config.header, |
||||
|
a: 1 |
||||
|
} |
||||
|
/* |
||||
|
if (!token) { // 如果token不存在，调用cancel 会取消本次请求，但是该函数的catch() 仍会执行 |
||||
|
cancel('token 不存在', config) // 把修改后的config传入，之后响应就可以拿到修改后的config。 如果调用了cancel但是不传修改后的config，则catch((err) => {}) err.config 为request拦截器修改之前的config |
||||
|
} |
||||
|
*/ |
||||
|
return config; |
||||
|
}) |
||||
|
``` |
||||
|
|
||||
|
在请求之后拦截 |
||||
|
|
||||
|
``` javascript |
||||
|
http.interceptor.response((response) => { /* 必须return response*/ |
||||
|
console.log(response); |
||||
|
return response; |
||||
|
}) |
||||
|
``` |
||||
|
|
||||
|
**typescript使用** |
||||
|
-- |
||||
|
在` request.ts `里还暴露了五个接口 |
||||
|
```javascript |
||||
|
{ |
||||
|
options, // request 方法配置参数 |
||||
|
handleOptions, // get/post 方法配置参数 |
||||
|
config, // init 全局config接口(setConfig 参数接口) |
||||
|
requestConfig, // 请求之前参数配置项 |
||||
|
response // 响应体 |
||||
|
} |
||||
|
``` |
||||
|
|
||||
|
|
||||
|
**issue** |
||||
|
-- |
||||
|
有任何问题或者建议可以=> <a href="https://ask.dcloud.net.cn/question/74922" target="_blank">issue提交</a>,先给个五星好评QAQ!! |
||||
|
|
||||
|
|
||||
|
**作者想说** |
||||
|
-- |
||||
|
- 主体代码3kb |
||||
|
- 目前该插件已经上项目，遇到任何问题请先检查自己的代码（排除新版本发布的情况）。最近新上了` typescript ` 版本，因为本人没使用过ts,所以写的不好的地方，还请见谅~ |
||||
|
####创作不易，五星好评你懂得！ |
||||
@ -0,0 +1,111 @@ |
|||||
|
/** |
||||
|
* Request 0.0.8 |
||||
|
* @Class uni-app request网络请求库 |
||||
|
* @Author lu-ch |
||||
|
* @Date 2019-07-25 |
||||
|
* @Email webwork.s@qq.com |
||||
|
* http://ext.dcloud.net.cn/plugin?id=392
|
||||
|
* **/ |
||||
|
export default class Request { |
||||
|
config = { |
||||
|
baseUrl: '', |
||||
|
header: { |
||||
|
'Content-Type': 'application/json;charset=UTF-8' |
||||
|
}, |
||||
|
method: 'GET', |
||||
|
dataType: 'json', |
||||
|
responseType: 'text' |
||||
|
} |
||||
|
|
||||
|
static posUrl (url) { /* 判断url是否为绝对路径 */ |
||||
|
return /(http|https):\/\/([\w.]+\/?)\S*/.test(url) |
||||
|
} |
||||
|
|
||||
|
interceptor = { |
||||
|
request: (f) => { |
||||
|
if (f) { |
||||
|
this.requestBeforeFun = f |
||||
|
} |
||||
|
}, |
||||
|
response: (f) => { |
||||
|
if (f) { |
||||
|
this.requestComFun = f |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
static requestBeforeFun (config) { |
||||
|
return config |
||||
|
} |
||||
|
|
||||
|
static requestComFun (response) { |
||||
|
return response |
||||
|
} |
||||
|
|
||||
|
setConfig (f) { |
||||
|
this.config = f(this.config) |
||||
|
} |
||||
|
|
||||
|
request (options = {}) { |
||||
|
options.baseUrl = this.config.baseUrl |
||||
|
options.dataType = options.dataType || this.config.dataType |
||||
|
options.responseType = options.responseType || this.config.responseType |
||||
|
options.url = Request.posUrl(options.url) ? options.url : (options.baseUrl + options.url) |
||||
|
options.data = options.data || {} |
||||
|
options.header = options.header || this.config.header |
||||
|
options.method = options.method || this.config.method |
||||
|
return new Promise((resolve, reject) => { |
||||
|
let next = true |
||||
|
let _config = null |
||||
|
options.complete = (response) => { |
||||
|
let statusCode = response.statusCode |
||||
|
response.config = _config |
||||
|
response = this.requestComFun(response) |
||||
|
if (statusCode === 200) { // 成功
|
||||
|
resolve(response) |
||||
|
} else { |
||||
|
reject(response) |
||||
|
} |
||||
|
} |
||||
|
let cancel = (t = 'handle cancel', config = options) => { |
||||
|
let err = { |
||||
|
errMsg: t, |
||||
|
config: config |
||||
|
} |
||||
|
reject(err) |
||||
|
next = false |
||||
|
} |
||||
|
|
||||
|
_config = { ...this.requestBeforeFun(options, cancel) } |
||||
|
if (!next) return |
||||
|
uni.request(_config) |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
get (url, data, options = {}) { |
||||
|
return this.request({ |
||||
|
url, |
||||
|
data, |
||||
|
method: 'GET', |
||||
|
...options |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
post (url, data, options = {}) { |
||||
|
return this.request({ |
||||
|
url, |
||||
|
data, |
||||
|
method: 'POST', |
||||
|
...options |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
del (url, data, options = {}) { |
||||
|
return this.request({ |
||||
|
url, |
||||
|
data, |
||||
|
method: 'DELETE', |
||||
|
...options |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,12 @@ |
|||||
|
import Vue from 'vue' |
||||
|
import App from './App' |
||||
|
import './common/dateUtils' |
||||
|
|
||||
|
Vue.config.productionTip = false |
||||
|
|
||||
|
App.mpType = 'app' |
||||
|
|
||||
|
const app = new Vue({ |
||||
|
...App |
||||
|
}) |
||||
|
app.$mount() |
||||
@ -0,0 +1,76 @@ |
|||||
|
{ |
||||
|
"name" : "deviceIDApp", |
||||
|
"appid" : "__UNI__1E9AE51", |
||||
|
"description" : "", |
||||
|
"versionName" : "1.0.0", |
||||
|
"versionCode" : "100", |
||||
|
"transformPx" : false, |
||||
|
/* 5+App特有相关 */ |
||||
|
"app-plus" : { |
||||
|
"usingComponents" : true, |
||||
|
"splashscreen" : { |
||||
|
"alwaysShowBeforeRender" : true, |
||||
|
"waiting" : true, |
||||
|
"autoclose" : true, |
||||
|
"delay" : 0 |
||||
|
}, |
||||
|
/* 模块配置 */ |
||||
|
"modules" : {}, |
||||
|
/* 应用发布信息 */ |
||||
|
"distribute" : { |
||||
|
/* android打包配置 */ |
||||
|
"android" : { |
||||
|
"permissions" : [ |
||||
|
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.VIBRATE\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>", |
||||
|
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.CAMERA\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.CALL_PHONE\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>", |
||||
|
"<uses-feature android:name=\"android.hardware.camera\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>", |
||||
|
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>" |
||||
|
] |
||||
|
}, |
||||
|
/* ios打包配置 */ |
||||
|
"ios" : {}, |
||||
|
/* SDK配置 */ |
||||
|
"sdkConfigs" : {} |
||||
|
} |
||||
|
}, |
||||
|
/* 快应用特有相关 */ |
||||
|
"quickapp" : {}, |
||||
|
/* 小程序特有相关 */ |
||||
|
"mp-weixin" : { |
||||
|
"appid" : "wx7ee0db110b58b021", |
||||
|
"setting" : { |
||||
|
"urlCheck" : true, |
||||
|
"minified" : true, |
||||
|
"postcss" : true, |
||||
|
"es6" : true |
||||
|
}, |
||||
|
"usingComponents" : true |
||||
|
}, |
||||
|
"mp-alipay" : { |
||||
|
"usingComponents" : true |
||||
|
}, |
||||
|
"mp-baidu" : { |
||||
|
"usingComponents" : true |
||||
|
}, |
||||
|
"mp-toutiao" : { |
||||
|
"usingComponents" : true |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,39 @@ |
|||||
|
{ |
||||
|
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages |
||||
|
|
||||
|
{ |
||||
|
"path": "pages/device/device", |
||||
|
"style": {"navigationBarTitleText": "设备"} |
||||
|
} |
||||
|
,{ |
||||
|
"path" : "pages/about/about", |
||||
|
"style" : {"navigationBarTitleText": "关于"} |
||||
|
} |
||||
|
], |
||||
|
"globalStyle": { |
||||
|
"navigationBarTextStyle": "black", |
||||
|
"navigationBarTitleText": "设备管理", |
||||
|
"navigationBarBackgroundColor": "#F8F8F8", |
||||
|
"backgroundColor": "#F8F8F8" |
||||
|
}, |
||||
|
"tabBar": { |
||||
|
"backgroundColor": "#ffffff", |
||||
|
"color": "#cdcdcd", |
||||
|
"selectedColor": "#50B7EA", |
||||
|
"borderStyle": "white", |
||||
|
"list": [ |
||||
|
{ |
||||
|
"pagePath": "pages/device/device", |
||||
|
"iconPath": "static/device.png", |
||||
|
"selectedIconPath": "static/device_active.png", |
||||
|
"text": "设备" |
||||
|
}, |
||||
|
{ |
||||
|
"pagePath": "pages/about/about", |
||||
|
"iconPath": "static/about.png", |
||||
|
"selectedIconPath": "static/about_active.png", |
||||
|
"text": "关于" |
||||
|
} |
||||
|
] |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,22 @@ |
|||||
|
<template> |
||||
|
<view> |
||||
|
设备录入APP |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
|
||||
|
</style> |
||||
@ -0,0 +1,229 @@ |
|||||
|
<template> |
||||
|
<view @touchstart="refreshStart" @touchmove="refreshMove" @touchend="refreshEnd"> |
||||
|
<refresh ref="refresh" @isRefresh='isRefresh'></refresh> |
||||
|
<mSearch :mode="2" button="inside" @search="setSearch($event)" ></mSearch> |
||||
|
<scroll-view scroll-y="true" style="height:1000upx" @scrolltolower="scrolltolower" @scrolltoupper="scrolltoupper" show-scrollbar="true"> |
||||
|
<view class="cu-list menu-avatar margin-top"> |
||||
|
<view class="cu-item" :class="modalName=='move-box-'+ index?'move-cur':''" v-for="(item,index) in deviceList" :key="index" |
||||
|
@touchstart="ListTouchStart" @touchmove="ListTouchMove" @touchend="ListTouchEnd" :data-target="'move-box-' + index"> |
||||
|
<image src="/static/lora.png" class="cu-avatar round lg"></image> |
||||
|
<view class="content padding-tb-sm"> |
||||
|
<view> |
||||
|
<text class="text-lg">{{item.devEUI}}</text> |
||||
|
</view> |
||||
|
<view class="flex"> |
||||
|
<text class="flex-sub text-df text-black">{{item.devAddr}}</text> |
||||
|
<text class="flex-sub text-df text-grey">{{item.username}}</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="action"> |
||||
|
<view class="text-grey text-xs">{{item.createAt | dateFilter(true)}}</view> |
||||
|
<view class="text-grey text-xs">{{item.createAt | dateFilter(false)}}</view> |
||||
|
</view> |
||||
|
<view class="move"> |
||||
|
<view class="bg-red" @click="handleDeleteItem(item.id,index)">删除</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view style="text-align: center;">----------------底线----------------</view> |
||||
|
</scroll-view> |
||||
|
<uni-fab :pattern="pattern" :content="content" horizontal="right" vertical="bottom" direction="vertical" @trigger="trigger"></uni-fab> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import refresh from '@/components/refresh/refresh.vue'; |
||||
|
import mSearch from '@/components/mehaotian-search/mehaotian-search.vue'; |
||||
|
import uniFab from '@/components/uni-fab/uni-fab.vue'; |
||||
|
import { getDevice,postDevice,delDevice } from '@/api/device.js'; |
||||
|
|
||||
|
export default { |
||||
|
components: { |
||||
|
refresh, |
||||
|
mSearch, |
||||
|
uniFab |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
deviceList: [], |
||||
|
pattern: { |
||||
|
color: '#7A7E83', |
||||
|
backgroundColor: '#fff', |
||||
|
selectedColor: '#007AFF', |
||||
|
buttonColor:"#007AFF" |
||||
|
}, |
||||
|
content: [ |
||||
|
{ |
||||
|
iconPath: '/static/lora.png', |
||||
|
selectedIconPath: '/static/lora.png', |
||||
|
text: '添加终端', |
||||
|
active: false |
||||
|
} |
||||
|
], |
||||
|
userInfo: {}, |
||||
|
listTouchStart: 0, |
||||
|
listTouchDirection: null, |
||||
|
modalName: null, |
||||
|
total: 0, |
||||
|
offset: 0, |
||||
|
pageNum: 1, |
||||
|
limit: 10, |
||||
|
query: "" |
||||
|
}; |
||||
|
}, |
||||
|
onLoad(){ |
||||
|
this.getUserInfo(); |
||||
|
this.search(); |
||||
|
}, |
||||
|
filters:{ |
||||
|
dateFilter(msg,flag){ |
||||
|
const d = new Date(msg); |
||||
|
if(flag){ |
||||
|
return d.format('yyyy/MM/dd') |
||||
|
}else{ |
||||
|
return d.format('hh:mm:ss') |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
fetchDeviceList(content,limit,offset){ |
||||
|
getDevice(content,limit,offset).then(response => { |
||||
|
this.deviceList = response.data.data.result |
||||
|
this.total = response.data.data.total |
||||
|
}) |
||||
|
}, |
||||
|
handleDeleteItem(id,index){ |
||||
|
delDevice(id).then(response => { |
||||
|
if(response.data && response.data.code == 0){ |
||||
|
this.deviceList.splice(index, 1) |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
refreshStart(e) { |
||||
|
this.$refs.refresh.refreshStart(e); |
||||
|
}, |
||||
|
refreshMove(e){ |
||||
|
this.$refs.refresh.refreshMove(e); |
||||
|
}, |
||||
|
refreshEnd(e) { |
||||
|
this.$refs.refresh.refreshEnd(e); |
||||
|
}, |
||||
|
isRefresh(){ |
||||
|
setTimeout(() => { |
||||
|
this.search() |
||||
|
uni.showToast({ |
||||
|
icon: 'success', |
||||
|
title: '刷新成功' |
||||
|
}) |
||||
|
this.$refs.refresh.endAfter() //刷新结束调用 |
||||
|
}, 1000) |
||||
|
}, |
||||
|
setSearch(val) { |
||||
|
this.query = val |
||||
|
this.search() |
||||
|
}, |
||||
|
search(){ |
||||
|
this.fetchDeviceList(this.query,this.limit,this.offset) |
||||
|
}, |
||||
|
getUserInfo() { |
||||
|
uni.getUserInfo({ |
||||
|
provider: 'weixin', |
||||
|
success: (result) => { |
||||
|
this.userInfo = result.userInfo; |
||||
|
console.log(result); |
||||
|
}, |
||||
|
fail: (error) => { |
||||
|
console.log('getUserInfo fail', error); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
// ListTouch触摸开始 |
||||
|
ListTouchStart(e) { |
||||
|
this.listTouchStart = e.touches[0].pageX |
||||
|
}, |
||||
|
|
||||
|
// ListTouch计算方向 |
||||
|
ListTouchMove(e) { |
||||
|
this.listTouchDirection = this.listTouchStart - e.touches[0].pageX > 80 ? 'left' : 'right' |
||||
|
}, |
||||
|
|
||||
|
// ListTouch计算滚动 |
||||
|
ListTouchEnd(e) { |
||||
|
if (this.listTouchDirection == 'left') { |
||||
|
this.modalName = e.currentTarget.dataset.target |
||||
|
} else { |
||||
|
this.modalName = null |
||||
|
} |
||||
|
this.listTouchDirection = null |
||||
|
}, |
||||
|
scrolltolower(e){ |
||||
|
console.log(e) |
||||
|
this.offset = (this.pageNum - 1) * this.limit |
||||
|
if(this.offset > this.total) { |
||||
|
uni.showToast({ |
||||
|
icon: 'none', |
||||
|
title: '已经到底啦' |
||||
|
}) |
||||
|
return; |
||||
|
} |
||||
|
setTimeout(() => { |
||||
|
this.search() |
||||
|
this.$refs.refresh.endAfter() |
||||
|
}, 1000) |
||||
|
this.pageNum ++ |
||||
|
}, |
||||
|
scrolltoupper(e){ |
||||
|
console.log(e) |
||||
|
this.offset = 0 |
||||
|
this.pageNum = 1 |
||||
|
setTimeout(() => { |
||||
|
this.search() |
||||
|
this.$refs.refresh.endAfter() |
||||
|
}, 1000) |
||||
|
}, |
||||
|
trigger(e) { |
||||
|
console.log(e); |
||||
|
this.content[e.index].active = !e.item.active; |
||||
|
const that = this |
||||
|
uni.scanCode({ |
||||
|
onlyFromCamera: true, |
||||
|
success: function (res) { |
||||
|
console.log(res) |
||||
|
if(res.scanType == 'QR_CODE' && res.result){ |
||||
|
const arr = res.result.split('|') |
||||
|
if(arr.length >= 2){ |
||||
|
const dev = {devEUI:arr[0],devAddr:arr[1]} |
||||
|
if(that.userInfo){ |
||||
|
dev.username = that.userInfo.nickName |
||||
|
} |
||||
|
postDevice(dev).then(response => { |
||||
|
if(response.data){ |
||||
|
if(response.data.code == 0){ |
||||
|
that.search() |
||||
|
uni.showToast({ |
||||
|
icon: 'success', |
||||
|
title: '添加终端成功' |
||||
|
}) |
||||
|
}else{ |
||||
|
uni.showToast({ |
||||
|
icon: 'none', |
||||
|
title: '终端已存在' |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
.content { |
||||
|
margin-top: 10upx; |
||||
|
width: 100%; |
||||
|
} |
||||
|
</style> |
||||
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 3.8 KiB |
|
After Width: | Height: | Size: 3.8 KiB |
|
After Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 2.8 KiB |
@ -0,0 +1,106 @@ |
|||||
|
/** |
||||
|
* 这里是uni-app内置的常用样式变量 |
||||
|
* |
||||
|
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量 |
||||
|
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App |
||||
|
* |
||||
|
*/ |
||||
|
|
||||
|
/** |
||||
|
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能 |
||||
|
* |
||||
|
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件 |
||||
|
*/ |
||||
|
|
||||
|
/* 颜色变量 */ |
||||
|
|
||||
|
/* 行为相关颜色 */ |
||||
|
$uni-color-primary: #007aff; |
||||
|
$uni-color-success: #4cd964; |
||||
|
$uni-color-warning: #f0ad4e; |
||||
|
$uni-color-error: #dd524d; |
||||
|
|
||||
|
/* 文字基本颜色 */ |
||||
|
$uni-text-color:#333;//基本色 |
||||
|
$uni-text-color-inverse:#fff;//反色 |
||||
|
$uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息 |
||||
|
$uni-text-color-placeholder: #808080; |
||||
|
$uni-text-color-disable:#c0c0c0; |
||||
|
|
||||
|
/* 背景颜色 */ |
||||
|
$uni-bg-color:#ffffff; |
||||
|
$uni-bg-color-grey:#f8f8f8; |
||||
|
$uni-bg-color-hover:#f1f1f1;//点击状态颜色 |
||||
|
$uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色 |
||||
|
|
||||
|
/* 边框颜色 */ |
||||
|
$uni-border-color:#c8c7cc; |
||||
|
|
||||
|
/* 尺寸变量 */ |
||||
|
|
||||
|
/* 文字尺寸 */ |
||||
|
$uni-font-size-sm:24upx; |
||||
|
$uni-font-size-base:28upx; |
||||
|
$uni-font-size-lg:32upx; |
||||
|
|
||||
|
/* 图片尺寸 */ |
||||
|
$uni-img-size-sm:40upx; |
||||
|
$uni-img-size-base:52upx; |
||||
|
$uni-img-size-lg:80upx; |
||||
|
|
||||
|
/* Border Radius */ |
||||
|
$uni-border-radius-sm: 4upx; |
||||
|
$uni-border-radius-base: 6upx; |
||||
|
$uni-border-radius-lg: 12upx; |
||||
|
$uni-border-radius-circle: 50%; |
||||
|
|
||||
|
/* 水平间距 */ |
||||
|
$uni-spacing-row-sm: 10px; |
||||
|
$uni-spacing-row-base: 20upx; |
||||
|
$uni-spacing-row-lg: 30upx; |
||||
|
|
||||
|
/* 垂直间距 */ |
||||
|
$uni-spacing-col-sm: 8upx; |
||||
|
$uni-spacing-col-base: 16upx; |
||||
|
$uni-spacing-col-lg: 24upx; |
||||
|
|
||||
|
/* 透明度 */ |
||||
|
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度 |
||||
|
|
||||
|
/* 文章场景相关 */ |
||||
|
$uni-color-title: #2C405A; // 文章标题颜色 |
||||
|
$uni-font-size-title:40upx; |
||||
|
$uni-color-subtitle: #555555; // 二级标题颜色 |
||||
|
$uni-font-size-subtitle:36upx; |
||||
|
$uni-color-paragraph: #3F536E; // 文章段落颜色 |
||||
|
$uni-font-size-paragraph:30upx; |
||||
|
|
||||
|
// custom |
||||
|
|
||||
|
/* 页面左右间距 */ |
||||
|
$page-row-spacing: 30upx; |
||||
|
$page-color-base: #f8f8f8; |
||||
|
$page-color-light: #f8f6fc; |
||||
|
$base-color: #fa436a; |
||||
|
|
||||
|
/* 文字尺寸 */ |
||||
|
$font-sm: 24upx; |
||||
|
$font-base: 28upx; |
||||
|
$font-lg: 32upx; |
||||
|
/*文字颜色*/ |
||||
|
$font-color-dark: #303133; |
||||
|
$font-color-base: #606266; |
||||
|
$font-color-light: #909399; |
||||
|
$font-color-disabled: #C0C4CC; |
||||
|
$font-color-spec: #4399fc; |
||||
|
/* 边框颜色 */ |
||||
|
$border-color-dark: #DCDFE6; |
||||
|
$border-color-base: #E4E7ED; |
||||
|
$border-color-light: #EBEEF5; |
||||
|
/* 图片加载中颜色 */ |
||||
|
$image-bg-color: #eee; |
||||
|
/* 行为相关颜色 */ |
||||
|
$uni-color-primary:#fa436a; |
||||
|
$uni-color-success: #4cd964; |
||||
|
$uni-color-warning: #f0ad4e; |
||||
|
$uni-color-error: #dd524d; |
||||
Loading…
Reference in new issue