Commit 520cbda5b157d0d60bc0695520070f93dd7ae41b
1 parent
999ea060
我的钱包 充值
Showing
178 changed files
with
0 additions
and
24290 deletions
Too many changes.
To preserve performance only 100 of 178 files are displayed.
pages.json
pages/API/action-sheet/action-sheet.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-btn-v"> | ||
| 6 | - <button class="target" type="default" @tap="actionSheetTap">弹出action sheet</button> | ||
| 7 | - </view> | ||
| 8 | - </view> | ||
| 9 | - </view> | ||
| 10 | -</template> | ||
| 11 | -<script> | ||
| 12 | - export default { | ||
| 13 | - data() { | ||
| 14 | - return { | ||
| 15 | - title: 'action-sheet', | ||
| 16 | - buttonRect: {} | ||
| 17 | - } | ||
| 18 | - }, | ||
| 19 | - // #ifdef H5 | ||
| 20 | - onReady() { | ||
| 21 | - this.getNodeInfo() | ||
| 22 | - window.addEventListener('resize', this.getNodeInfo) | ||
| 23 | - }, | ||
| 24 | - beforeDestroy() { | ||
| 25 | - window.removeEventListener('resize', this.getNodeInfo) | ||
| 26 | - }, | ||
| 27 | - // #endif | ||
| 28 | - methods: { | ||
| 29 | - actionSheetTap() { | ||
| 30 | - const that = this | ||
| 31 | - uni.showActionSheet({ | ||
| 32 | - title: '标题', | ||
| 33 | - itemList: ['item1', 'item2', 'item3', 'item4'], | ||
| 34 | - popover: { | ||
| 35 | - // 104: navbar + topwindow 高度，暂时 fix createSelectorQuery 在 pc 上获取 top 不准确的 bug | ||
| 36 | - top: that.buttonRect.top + 104 + that.buttonRect.height, | ||
| 37 | - left: that.buttonRect.left + that.buttonRect.width / 2 | ||
| 38 | - }, | ||
| 39 | - success: (e) => { | ||
| 40 | - console.log(e.tapIndex); | ||
| 41 | - uni.showToast({ | ||
| 42 | - title: "点击了第" + e.tapIndex + "个选项", | ||
| 43 | - icon: "none" | ||
| 44 | - }) | ||
| 45 | - } | ||
| 46 | - }) | ||
| 47 | - }, | ||
| 48 | - // #ifdef H5 | ||
| 49 | - getNodeInfo() { | ||
| 50 | - uni.createSelectorQuery().select('.target').boundingClientRect().exec((ret) => { | ||
| 51 | - const rect = ret[0] | ||
| 52 | - if (rect) { | ||
| 53 | - this.buttonRect = rect | ||
| 54 | - } | ||
| 55 | - }); | ||
| 56 | - } | ||
| 57 | - // #endif | ||
| 58 | - } | ||
| 59 | - } | ||
| 60 | -</script> |
pages/API/add-phone-contact/add-phone-contact.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-common-mt"> | ||
| 5 | - <view class="uni-list"> | ||
| 6 | - <view class="uni-list-cell"> | ||
| 7 | - <view class="uni-list-cell-left"> | ||
| 8 | - <view class="uni-label">名称</view> | ||
| 9 | - </view> | ||
| 10 | - <view class="uni-list-cell-db"> | ||
| 11 | - <input class="uni-input" type="text" placeholder="请输入联系人名称" name="name" :value="name" @input="nameChange"/> | ||
| 12 | - </view> | ||
| 13 | - </view> | ||
| 14 | - <view class="uni-list-cell"> | ||
| 15 | - <view class="uni-list-cell-left"> | ||
| 16 | - <view class="uni-label">手机号</view> | ||
| 17 | - </view> | ||
| 18 | - <view class="uni-list-cell-db"> | ||
| 19 | - <input class="uni-input" type="text" placeholder="请输入联系人手机号" name="phone" :value="phone" @input="phoneChange"/> | ||
| 20 | - </view> | ||
| 21 | - </view> | ||
| 22 | - </view> | ||
| 23 | - <view class="uni-padding-wrap"> | ||
| 24 | - <view class="uni-btn-v"> | ||
| 25 | - <button type="primary" class="btn-setstorage" @tap="add">添加联系人</button> | ||
| 26 | - </view> | ||
| 27 | - </view> | ||
| 28 | - </view> | ||
| 29 | - </view> | ||
| 30 | -</template> | ||
| 31 | -<script> | ||
| 32 | - // #ifdef APP-PLUS | ||
| 33 | - import permision from "@/common/permission.js" | ||
| 34 | - // #endif | ||
| 35 | - export default { | ||
| 36 | - data() { | ||
| 37 | - return { | ||
| 38 | - title: 'addPhoneContact', | ||
| 39 | - name: '', | ||
| 40 | - phone: '' | ||
| 41 | - } | ||
| 42 | - }, | ||
| 43 | - methods: { | ||
| 44 | - nameChange: function(e) { | ||
| 45 | - this.name = e.detail.value | ||
| 46 | - }, | ||
| 47 | - phoneChange: function(e) { | ||
| 48 | - this.phone = e.detail.value | ||
| 49 | - }, | ||
| 50 | - async add() { | ||
| 51 | - // #ifdef APP-PLUS | ||
| 52 | - let status = await this.checkPermission(); | ||
| 53 | - if (status !== 1) { | ||
| 54 | - return; | ||
| 55 | - } | ||
| 56 | - // #endif | ||
| 57 | - | ||
| 58 | - uni.addPhoneContact({ | ||
| 59 | - firstName: this.name, | ||
| 60 | - mobilePhoneNumber: this.phone, | ||
| 61 | - success: function() { | ||
| 62 | - uni.showModal({ | ||
| 63 | - content: '已成功添加联系人！', | ||
| 64 | - showCancel: false | ||
| 65 | - }) | ||
| 66 | - }, | ||
| 67 | - fail: function() { | ||
| 68 | - uni.showModal({ | ||
| 69 | - content: '添加联系人失败！', | ||
| 70 | - showCancel: false | ||
| 71 | - }) | ||
| 72 | - } | ||
| 73 | - }); | ||
| 74 | - } | ||
| 75 | - // #ifdef APP-PLUS | ||
| 76 | - , | ||
| 77 | - async checkPermission() { | ||
| 78 | - let status = permision.isIOS ? await permision.requestIOS('contact') : | ||
| 79 | - await permision.requestAndroid('android.permission.WRITE_CONTACTS'); | ||
| 80 | - | ||
| 81 | - if (status === null || status === 1) { | ||
| 82 | - status = 1; | ||
| 83 | - } else { | ||
| 84 | - uni.showModal({ | ||
| 85 | - content: "需要联系人权限", | ||
| 86 | - confirmText: "设置", | ||
| 87 | - success: function(res) { | ||
| 88 | - if (res.confirm) { | ||
| 89 | - permision.gotoAppSetting(); | ||
| 90 | - } | ||
| 91 | - } | ||
| 92 | - }) | ||
| 93 | - } | ||
| 94 | - return status; | ||
| 95 | - } | ||
| 96 | - // #endif | ||
| 97 | - } | ||
| 98 | - } | ||
| 99 | -</script> | ||
| 100 | - | ||
| 101 | -<style> | ||
| 102 | -</style> |
pages/API/animation/animation.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="animation-element-wrapper"> | ||
| 6 | - <view class="animation-element" :animation="animationData"></view> | ||
| 7 | - </view> | ||
| 8 | - <scroll-view class="animation-buttons" scroll-y="true"> | ||
| 9 | - <button class="animation-button" @tap="rotate">旋转</button> | ||
| 10 | - <button class="animation-button" @tap="scale">缩放</button> | ||
| 11 | - <button class="animation-button" @tap="translate">移动</button> | ||
| 12 | - <button class="animation-button" @tap="skew">倾斜</button> | ||
| 13 | - <button class="animation-button" @tap="rotateAndScale">旋转并缩放</button> | ||
| 14 | - <button class="animation-button" @tap="rotateThenScale">旋转后缩放</button> | ||
| 15 | - <button class="animation-button" @tap="all">同时展示全部</button> | ||
| 16 | - <button class="animation-button" @tap="allInQueue">顺序展示全部</button> | ||
| 17 | - <button class="animation-button animation-button-reset" @tap="reset">还原</button> | ||
| 18 | - </scroll-view> | ||
| 19 | - </view> | ||
| 20 | - </view> | ||
| 21 | -</template> | ||
| 22 | -<script> | ||
| 23 | - export default { | ||
| 24 | - data() { | ||
| 25 | - return { | ||
| 26 | - title: 'createAnimation', | ||
| 27 | - animationData: '' | ||
| 28 | - } | ||
| 29 | - }, | ||
| 30 | - onUnload(){ | ||
| 31 | - this.animationData = '' | ||
| 32 | - }, | ||
| 33 | - onLoad() { | ||
| 34 | - this.animation = uni.createAnimation() | ||
| 35 | - }, | ||
| 36 | - methods: { | ||
| 37 | - rotate: function () { | ||
| 38 | - this.animation.rotate(Math.random() * 720 - 360).step() | ||
| 39 | - this.animationData = this.animation.export() | ||
| 40 | - }, | ||
| 41 | - scale: function () { | ||
| 42 | - this.animation.scale(Math.random() * 2).step() | ||
| 43 | - this.animationData = this.animation.export() | ||
| 44 | - }, | ||
| 45 | - translate: function () { | ||
| 46 | - this.animation.translate(Math.random() * 100 - 50, Math.random() * 100 - 50).step() | ||
| 47 | - this.animationData = this.animation.export() | ||
| 48 | - }, | ||
| 49 | - skew: function () { | ||
| 50 | - this.animation.skew(Math.random() * 90, Math.random() * 90).step() | ||
| 51 | - this.animationData = this.animation.export() | ||
| 52 | - }, | ||
| 53 | - rotateAndScale: function () { | ||
| 54 | - this.animation.rotate(Math.random() * 720 - 360) | ||
| 55 | - .scale(Math.random() * 2) | ||
| 56 | - .step() | ||
| 57 | - this.animationData = this.animation.export() | ||
| 58 | - }, | ||
| 59 | - rotateThenScale: function () { | ||
| 60 | - this.animation.rotate(Math.random() * 720 - 360).step() | ||
| 61 | - .scale(Math.random() * 2).step() | ||
| 62 | - this.animationData = this.animation.export() | ||
| 63 | - }, | ||
| 64 | - all: function () { | ||
| 65 | - this.animation.rotate(Math.random() * 720 - 360) | ||
| 66 | - .scale(Math.random() * 2) | ||
| 67 | - .translate(Math.random() * 100 - 50, Math.random() * 100 - 50) | ||
| 68 | - .skew(Math.random() * 90, Math.random() * 90) | ||
| 69 | - .step() | ||
| 70 | - this.animationData = this.animation.export() | ||
| 71 | - }, | ||
| 72 | - allInQueue: function () { | ||
| 73 | - this.animation.rotate(Math.random() * 720 - 360).step() | ||
| 74 | - .scale(Math.random() * 2).step() | ||
| 75 | - .translate(Math.random() * 100 - 50, Math.random() * 100 - 50).step() | ||
| 76 | - .skew(Math.random() * 90, Math.random() * 90).step() | ||
| 77 | - this.animationData = this.animation.export() | ||
| 78 | - }, | ||
| 79 | - reset: function () { | ||
| 80 | - this.animation.rotate(0, 0) | ||
| 81 | - .scale(1) | ||
| 82 | - .translate(0, 0) | ||
| 83 | - .skew(0, 0) | ||
| 84 | - .step({ | ||
| 85 | - duration: 0 | ||
| 86 | - }) | ||
| 87 | - this.animationData = this.animation.export() | ||
| 88 | - } | ||
| 89 | - } | ||
| 90 | - } | ||
| 91 | -</script> | ||
| 92 | - | ||
| 93 | -<style> | ||
| 94 | - .animation-element-wrapper { | ||
| 95 | - display: flex; | ||
| 96 | - width: 100%; | ||
| 97 | - padding-top: 150rpx; | ||
| 98 | - padding-bottom: 150rpx; | ||
| 99 | - justify-content: center; | ||
| 100 | - overflow: hidden; | ||
| 101 | - background-color: #ffffff; | ||
| 102 | - } | ||
| 103 | - | ||
| 104 | - .animation-element { | ||
| 105 | - width: 200rpx; | ||
| 106 | - height: 200rpx; | ||
| 107 | - background-color: #1AAD19; | ||
| 108 | - } | ||
| 109 | - | ||
| 110 | - .animation-buttons { | ||
| 111 | - padding:30rpx 0; | ||
| 112 | - width: 100%; | ||
| 113 | - /* height: 360rpx; */ | ||
| 114 | - } | ||
| 115 | - | ||
| 116 | - .animation-button { | ||
| 117 | - float: left; | ||
| 118 | - width: 44%; | ||
| 119 | - margin: 15rpx 3%; | ||
| 120 | - } | ||
| 121 | - | ||
| 122 | - .animation-button-reset { | ||
| 123 | - width: 94%; | ||
| 124 | - } | ||
| 125 | -</style> |
pages/API/background-audio/background-audio.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-center"> | ||
| 6 | - <text class="time-big">{{formatedPlayTime}}</text> | ||
| 7 | - </view> | ||
| 8 | - <view class="uni-common-mt"> | ||
| 9 | - <slider class="slider" min="0" max="21" step="1" :value="playTime" @change="seek"></slider> | ||
| 10 | - </view> | ||
| 11 | - <view class="play-time"> | ||
| 12 | - <text>00:00</text> | ||
| 13 | - <text>00:21</text> | ||
| 14 | - </view> | ||
| 15 | - <view class="uni-hello-text">注意：离开当前页面后背景音乐将保持播放，但退出uni-app将停止</view> | ||
| 16 | - <view class="page-body-buttons"> | ||
| 17 | - <block v-if="playing"> | ||
| 18 | - <view class="page-body-button" @tap="stop"> | ||
| 19 | - <image src="/static/stop.png"></image> | ||
| 20 | - </view> | ||
| 21 | - <view class="page-body-button" @tap="pause"> | ||
| 22 | - <image src="/static/pause.png"></image> | ||
| 23 | - </view> | ||
| 24 | - </block> | ||
| 25 | - <block v-if="!playing"> | ||
| 26 | - <view class="page-body-button"></view> | ||
| 27 | - <view class="page-body-button" @tap="play"> | ||
| 28 | - <image src="/static/play.png"></image> | ||
| 29 | - </view> | ||
| 30 | - </block> | ||
| 31 | - <view class="page-body-button"></view> | ||
| 32 | - </view> | ||
| 33 | - </view> | ||
| 34 | - </view> | ||
| 35 | -</template> | ||
| 36 | -<script> | ||
| 37 | - | ||
| 38 | - import * as util from '../../../common/util.js'; | ||
| 39 | - | ||
| 40 | - export default { | ||
| 41 | - data() { | ||
| 42 | - return { | ||
| 43 | - title: 'backgroundAudio', | ||
| 44 | - bgAudioMannager: null, | ||
| 45 | - dataUrl: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3', | ||
| 46 | - playing: false, | ||
| 47 | - playTime: 0, | ||
| 48 | - formatedPlayTime: '00:00:00' | ||
| 49 | - } | ||
| 50 | - }, | ||
| 51 | - onLoad: function () { | ||
| 52 | - this.playing = this.$backgroundAudioData.playing; | ||
| 53 | - this.playTime = this.$backgroundAudioData.playTime; | ||
| 54 | - this.formatedPlayTime = this.$backgroundAudioData.formatedPlayTime; | ||
| 55 | - | ||
| 56 | - let bgAudioMannager = uni.getBackgroundAudioManager(); | ||
| 57 | - if(!bgAudioMannager.title){ | ||
| 58 | - bgAudioMannager.title = '致爱丽丝'; | ||
| 59 | - } | ||
| 60 | - if(!bgAudioMannager.singer) { | ||
| 61 | - bgAudioMannager.singer = '暂无'; | ||
| 62 | - } | ||
| 63 | - if(!bgAudioMannager.coverImgUrl){ | ||
| 64 | - bgAudioMannager.coverImgUrl = 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/c517b410-5184-11eb-b997-9918a5dda011.jpeg'; | ||
| 65 | - } | ||
| 66 | - | ||
| 67 | - bgAudioMannager.onPlay(() => { | ||
| 68 | - console.log("开始播放"); | ||
| 69 | - this.$backgroundAudioData.playing = this.playing = true; | ||
| 70 | - }) | ||
| 71 | - bgAudioMannager.onPause(() => { | ||
| 72 | - console.log("暂停播放"); | ||
| 73 | - this.$backgroundAudioData.playing = this.playing = false; | ||
| 74 | - }) | ||
| 75 | - bgAudioMannager.onEnded(() => { | ||
| 76 | - this.playing = false; | ||
| 77 | - this.$backgroundAudioData.playing = false; | ||
| 78 | - this.$backgroundAudioData.playTime = this.playTime = 0; | ||
| 79 | - this.$backgroundAudioData.formatedPlayTime = this.formatedPlayTime = util.formatTime(0); | ||
| 80 | - }) | ||
| 81 | - | ||
| 82 | - bgAudioMannager.onTimeUpdate((e) => { | ||
| 83 | - if (Math.floor(bgAudioMannager.currentTime) > Math.floor(this.playTime)) { | ||
| 84 | - this.$backgroundAudioData.formatedPlayTime = this.formatedPlayTime = util.formatTime(Math.floor(bgAudioMannager.currentTime)); | ||
| 85 | - } | ||
| 86 | - this.$backgroundAudioData.playTime = this.playTime = bgAudioMannager.currentTime; | ||
| 87 | - }) | ||
| 88 | - | ||
| 89 | - this.bgAudioMannager = bgAudioMannager; | ||
| 90 | - }, | ||
| 91 | - methods: { | ||
| 92 | - play: function (res) { | ||
| 93 | - if (!this.bgAudioMannager.src) { | ||
| 94 | - this.bgAudioMannager.startTime = this.playTime; | ||
| 95 | - this.bgAudioMannager.src = this.dataUrl; | ||
| 96 | - } else { | ||
| 97 | - this.bgAudioMannager.seek(this.playTime); | ||
| 98 | - this.bgAudioMannager.play(); | ||
| 99 | - } | ||
| 100 | - }, | ||
| 101 | - seek: function (e) { | ||
| 102 | - this.bgAudioMannager.seek(e.detail.value); | ||
| 103 | - }, | ||
| 104 | - pause: function () { | ||
| 105 | - this.bgAudioMannager.pause(); | ||
| 106 | - }, | ||
| 107 | - stop: function () { | ||
| 108 | - this.bgAudioMannager.stop(); | ||
| 109 | - this.$backgroundAudioData.playing = this.playing = false; | ||
| 110 | - this.$backgroundAudioData.playTime = this.playTime = 0; | ||
| 111 | - this.$backgroundAudioData.formatedPlayTime = this.formatedPlayTime = util.formatTime(0); | ||
| 112 | - } | ||
| 113 | - } | ||
| 114 | - } | ||
| 115 | -</script> | ||
| 116 | - | ||
| 117 | -<style> | ||
| 118 | - image { | ||
| 119 | - width: 150rpx; | ||
| 120 | - height: 150rpx; | ||
| 121 | - } | ||
| 122 | - | ||
| 123 | - .page-body-text { | ||
| 124 | - padding: 0 30rpx; | ||
| 125 | - } | ||
| 126 | - | ||
| 127 | - .page-body-wrapper { | ||
| 128 | - margin-top: 0; | ||
| 129 | - } | ||
| 130 | - | ||
| 131 | - .page-body-info { | ||
| 132 | - padding-bottom: 50rpx; | ||
| 133 | - } | ||
| 134 | - | ||
| 135 | - .time-big { | ||
| 136 | - font-size: 60rpx; | ||
| 137 | - margin: 20rpx; | ||
| 138 | - } | ||
| 139 | - | ||
| 140 | - .slider { | ||
| 141 | - width:630rpx; | ||
| 142 | - } | ||
| 143 | - | ||
| 144 | - .play-time { | ||
| 145 | - font-size: 28rpx; | ||
| 146 | - width:100%; | ||
| 147 | - padding: 20rpx 0; | ||
| 148 | - display: flex; | ||
| 149 | - justify-content: space-between; | ||
| 150 | - box-sizing: border-box; | ||
| 151 | - } | ||
| 152 | - | ||
| 153 | - .page-body-buttons { | ||
| 154 | - display: flex; | ||
| 155 | - justify-content: space-around; | ||
| 156 | - margin-top: 100rpx; | ||
| 157 | - } | ||
| 158 | - | ||
| 159 | - .page-body-button { | ||
| 160 | - width: 250rpx; | ||
| 161 | - text-align: center; | ||
| 162 | - } | ||
| 163 | -</style> |
pages/API/bluetooth/bluetooth.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view> | ||
| 6 | - 本蓝牙协议只支持低功耗蓝牙协议ble。如果想连接非ble蓝牙设备，请在社区搜索 Native.js 蓝牙。 | ||
| 7 | - </view> | ||
| 8 | - <view class="uni-btn-v"> | ||
| 9 | - <button type="primary" :disabled="disabled[0]" @click="openBluetoothAdapter"> | ||
| 10 | - 初始化蓝牙模块 | ||
| 11 | - </button> | ||
| 12 | - <view v-if="!adapterState.available"> | ||
| 13 | - {{ '蓝牙适配器不可用,请初始化蓝牙模块' }} | ||
| 14 | - </view> | ||
| 15 | - <button | ||
| 16 | - type="primary" | ||
| 17 | - :loading="searchLoad" | ||
| 18 | - :disabled="disabled[1]" | ||
| 19 | - @click="startBluetoothDevicesDiscovery" | ||
| 20 | - > | ||
| 21 | - 开始搜索蓝牙设备 | ||
| 22 | - </button> | ||
| 23 | - <button | ||
| 24 | - type="primary" | ||
| 25 | - :disabled="disabled[2]" | ||
| 26 | - @click="stopBluetoothDevicesDiscovery(false)" | ||
| 27 | - > | ||
| 28 | - 停止搜索蓝牙设备 | ||
| 29 | - </button> | ||
| 30 | - <button | ||
| 31 | - type="primary" | ||
| 32 | - :loading="newDeviceLoad" | ||
| 33 | - :disabled="disabled[3]" | ||
| 34 | - @click="queryDevices" | ||
| 35 | - > | ||
| 36 | - 选择设备 | ||
| 37 | - </button> | ||
| 38 | - <view v-if="equipment.length > 0"> | ||
| 39 | - {{ | ||
| 40 | - (connected ? '已连接设备' : '已选择设备') + | ||
| 41 | - ' : ' + | ||
| 42 | - equipment[0].name + | ||
| 43 | - ' (' + | ||
| 44 | - equipment[0].deviceId + | ||
| 45 | - ')' | ||
| 46 | - }} | ||
| 47 | - </view> | ||
| 48 | - <button type="primary" :disabled="disabled[4]" @click="createBLEConnection"> | ||
| 49 | - 连接蓝牙设备 | ||
| 50 | - </button> | ||
| 51 | - <button type="primary" :disabled="disabled[5]" @click="getBLEDeviceServices"> | ||
| 52 | - 选择设备服务 | ||
| 53 | - </button> | ||
| 54 | - <view v-if="servicesData.length > 0">已选服务uuid：{{ servicesData[0].uuid }}</view> | ||
| 55 | - <button type="primary" :disabled="disabled[6]" @click="getBLEDeviceCharacteristics"> | ||
| 56 | - 获取服务的特征值 | ||
| 57 | - </button> | ||
| 58 | - <view v-if="characteristicsData.length > 0"> | ||
| 59 | - <view class="uni-list_name">uuid:{{ characteristicsData[0].uuid }}</view> | ||
| 60 | - <view class="uni-list_item"> | ||
| 61 | - 是否支持 read 操作:{{ characteristicsData[0].properties.read }} | ||
| 62 | - </view> | ||
| 63 | - <view class="uni-list_item"> | ||
| 64 | - 是否支持 write 操作:{{ characteristicsData[0].properties.write }} | ||
| 65 | - </view> | ||
| 66 | - <view class="uni-list_item"> | ||
| 67 | - 是否支持 notify 操作:{{ characteristicsData[0].properties.notify }} | ||
| 68 | - </view> | ||
| 69 | - <view class="uni-list_item"> | ||
| 70 | - 是否支持 indicate 操作:{{ characteristicsData[0].properties.indicate }} | ||
| 71 | - </view> | ||
| 72 | - </view> | ||
| 73 | - <!-- <button type="primary" :disabled="disabled[7]" @click="readBLECharacteristicValue"> | ||
| 74 | - 读取特征值数据 | ||
| 75 | - </button> | ||
| 76 | - <view v-if="valueChangeData.serviceId"> | ||
| 77 | - <view class="list-name"> | ||
| 78 | - 特征值最新的值:{{ valueChangeData.value || '还没有最新值' }} | ||
| 79 | - </view> | ||
| 80 | - </view> --> | ||
| 81 | - <!-- <button type="primary" :disabled="disabled[8]" @click="w">写入特征值数据</button> --> | ||
| 82 | - <button type="primary" :disabled="disabled[9]" @click="closeBLEConnection"> | ||
| 83 | - 断开蓝牙设备 | ||
| 84 | - </button> | ||
| 85 | - <button type="primary" :disabled="disabled[10]" @click="closeBluetoothAdapter"> | ||
| 86 | - 关闭蓝牙模块 | ||
| 87 | - </button> | ||
| 88 | - </view> | ||
| 89 | - </view> | ||
| 90 | - <!-- 遮罩 --> | ||
| 91 | - <view v-if="maskShow" class="uni-mask" @touchmove.stop.prevent="moveHandle" @click="maskclose"> | ||
| 92 | - <scroll-view class="uni-scroll_box" scroll-y @touchmove.stop.prevent="moveHandle" @click.stop="moveHandle"> | ||
| 93 | - <view class="uni-title"> | ||
| 94 | - 已经发现{{ list.length }}{{ showMaskType === 'device' ? '台设备' : '个服务' }}: | ||
| 95 | - </view> | ||
| 96 | - <view | ||
| 97 | - class="uni-list-box" | ||
| 98 | - v-for="(item, index) in list" | ||
| 99 | - :key="index" | ||
| 100 | - @click="tapQuery(item)" | ||
| 101 | - > | ||
| 102 | - <view v-if="showMaskType === 'device'"> | ||
| 103 | - <view class="uni-list_name">{{ item.name || item.localName }}</view> | ||
| 104 | - <view class="uni-list_item">信号强度:{{ item.RSSI }}dBm</view> | ||
| 105 | - <view class="uni-list_item">UUID:{{ item.deviceId }}</view> | ||
| 106 | - <!-- <view class="list-item" v-if="showMaskType === 'device'"> | ||
| 107 | - Service数量:{{ item.advertisServiceUUIDs.length }} | ||
| 108 | - </view> --> | ||
| 109 | - </view> | ||
| 110 | - <view v-if="showMaskType === 'service'"> | ||
| 111 | - <view class="uni-list_item" style="line-height:2.2;"> | ||
| 112 | - UUID: {{ item.uuid }} | ||
| 113 | - <text v-if="showMaskType === 'service'"> | ||
| 114 | - {{ item.isPrimary ? '（主服务）' : '' }} | ||
| 115 | - </text> | ||
| 116 | - </view> | ||
| 117 | - </view> | ||
| 118 | - <view v-if="showMaskType === 'characteristics'"> | ||
| 119 | - <view class="uni-list_name">uuid:{{ item.uuid }}</view> | ||
| 120 | - <view class="uni-list_item">是否支持 read 操作:{{ item.properties.read }}</view> | ||
| 121 | - <view class="uni-list_item"> | ||
| 122 | - 是否支持 write 操作:{{ item.properties.write }} | ||
| 123 | - </view> | ||
| 124 | - <view class="uni-list_item"> | ||
| 125 | - 是否支持 notify 操作:{{ item.properties.notify }} | ||
| 126 | - </view> | ||
| 127 | - <view class="uni-list_item"> | ||
| 128 | - 是否支持 indicate 操作:{{ item.properties.indicate }} | ||
| 129 | - </view> | ||
| 130 | - </view> | ||
| 131 | - </view> | ||
| 132 | - </scroll-view> | ||
| 133 | - </view> | ||
| 134 | - </view> | ||
| 135 | -</template> | ||
| 136 | -<script> | ||
| 137 | -export default { | ||
| 138 | - data() { | ||
| 139 | - return { | ||
| 140 | - title: 'bluetooth', | ||
| 141 | - disabled: [false, true, true, true, true, true, true, true, true, true, true], | ||
| 142 | - newDeviceLoad: false, | ||
| 143 | - searchLoad: false, | ||
| 144 | - maskShow: false, | ||
| 145 | - equipment: [], | ||
| 146 | - adapterState: { | ||
| 147 | - discovering: false, | ||
| 148 | - available: false | ||
| 149 | - }, | ||
| 150 | - connected: false, | ||
| 151 | - showMaskType: 'device', | ||
| 152 | - servicesData: [], | ||
| 153 | - characteristicsData: [], | ||
| 154 | - valueChangeData: {}, | ||
| 155 | - isStop:true , | ||
| 156 | - list: [] | ||
| 157 | - }; | ||
| 158 | - }, | ||
| 159 | - onLoad() { | ||
| 160 | - this.onBLEConnectionStateChange(); | ||
| 161 | - }, | ||
| 162 | - methods: { | ||
| 163 | - moveHandle() {}, | ||
| 164 | - /** | ||
| 165 | - * 关闭遮罩 | ||
| 166 | - */ | ||
| 167 | - maskclose(){ | ||
| 168 | - this.maskShow = false; | ||
| 169 | - }, | ||
| 170 | - /** | ||
| 171 | - * 选择设备 | ||
| 172 | - */ | ||
| 173 | - queryDevices() { | ||
| 174 | - // this.newDeviceLoad = true; | ||
| 175 | - this.showMaskType = 'device'; | ||
| 176 | - this.maskShow = true; | ||
| 177 | - }, | ||
| 178 | - tapQuery(item) { | ||
| 179 | - if (this.showMaskType === 'device') { | ||
| 180 | - this.$set(this.disabled, 4, false); | ||
| 181 | - if (this.equipment.length > 0) { | ||
| 182 | - this.equipment[0] = item; | ||
| 183 | - } else { | ||
| 184 | - this.equipment.push(item); | ||
| 185 | - } | ||
| 186 | - this.newDeviceLoad = false; | ||
| 187 | - } | ||
| 188 | - if (this.showMaskType === 'service') { | ||
| 189 | - this.$set(this.disabled, 6, false); | ||
| 190 | - if (this.servicesData.length > 0) { | ||
| 191 | - this.servicesData[0] = item; | ||
| 192 | - } else { | ||
| 193 | - this.servicesData.push(item); | ||
| 194 | - } | ||
| 195 | - } | ||
| 196 | - if (this.showMaskType === 'characteristics') { | ||
| 197 | - this.$set(this.disabled, 7, false); | ||
| 198 | - if (this.characteristicsData.length > 0) { | ||
| 199 | - this.characteristicsData[0] = item; | ||
| 200 | - } else { | ||
| 201 | - this.characteristicsData.push(item); | ||
| 202 | - } | ||
| 203 | - } | ||
| 204 | - this.maskShow = false; | ||
| 205 | - }, | ||
| 206 | - /** | ||
| 207 | - * 初始化蓝牙设备 | ||
| 208 | - */ | ||
| 209 | - openBluetoothAdapter() { | ||
| 210 | - uni.openBluetoothAdapter({ | ||
| 211 | - success: e => { | ||
| 212 | - console.log('初始化蓝牙成功:' + e.errMsg); | ||
| 213 | - console.log(JSON.stringify(e)); | ||
| 214 | - this.isStop = false ; | ||
| 215 | - this.$set(this.disabled, 0, true); | ||
| 216 | - this.$set(this.disabled, 1, false); | ||
| 217 | - this.$set(this.disabled, 10, false); | ||
| 218 | - this.getBluetoothAdapterState(); | ||
| 219 | - }, | ||
| 220 | - fail: e => { | ||
| 221 | - console.log(e) | ||
| 222 | - console.log('初始化蓝牙失败，错误码：' + (e.errCode || e.errMsg)); | ||
| 223 | - if (e.errCode !== 0) { | ||
| 224 | - initTypes(e.errCode,e.errMsg); | ||
| 225 | - } | ||
| 226 | - } | ||
| 227 | - }); | ||
| 228 | - }, | ||
| 229 | - /** | ||
| 230 | - * 开始搜索蓝牙设备 | ||
| 231 | - */ | ||
| 232 | - startBluetoothDevicesDiscovery() { | ||
| 233 | - uni.startBluetoothDevicesDiscovery({ | ||
| 234 | - success: e => { | ||
| 235 | - console.log('开始搜索蓝牙设备:' + e.errMsg); | ||
| 236 | - this.searchLoad = true; | ||
| 237 | - this.$set(this.disabled, 1, true); | ||
| 238 | - this.$set(this.disabled, 2, false); | ||
| 239 | - this.$set(this.disabled, 3, false); | ||
| 240 | - this.onBluetoothDeviceFound(); | ||
| 241 | - }, | ||
| 242 | - fail: e => { | ||
| 243 | - console.log('搜索蓝牙设备失败，错误码：' + e.errCode); | ||
| 244 | - if (e.errCode !== 0) { | ||
| 245 | - initTypes(e.errCode); | ||
| 246 | - } | ||
| 247 | - } | ||
| 248 | - }); | ||
| 249 | - }, | ||
| 250 | - /** | ||
| 251 | - * 停止搜索蓝牙设备 | ||
| 252 | - */ | ||
| 253 | - stopBluetoothDevicesDiscovery(types) { | ||
| 254 | - uni.stopBluetoothDevicesDiscovery({ | ||
| 255 | - success: e => { | ||
| 256 | - console.log('停止搜索蓝牙设备:' + e.errMsg); | ||
| 257 | - if (types) { | ||
| 258 | - this.$set(this.disabled, 1, true); | ||
| 259 | - } else { | ||
| 260 | - this.$set(this.disabled, 1, false); | ||
| 261 | - } | ||
| 262 | - this.$set(this.disabled, 2, true); | ||
| 263 | - // this.$set(this.disabled, 3, true); | ||
| 264 | - this.searchLoad = false; | ||
| 265 | - }, | ||
| 266 | - fail: e => { | ||
| 267 | - console.log('停止搜索蓝牙设备失败，错误码：' + e.errCode); | ||
| 268 | - if (e.errCode !== 0) { | ||
| 269 | - initTypes(e.errCode); | ||
| 270 | - } | ||
| 271 | - } | ||
| 272 | - }); | ||
| 273 | - }, | ||
| 274 | - /** | ||
| 275 | - * 发现外围设备 | ||
| 276 | - */ | ||
| 277 | - onBluetoothDeviceFound() { | ||
| 278 | - uni.onBluetoothDeviceFound(devices => { | ||
| 279 | - console.log('开始监听寻找到新设备的事件'); | ||
| 280 | - // this.$set(this.disabled, 3, false); | ||
| 281 | - this.getBluetoothDevices(); | ||
| 282 | - }); | ||
| 283 | - }, | ||
| 284 | - /** | ||
| 285 | - * 获取在蓝牙模块生效期间所有已发现的蓝牙设备。包括已经和本机处于连接状态的设备。 | ||
| 286 | - */ | ||
| 287 | - getBluetoothDevices() { | ||
| 288 | - uni.getBluetoothDevices({ | ||
| 289 | - success: res => { | ||
| 290 | - this.newDeviceLoad = false; | ||
| 291 | - console.log('获取蓝牙设备成功:' + res.errMsg); | ||
| 292 | - // console.log(JSON.stringify(res)) | ||
| 293 | - this.list = res.devices; | ||
| 294 | - }, | ||
| 295 | - fail: e => { | ||
| 296 | - console.log('获取蓝牙设备错误，错误码：' + e.errCode); | ||
| 297 | - if (e.errCode !== 0) { | ||
| 298 | - initTypes(e.errCode); | ||
| 299 | - } | ||
| 300 | - } | ||
| 301 | - }); | ||
| 302 | - }, | ||
| 303 | - /** | ||
| 304 | - * 获取本机蓝牙适配器状态 | ||
| 305 | - */ | ||
| 306 | - getBluetoothAdapterState() { | ||
| 307 | - console.log('--->'); | ||
| 308 | - uni.getBluetoothAdapterState({ | ||
| 309 | - success: res => { | ||
| 310 | - console.log(JSON.stringify(res)); | ||
| 311 | - this.adapterState = res; | ||
| 312 | - }, | ||
| 313 | - fail: e => { | ||
| 314 | - console.log('获取本机蓝牙适配器状态失败，错误码：' + e.errCode); | ||
| 315 | - if (e.errCode !== 0) { | ||
| 316 | - initTypes(e.errCode); | ||
| 317 | - } | ||
| 318 | - } | ||
| 319 | - }); | ||
| 320 | - }, | ||
| 321 | - /** | ||
| 322 | - * 连接低功耗蓝牙 | ||
| 323 | - */ | ||
| 324 | - createBLEConnection() { | ||
| 325 | - let deviceId = this.equipment[0].deviceId; | ||
| 326 | - uni.showToast({ | ||
| 327 | - title: '连接蓝牙...', | ||
| 328 | - icon: 'loading', | ||
| 329 | - duration: 99999 | ||
| 330 | - }); | ||
| 331 | - uni.createBLEConnection({ | ||
| 332 | - // 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接 | ||
| 333 | - deviceId, | ||
| 334 | - success: res => { | ||
| 335 | - console.log(res); | ||
| 336 | - console.log('连接蓝牙成功:' + res.errMsg); | ||
| 337 | - // 连接设备后断开搜索 并且不能搜索设备 | ||
| 338 | - this.stopBluetoothDevicesDiscovery(true); | ||
| 339 | - uni.hideToast(); | ||
| 340 | - uni.showToast({ | ||
| 341 | - title: '连接成功', | ||
| 342 | - icon: 'success', | ||
| 343 | - duration: 2000 | ||
| 344 | - }); | ||
| 345 | - this.$set(this.disabled, 3, true); | ||
| 346 | - this.$set(this.disabled, 4, true); | ||
| 347 | - this.$set(this.disabled, 5, false); | ||
| 348 | - this.$set(this.disabled, 9, false); | ||
| 349 | - this.connected = true; | ||
| 350 | - }, | ||
| 351 | - fail: e => { | ||
| 352 | - console.log('连接低功耗蓝牙失败，错误码：' + e.errCode); | ||
| 353 | - if (e.errCode !== 0) { | ||
| 354 | - initTypes(e.errCode); | ||
| 355 | - } | ||
| 356 | - } | ||
| 357 | - }); | ||
| 358 | - }, | ||
| 359 | - /** | ||
| 360 | - * 断开与低功耗蓝牙设备的连接 | ||
| 361 | - */ | ||
| 362 | - closeBLEConnection() { | ||
| 363 | - let deviceId = this.equipment[0].deviceId; | ||
| 364 | - uni.closeBLEConnection({ | ||
| 365 | - deviceId, | ||
| 366 | - success: res => { | ||
| 367 | - console.log(res); | ||
| 368 | - console.log('断开低功耗蓝牙成功:' + res.errMsg); | ||
| 369 | - this.$set(this.disabled, 1, false); | ||
| 370 | - this.$set(this.disabled, 3, true); | ||
| 371 | - this.$set(this.disabled, 4, true); | ||
| 372 | - this.$set(this.disabled, 5, true); | ||
| 373 | - this.$set(this.disabled, 6, true); | ||
| 374 | - this.$set(this.disabled, 7, true); | ||
| 375 | - this.$set(this.disabled, 8, true); | ||
| 376 | - this.$set(this.disabled, 9, true); | ||
| 377 | - this.equipment = []; | ||
| 378 | - this.servicesData = []; | ||
| 379 | - this.characteristicsData = []; | ||
| 380 | - }, | ||
| 381 | - fail: e => { | ||
| 382 | - console.log('断开低功耗蓝牙成功，错误码：' + e.errCode); | ||
| 383 | - if (e.errCode !== 0) { | ||
| 384 | - initTypes(e.errCode); | ||
| 385 | - } | ||
| 386 | - } | ||
| 387 | - }); | ||
| 388 | - }, | ||
| 389 | - /** | ||
| 390 | - * 获取所有服务 | ||
| 391 | - */ | ||
| 392 | - getBLEDeviceServices() { | ||
| 393 | - let deviceId = this.equipment[0].deviceId; | ||
| 394 | - console.log('获取所有服务的 uuid:' + deviceId); | ||
| 395 | - | ||
| 396 | - uni.getBLEDeviceServices({ | ||
| 397 | - // 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接 | ||
| 398 | - deviceId, | ||
| 399 | - success: res => { | ||
| 400 | - console.log(JSON.stringify(res.services)); | ||
| 401 | - console.log('获取设备服务成功:' + res.errMsg); | ||
| 402 | - this.$set(this.disabled, 7, true); | ||
| 403 | - this.$set(this.disabled, 8, true); | ||
| 404 | - this.showMaskType = 'service'; | ||
| 405 | - this.list = res.services; | ||
| 406 | - | ||
| 407 | - this.characteristicsData = []; | ||
| 408 | - if (this.list.length <= 0) { | ||
| 409 | - toast('获取服务失败，请重试!'); | ||
| 410 | - return; | ||
| 411 | - } | ||
| 412 | - this.maskShow = true; | ||
| 413 | - }, | ||
| 414 | - fail: e => { | ||
| 415 | - console.log('获取设备服务失败，错误码：' + e.errCode); | ||
| 416 | - if (e.errCode !== 0) { | ||
| 417 | - initTypes(e.errCode); | ||
| 418 | - } | ||
| 419 | - } | ||
| 420 | - }); | ||
| 421 | - }, | ||
| 422 | - /** | ||
| 423 | - * 获取某个服务下的所有特征值 | ||
| 424 | - */ | ||
| 425 | - getBLEDeviceCharacteristics() { | ||
| 426 | - let deviceId = this.equipment[0].deviceId; | ||
| 427 | - let serviceId = this.servicesData[0].uuid; | ||
| 428 | - console.log(deviceId); | ||
| 429 | - console.log(serviceId); | ||
| 430 | - uni.getBLEDeviceCharacteristics({ | ||
| 431 | - // 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接 | ||
| 432 | - deviceId, | ||
| 433 | - // 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取 | ||
| 434 | - serviceId, | ||
| 435 | - success: res => { | ||
| 436 | - console.log(JSON.stringify(res)); | ||
| 437 | - console.log('获取特征值成功:' + res.errMsg); | ||
| 438 | - this.$set(this.disabled, 7, true); | ||
| 439 | - this.valueChangeData = {}; | ||
| 440 | - this.showMaskType = 'characteristics'; | ||
| 441 | - this.list = res.characteristics; | ||
| 442 | - if (this.list.length <= 0) { | ||
| 443 | - toast('获取特征值失败，请重试!'); | ||
| 444 | - return; | ||
| 445 | - } | ||
| 446 | - this.maskShow = true; | ||
| 447 | - }, | ||
| 448 | - fail: e => { | ||
| 449 | - console.log('获取特征值失败，错误码：' + e.errCode); | ||
| 450 | - if (e.errCode !== 0) { | ||
| 451 | - initTypes(e.errCode); | ||
| 452 | - } | ||
| 453 | - } | ||
| 454 | - }); | ||
| 455 | - }, | ||
| 456 | - /** | ||
| 457 | - * 监听低功耗蓝牙连接状态的改变事件。包括开发者主动连接或断开连接，设备丢失，连接异常断开等等 | ||
| 458 | - */ | ||
| 459 | - onBLEConnectionStateChange() { | ||
| 460 | - uni.onBLEConnectionStateChange(res => { | ||
| 461 | - // 该方法回调中可以用于处理连接意外断开等异常情况 | ||
| 462 | - console.log(`蓝牙连接状态 -------------------------->`); | ||
| 463 | - console.log(JSON.stringify(res)); | ||
| 464 | - if (!res.connected) { | ||
| 465 | - if(this.isStop) return ; | ||
| 466 | - console.log('断开低功耗蓝牙成功:'); | ||
| 467 | - this.$set(this.disabled, 1, false); | ||
| 468 | - this.$set(this.disabled, 3, true); | ||
| 469 | - this.$set(this.disabled, 4, true); | ||
| 470 | - this.$set(this.disabled, 5, true); | ||
| 471 | - this.$set(this.disabled, 6, true); | ||
| 472 | - this.$set(this.disabled, 7, true); | ||
| 473 | - this.$set(this.disabled, 8, true); | ||
| 474 | - this.$set(this.disabled, 9, true); | ||
| 475 | - this.searchLoad = false; | ||
| 476 | - this.equipment = []; | ||
| 477 | - this.servicesData = []; | ||
| 478 | - this.characteristicsData = []; | ||
| 479 | - this.valueChangeData = {}; | ||
| 480 | - toast('已经断开当前蓝牙连接'); | ||
| 481 | - } | ||
| 482 | - }); | ||
| 483 | - }, | ||
| 484 | - /** | ||
| 485 | - * 读取低功耗蓝牙设备的特征值的二进制数据值。注意：必须设备的特征值支持 read 才可以成功调用 | ||
| 486 | - */ | ||
| 487 | - readBLECharacteristicValue() { | ||
| 488 | - let deviceId = this.equipment[0].deviceId; | ||
| 489 | - let serviceId = this.servicesData[0].uuid; | ||
| 490 | - let characteristicId = this.characteristicsData[0].uuid; | ||
| 491 | - console.log(deviceId); | ||
| 492 | - console.log(serviceId); | ||
| 493 | - console.log(characteristicId); | ||
| 494 | - uni.readBLECharacteristicValue({ | ||
| 495 | - // 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接 | ||
| 496 | - deviceId, | ||
| 497 | - // 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取 | ||
| 498 | - serviceId, | ||
| 499 | - // 这里的 characteristicId 需要在 getBLEDeviceCharacteristics 接口中获取 | ||
| 500 | - characteristicId, | ||
| 501 | - success: res => { | ||
| 502 | - console.log('读取设备数据值成功'); | ||
| 503 | - console.log(JSON.stringify(res)); | ||
| 504 | - this.notifyBLECharacteristicValueChange(); | ||
| 505 | - }, | ||
| 506 | - fail(e) { | ||
| 507 | - console.log('读取设备数据值失败，错误码：' + e.errCode); | ||
| 508 | - if (e.errCode !== 0) { | ||
| 509 | - initTypes(e.errCode); | ||
| 510 | - } | ||
| 511 | - } | ||
| 512 | - }); | ||
| 513 | - this.onBLECharacteristicValueChange(); | ||
| 514 | - }, | ||
| 515 | - /** | ||
| 516 | - * 监听低功耗蓝牙设备的特征值变化事件。必须先启用 notifyBLECharacteristicValueChange 接口才能接收到设备推送的 notification。 | ||
| 517 | - */ | ||
| 518 | - onBLECharacteristicValueChange() { | ||
| 519 | - // 必须在这里的回调才能获取 | ||
| 520 | - uni.onBLECharacteristicValueChange(characteristic => { | ||
| 521 | - console.log('监听低功耗蓝牙设备的特征值变化事件成功'); | ||
| 522 | - console.log(JSON.stringify(characteristic)); | ||
| 523 | - this.valueChangeData = characteristic; | ||
| 524 | - }); | ||
| 525 | - }, | ||
| 526 | - /** | ||
| 527 | - * 订阅操作成功后需要设备主动更新特征值的 value，才会触发 uni.onBLECharacteristicValueChange 回调。 | ||
| 528 | - */ | ||
| 529 | - notifyBLECharacteristicValueChange() { | ||
| 530 | - let deviceId = this.equipment[0].deviceId; | ||
| 531 | - let serviceId = this.servicesData[0].uuid; | ||
| 532 | - let characteristicId = this.characteristicsData[0].uuid; | ||
| 533 | - let notify = this.characteristicsData[0].properties.notify; | ||
| 534 | - console.log(deviceId); | ||
| 535 | - console.log(serviceId); | ||
| 536 | - console.log(characteristicId); | ||
| 537 | - console.log(notify); | ||
| 538 | - uni.notifyBLECharacteristicValueChange({ | ||
| 539 | - state: true, // 启用 notify 功能 | ||
| 540 | - // 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接 | ||
| 541 | - deviceId, | ||
| 542 | - // 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取 | ||
| 543 | - serviceId, | ||
| 544 | - // 这里的 characteristicId 需要在 getBLEDeviceCharacteristics 接口中获取 | ||
| 545 | - characteristicId, | ||
| 546 | - success(res) { | ||
| 547 | - console.log('notifyBLECharacteristicValueChange success:' + res.errMsg); | ||
| 548 | - console.log(JSON.stringify(res)); | ||
| 549 | - } | ||
| 550 | - }); | ||
| 551 | - }, | ||
| 552 | - /** | ||
| 553 | - * 断开蓝牙模块 | ||
| 554 | - */ | ||
| 555 | - closeBluetoothAdapter(OBJECT) { | ||
| 556 | - uni.closeBluetoothAdapter({ | ||
| 557 | - success: res => { | ||
| 558 | - console.log('断开蓝牙模块成功'); | ||
| 559 | - this.isStop = true ; | ||
| 560 | - this.$set(this.disabled, 0, false); | ||
| 561 | - this.$set(this.disabled, 1, true); | ||
| 562 | - this.$set(this.disabled, 2, true); | ||
| 563 | - this.$set(this.disabled, 3, true); | ||
| 564 | - this.$set(this.disabled, 4, true); | ||
| 565 | - this.$set(this.disabled, 5, true); | ||
| 566 | - this.$set(this.disabled, 6, true); | ||
| 567 | - this.$set(this.disabled, 7, true); | ||
| 568 | - this.$set(this.disabled, 8, true); | ||
| 569 | - this.$set(this.disabled, 9, true); | ||
| 570 | - this.$set(this.disabled, 10, true); | ||
| 571 | - this.equipment = []; | ||
| 572 | - this.servicesData = []; | ||
| 573 | - this.characteristicsData = []; | ||
| 574 | - this.valueChangeData = {}; | ||
| 575 | - this.adapterState = []; | ||
| 576 | - this.searchLoad =false; | ||
| 577 | - toast('断开蓝牙模块'); | ||
| 578 | - } | ||
| 579 | - }); | ||
| 580 | - } | ||
| 581 | - } | ||
| 582 | -}; | ||
| 583 | - | ||
| 584 | -/** | ||
| 585 | - * 判断初始化蓝牙状态 | ||
| 586 | - */ | ||
| 587 | -function initTypes(code, errMsg) { | ||
| 588 | - switch (code) { | ||
| 589 | - case 10000: | ||
| 590 | - toast('未初始化蓝牙适配器'); | ||
| 591 | - break; | ||
| 592 | - case 10001: | ||
| 593 | - toast('未检测到蓝牙，请打开蓝牙重试！'); | ||
| 594 | - break; | ||
| 595 | - case 10002: | ||
| 596 | - toast('没有找到指定设备'); | ||
| 597 | - break; | ||
| 598 | - case 10003: | ||
| 599 | - toast('连接失败'); | ||
| 600 | - break; | ||
| 601 | - case 10004: | ||
| 602 | - toast('没有找到指定服务'); | ||
| 603 | - break; | ||
| 604 | - case 10005: | ||
| 605 | - toast('没有找到指定特征值'); | ||
| 606 | - break; | ||
| 607 | - case 10006: | ||
| 608 | - toast('当前连接已断开'); | ||
| 609 | - break; | ||
| 610 | - case 10007: | ||
| 611 | - toast('当前特征值不支持此操作'); | ||
| 612 | - break; | ||
| 613 | - case 10008: | ||
| 614 | - toast('其余所有系统上报的异常'); | ||
| 615 | - break; | ||
| 616 | - case 10009: | ||
| 617 | - toast('Android 系统特有，系统版本低于 4.3 不支持 BLE'); | ||
| 618 | - break; | ||
| 619 | - default: | ||
| 620 | - toast(errMsg); | ||
| 621 | - } | ||
| 622 | -} | ||
| 623 | - | ||
| 624 | -/** | ||
| 625 | - * 弹出框封装 | ||
| 626 | - */ | ||
| 627 | -function toast(content, showCancel = false) { | ||
| 628 | - uni.showModal({ | ||
| 629 | - title: '提示', | ||
| 630 | - content, | ||
| 631 | - showCancel | ||
| 632 | - }); | ||
| 633 | -} | ||
| 634 | -</script> | ||
| 635 | - | ||
| 636 | -<style> | ||
| 637 | - | ||
| 638 | -.uni-title { | ||
| 639 | - /* width: 100%; */ | ||
| 640 | - /* height: 80rpx; */ | ||
| 641 | - text-align: center; | ||
| 642 | -} | ||
| 643 | - | ||
| 644 | -.uni-mask { | ||
| 645 | - position: fixed; | ||
| 646 | - top: 0; | ||
| 647 | - left: 0; | ||
| 648 | - bottom: 0; | ||
| 649 | - display: flex; | ||
| 650 | - align-items: center; | ||
| 651 | - width: 100%; | ||
| 652 | - background: rgba(0, 0, 0, 0.6); | ||
| 653 | - padding: 0 30rpx; | ||
| 654 | - box-sizing: border-box; | ||
| 655 | -} | ||
| 656 | - | ||
| 657 | -.uni-scroll_box { | ||
| 658 | - height: 70%; | ||
| 659 | - background: #fff; | ||
| 660 | - border-radius: 20rpx; | ||
| 661 | -} | ||
| 662 | -.uni-list-box { | ||
| 663 | - margin: 0 20rpx; | ||
| 664 | - padding: 15rpx 0; | ||
| 665 | - border-bottom: 1px #f5f5f5 solid; | ||
| 666 | - box-sizing: border-box; | ||
| 667 | -} | ||
| 668 | -.uni-list:last-child { | ||
| 669 | - border: none; | ||
| 670 | -} | ||
| 671 | -.uni-list_name { | ||
| 672 | - font-size: 30rpx; | ||
| 673 | - color: #333; | ||
| 674 | -} | ||
| 675 | -.uni-list_item { | ||
| 676 | - font-size: 24rpx; | ||
| 677 | - color: #555; | ||
| 678 | - line-height: 1.5; | ||
| 679 | -} | ||
| 680 | - | ||
| 681 | -.uni-success_box { | ||
| 682 | - position: absolute; | ||
| 683 | - left: 0; | ||
| 684 | - bottom: 0; | ||
| 685 | - min-height: 100rpx; | ||
| 686 | - width: 100%; | ||
| 687 | - background: #fff; | ||
| 688 | - box-sizing: border-box; | ||
| 689 | - border-top: 1px #eee solid; | ||
| 690 | -} | ||
| 691 | -.uni-success_sub { | ||
| 692 | - /* width: 100%%; */ | ||
| 693 | - height: 100rpx; | ||
| 694 | - display: flex; | ||
| 695 | - justify-content: space-between; | ||
| 696 | - align-items: center; | ||
| 697 | - padding: 0 30rpx; | ||
| 698 | -} | ||
| 699 | -.uni-close_button { | ||
| 700 | - padding: 0 20rpx; | ||
| 701 | - height: 60rpx; | ||
| 702 | - line-height: 60rpx; | ||
| 703 | - background: #ce3c39; | ||
| 704 | - color: #ffffff; | ||
| 705 | - border-radius: 10rpx; | ||
| 706 | -} | ||
| 707 | -.uni-success_content { | ||
| 708 | - height: 600rpx; | ||
| 709 | - margin: 30rpx; | ||
| 710 | - margin-top: 0; | ||
| 711 | - border: 1px #eee solid; | ||
| 712 | - padding: 30rpx; | ||
| 713 | -} | ||
| 714 | -.uni-content_list { | ||
| 715 | - padding-bottom: 10rpx; | ||
| 716 | - border-bottom: 1px #f5f5f5 solid; | ||
| 717 | -} | ||
| 718 | -.uni-tips { | ||
| 719 | - text-align: center; | ||
| 720 | - font-size: 24rpx; | ||
| 721 | - color: #666; | ||
| 722 | -} | ||
| 723 | -</style> |
pages/API/brightness/brightness.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <!-- #ifndef MP-TOUTIAO --> | ||
| 6 | - <view class="text-box">亮度 : {{ screen }}</view> | ||
| 7 | - <view class="uni-slider"><slider :value="screen" @changing="sliderChange" step="1" /></view> | ||
| 8 | - <!-- #endif --> | ||
| 9 | - <button type="primary" @click="keep"> | ||
| 10 | - {{ keepScreenOn ? '保持常亮状态' : '关闭常亮状态' }} | ||
| 11 | - </button> | ||
| 12 | - <view class="tips"> | ||
| 13 | - 保持常亮时，屏幕不会熄灭。仅在当前应用生效，离开应用后设置失效。 | ||
| 14 | - </view> | ||
| 15 | - </view> | ||
| 16 | - </view> | ||
| 17 | -</template> | ||
| 18 | -<script> | ||
| 19 | -export default { | ||
| 20 | - data() { | ||
| 21 | - return { | ||
| 22 | - title: 'brightness', | ||
| 23 | - screen: 0, | ||
| 24 | - keepScreenOn: true | ||
| 25 | - }; | ||
| 26 | - }, | ||
| 27 | - onLoad() { | ||
| 28 | - uni.getScreenBrightness({ | ||
| 29 | - success: res => { | ||
| 30 | - this.screen = (res.value * 100).toFixed(); | ||
| 31 | - }, | ||
| 32 | - fail(e) { | ||
| 33 | - console.log(e); | ||
| 34 | - } | ||
| 35 | - }); | ||
| 36 | - }, | ||
| 37 | - methods: { | ||
| 38 | - sliderChange(e) { | ||
| 39 | - let screen = e.detail.value; | ||
| 40 | - // 判断是否重复 | ||
| 41 | - if (this.screen !== screen) { | ||
| 42 | - console.log('当前数值：' + e.detail.value); | ||
| 43 | - uni.setScreenBrightness({ | ||
| 44 | - value: screen / 100, | ||
| 45 | - success: function() { | ||
| 46 | - }, | ||
| 47 | - fail(e) { | ||
| 48 | - console.log(e); | ||
| 49 | - } | ||
| 50 | - }); | ||
| 51 | - this.screen = screen; | ||
| 52 | - } | ||
| 53 | - }, | ||
| 54 | - keep() { | ||
| 55 | - uni.setKeepScreenOn({ | ||
| 56 | - keepScreenOn: this.keepScreenOn | ||
| 57 | - }); | ||
| 58 | - this.keepScreenOn = !this.keepScreenOn; | ||
| 59 | - } | ||
| 60 | - } | ||
| 61 | -}; | ||
| 62 | -</script> | ||
| 63 | - | ||
| 64 | -<style> | ||
| 65 | -.text-box { | ||
| 66 | - margin-bottom: 40rpx; | ||
| 67 | - display: flex; | ||
| 68 | - justify-content: center; | ||
| 69 | - align-items: center; | ||
| 70 | - height: 300rpx; | ||
| 71 | - background-color: #ffffff; | ||
| 72 | - font-size: 32rpx; | ||
| 73 | - color: #353535; | ||
| 74 | -} | ||
| 75 | - | ||
| 76 | -.uni-slider { | ||
| 77 | - margin: 100rpx 0; | ||
| 78 | -} | ||
| 79 | - | ||
| 80 | -.tips { | ||
| 81 | - font-size: 26rpx; | ||
| 82 | - text-align: center; | ||
| 83 | - margin-top: 20rpx; | ||
| 84 | - color: #999; | ||
| 85 | -} | ||
| 86 | -</style> |
pages/API/canvas/canvas.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-common-mt"> | ||
| 5 | - <canvas class="canvas-element" canvas-id="canvas" id="canvas"></canvas> | ||
| 6 | - <scroll-view class="canvas-buttons" scroll-y="true"> | ||
| 7 | - <block v-for="(name, index) in names" :key="index"> | ||
| 8 | - <button class="canvas-button" @click="handleCanvasButton(name)">{{name}}</button> | ||
| 9 | - </block> | ||
| 10 | - <button class="canvas-button" @click="toTempFilePath" type="primary">toTempFilePath</button> | ||
| 11 | - </scroll-view> | ||
| 12 | - </view> | ||
| 13 | - </view> | ||
| 14 | -</template> | ||
| 15 | -<script> | ||
| 16 | - var context = null; | ||
| 17 | - export default { | ||
| 18 | - data() { | ||
| 19 | - return { | ||
| 20 | - title: 'createContext', | ||
| 21 | - names: ["rotate", "scale", "reset", "translate", "save", "restore", "drawImage", "fillText", "fill", | ||
| 22 | - "stroke", "clearRect", "beginPath", "closePath", "moveTo", "lineTo", "rect", "arc", | ||
| 23 | - "quadraticCurveTo", "bezierCurveTo", "setFillStyle", "setStrokeStyle", "setGlobalAlpha", | ||
| 24 | - "setShadow", "setFontSize", "setLineCap", "setLineJoin", "setLineWidth", "setMiterLimit" | ||
| 25 | - ] | ||
| 26 | - } | ||
| 27 | - }, | ||
| 28 | - onReady: function() { | ||
| 29 | - context = uni.createCanvasContext('canvas',this) | ||
| 30 | - }, | ||
| 31 | - methods: { | ||
| 32 | - toTempFilePath: function() { | ||
| 33 | - uni.canvasToTempFilePath({ | ||
| 34 | - canvasId: 'canvas', | ||
| 35 | - success: function(res) { | ||
| 36 | - console.log(res.tempFilePath) | ||
| 37 | - }, | ||
| 38 | - fail: function(err) { | ||
| 39 | - console.error(JSON.stringify(err)) | ||
| 40 | - } | ||
| 41 | - }) | ||
| 42 | - }, | ||
| 43 | - handleCanvasButton: function(name) { | ||
| 44 | - this[name] && this[name](); | ||
| 45 | - }, | ||
| 46 | - rotate: function() { | ||
| 47 | - context.beginPath() | ||
| 48 | - context.rotate(10 * Math.PI / 180) | ||
| 49 | - context.rect(225, 75, 20, 10) | ||
| 50 | - context.fill() | ||
| 51 | - context.draw() | ||
| 52 | - }, | ||
| 53 | - scale: function() { | ||
| 54 | - context.beginPath() | ||
| 55 | - context.rect(25, 25, 50, 50) | ||
| 56 | - context.stroke() | ||
| 57 | - | ||
| 58 | - context.scale(2, 2) | ||
| 59 | - | ||
| 60 | - context.beginPath() | ||
| 61 | - context.rect(25, 25, 50, 50) | ||
| 62 | - context.stroke() | ||
| 63 | - context.draw() | ||
| 64 | - }, | ||
| 65 | - reset: function() { | ||
| 66 | - context.beginPath() | ||
| 67 | - | ||
| 68 | - context.setFillStyle('#000000') | ||
| 69 | - context.setStrokeStyle('#000000') | ||
| 70 | - context.setFontSize(10) | ||
| 71 | - context.setGlobalAlpha(1) | ||
| 72 | - context.setShadow(0, 0, 0, 'rgba(0, 0, 0, 0)') | ||
| 73 | - | ||
| 74 | - context.setLineCap('butt') | ||
| 75 | - context.setLineJoin('miter') | ||
| 76 | - context.setLineWidth(1) | ||
| 77 | - context.setMiterLimit(10) | ||
| 78 | - context.draw() | ||
| 79 | - }, | ||
| 80 | - translate: function() { | ||
| 81 | - context.beginPath() | ||
| 82 | - context.rect(10, 10, 100, 50) | ||
| 83 | - context.fill() | ||
| 84 | - | ||
| 85 | - context.translate(70, 70) | ||
| 86 | - | ||
| 87 | - context.beginPath() | ||
| 88 | - context.fill() | ||
| 89 | - context.draw() | ||
| 90 | - }, | ||
| 91 | - save: function() { | ||
| 92 | - context.beginPath() | ||
| 93 | - context.setStrokeStyle('#00ff00') | ||
| 94 | - context.save() | ||
| 95 | - | ||
| 96 | - context.scale(2, 2) | ||
| 97 | - context.setStrokeStyle('#ff0000') | ||
| 98 | - context.rect(0, 0, 100, 100) | ||
| 99 | - context.stroke() | ||
| 100 | - context.restore() | ||
| 101 | - | ||
| 102 | - context.rect(0, 0, 50, 50) | ||
| 103 | - context.stroke() | ||
| 104 | - context.draw() | ||
| 105 | - }, | ||
| 106 | - restore: function() { | ||
| 107 | - [3, 2, 1].forEach(function(item) { | ||
| 108 | - context.beginPath() | ||
| 109 | - context.save() | ||
| 110 | - context.scale(item, item) | ||
| 111 | - context.rect(10, 10, 100, 100) | ||
| 112 | - context.stroke() | ||
| 113 | - context.restore() | ||
| 114 | - }); | ||
| 115 | - context.draw() | ||
| 116 | - }, | ||
| 117 | - drawImage: function() { | ||
| 118 | - // #ifdef APP-PLUS | ||
| 119 | - context.drawImage('../../../static/app-plus/uni@2x.png', 0, 0) | ||
| 120 | - // #endif | ||
| 121 | - // #ifndef APP-PLUS | ||
| 122 | - context.drawImage('../../../static/uni.png', 0, 0) | ||
| 123 | - // #endif | ||
| 124 | - context.draw() | ||
| 125 | - }, | ||
| 126 | - fillText: function() { | ||
| 127 | - context.setStrokeStyle('#ff0000') | ||
| 128 | - | ||
| 129 | - context.beginPath() | ||
| 130 | - context.moveTo(0, 10) | ||
| 131 | - context.lineTo(300, 10) | ||
| 132 | - context.stroke() | ||
| 133 | - // context.save() | ||
| 134 | - // context.scale(1.5, 1.5) | ||
| 135 | - // context.translate(20, 20) | ||
| 136 | - context.setFontSize(10) | ||
| 137 | - context.fillText('Hello World', 0, 30) | ||
| 138 | - context.setFontSize(20) | ||
| 139 | - context.fillText('Hello World', 100, 30) | ||
| 140 | - | ||
| 141 | - // context.restore() | ||
| 142 | - | ||
| 143 | - context.beginPath() | ||
| 144 | - context.moveTo(0, 30) | ||
| 145 | - context.lineTo(300, 30) | ||
| 146 | - context.stroke() | ||
| 147 | - context.draw() | ||
| 148 | - }, | ||
| 149 | - fill: function() { | ||
| 150 | - context.beginPath() | ||
| 151 | - context.rect(20, 20, 150, 100) | ||
| 152 | - context.setStrokeStyle('#00ff00') | ||
| 153 | - context.fill() | ||
| 154 | - context.draw() | ||
| 155 | - }, | ||
| 156 | - stroke: function() { | ||
| 157 | - context.beginPath() | ||
| 158 | - context.moveTo(20, 20) | ||
| 159 | - context.lineTo(20, 100) | ||
| 160 | - context.lineTo(70, 100) | ||
| 161 | - context.setStrokeStyle('#00ff00') | ||
| 162 | - context.stroke() | ||
| 163 | - context.draw() | ||
| 164 | - }, | ||
| 165 | - clearRect: function() { | ||
| 166 | - context.setFillStyle('#ff0000') | ||
| 167 | - context.beginPath() | ||
| 168 | - context.rect(0, 0, 300, 150) | ||
| 169 | - context.fill() | ||
| 170 | - context.clearRect(20, 20, 100, 50) | ||
| 171 | - context.draw() | ||
| 172 | - }, | ||
| 173 | - beginPath: function() { | ||
| 174 | - context.beginPath() | ||
| 175 | - context.setLineWidth(5) | ||
| 176 | - context.setStrokeStyle('#ff0000') | ||
| 177 | - context.moveTo(0, 75) | ||
| 178 | - context.lineTo(250, 75) | ||
| 179 | - context.stroke() | ||
| 180 | - context.beginPath() | ||
| 181 | - context.setStrokeStyle('#0000ff') | ||
| 182 | - context.moveTo(50, 0) | ||
| 183 | - context.lineTo(150, 130) | ||
| 184 | - context.stroke() | ||
| 185 | - context.draw() | ||
| 186 | - }, | ||
| 187 | - closePath: function() { | ||
| 188 | - context.beginPath() | ||
| 189 | - context.setLineWidth(1) | ||
| 190 | - context.moveTo(20, 20) | ||
| 191 | - context.lineTo(20, 100) | ||
| 192 | - context.lineTo(70, 100) | ||
| 193 | - context.closePath() | ||
| 194 | - context.stroke() | ||
| 195 | - context.draw() | ||
| 196 | - }, | ||
| 197 | - moveTo: function() { | ||
| 198 | - context.beginPath() | ||
| 199 | - context.moveTo(0, 0) | ||
| 200 | - context.lineTo(300, 150) | ||
| 201 | - context.stroke() | ||
| 202 | - context.draw() | ||
| 203 | - }, | ||
| 204 | - lineTo: function() { | ||
| 205 | - context.beginPath() | ||
| 206 | - context.moveTo(20, 20) | ||
| 207 | - context.lineTo(20, 100) | ||
| 208 | - context.lineTo(70, 100) | ||
| 209 | - context.stroke() | ||
| 210 | - context.draw() | ||
| 211 | - }, | ||
| 212 | - rect: function() { | ||
| 213 | - context.beginPath() | ||
| 214 | - context.rect(20, 20, 150, 100) | ||
| 215 | - context.stroke() | ||
| 216 | - context.draw() | ||
| 217 | - }, | ||
| 218 | - arc: function() { | ||
| 219 | - context.beginPath() | ||
| 220 | - context.setLineWidth(2) | ||
| 221 | - context.arc(75, 75, 50, 0, Math.PI * 2, true) | ||
| 222 | - context.moveTo(110, 75) | ||
| 223 | - context.arc(75, 75, 35, 0, Math.PI, false) | ||
| 224 | - context.moveTo(65, 65) | ||
| 225 | - context.arc(60, 65, 5, 0, Math.PI * 2, true) | ||
| 226 | - context.moveTo(95, 65) | ||
| 227 | - context.arc(90, 65, 5, 0, Math.PI * 2, true) | ||
| 228 | - context.stroke() | ||
| 229 | - context.draw() | ||
| 230 | - }, | ||
| 231 | - quadraticCurveTo: function() { | ||
| 232 | - context.beginPath() | ||
| 233 | - context.moveTo(20, 20) | ||
| 234 | - context.quadraticCurveTo(20, 100, 200, 20) | ||
| 235 | - context.stroke() | ||
| 236 | - context.draw() | ||
| 237 | - }, | ||
| 238 | - bezierCurveTo: function() { | ||
| 239 | - context.beginPath() | ||
| 240 | - context.moveTo(20, 20) | ||
| 241 | - context.bezierCurveTo(20, 100, 200, 100, 200, 20) | ||
| 242 | - context.stroke() | ||
| 243 | - context.draw() | ||
| 244 | - }, | ||
| 245 | - setFillStyle: function() { | ||
| 246 | - ['#fef957', 'rgb(242,159,63)', 'rgb(242,117,63)', '#e87e51'].forEach(function(item, index) { | ||
| 247 | - context.setFillStyle(item) | ||
| 248 | - context.beginPath() | ||
| 249 | - context.rect(0 + 75 * index, 0, 50, 50) | ||
| 250 | - context.fill() | ||
| 251 | - }) | ||
| 252 | - context.draw() | ||
| 253 | - }, | ||
| 254 | - setStrokeStyle: function() { | ||
| 255 | - ['#fef957', 'rgb(242,159,63)', 'rgb(242,117,63)', '#e87e51'].forEach(function(item, index) { | ||
| 256 | - context.setStrokeStyle(item) | ||
| 257 | - context.beginPath() | ||
| 258 | - context.rect(0 + 75 * index, 0, 50, 50) | ||
| 259 | - context.stroke() | ||
| 260 | - }) | ||
| 261 | - context.draw() | ||
| 262 | - }, | ||
| 263 | - setGlobalAlpha: function() { | ||
| 264 | - context.setFillStyle('#000000'); | ||
| 265 | - [1, 0.5, 0.1].forEach(function(item, index) { | ||
| 266 | - context.setGlobalAlpha(item) | ||
| 267 | - context.beginPath() | ||
| 268 | - context.rect(0 + 75 * index, 0, 50, 50) | ||
| 269 | - context.fill() | ||
| 270 | - }) | ||
| 271 | - context.draw() | ||
| 272 | - context.setGlobalAlpha(1) | ||
| 273 | - }, | ||
| 274 | - setShadow: function() { | ||
| 275 | - context.beginPath() | ||
| 276 | - context.setShadow(10, 10, 10, 'rgba(0, 0, 0, 199)') | ||
| 277 | - context.rect(10, 10, 100, 100) | ||
| 278 | - context.fill() | ||
| 279 | - context.draw() | ||
| 280 | - }, | ||
| 281 | - setFontSize: function() { | ||
| 282 | - [10, 20, 30, 40].forEach(function(item, index) { | ||
| 283 | - context.setFontSize(item) | ||
| 284 | - context.fillText('Hello, world', 20, 20 + 40 * index) | ||
| 285 | - }) | ||
| 286 | - context.draw() | ||
| 287 | - }, | ||
| 288 | - setLineCap: function() { | ||
| 289 | - context.setLineWidth(10); | ||
| 290 | - ['butt', 'round', 'square'].forEach(function(item, index) { | ||
| 291 | - context.beginPath() | ||
| 292 | - context.setLineCap(item) | ||
| 293 | - context.moveTo(20, 20 + 20 * index) | ||
| 294 | - context.lineTo(100, 20 + 20 * index) | ||
| 295 | - context.stroke() | ||
| 296 | - }) | ||
| 297 | - context.draw() | ||
| 298 | - }, | ||
| 299 | - setLineJoin: function() { | ||
| 300 | - context.setLineWidth(10); | ||
| 301 | - ['bevel', 'round', 'miter'].forEach(function(item, index) { | ||
| 302 | - context.beginPath() | ||
| 303 | - context.setLineJoin(item) | ||
| 304 | - context.moveTo(20 + 80 * index, 20) | ||
| 305 | - context.lineTo(100 + 80 * index, 50) | ||
| 306 | - context.lineTo(20 + 80 * index, 100) | ||
| 307 | - context.stroke() | ||
| 308 | - }) | ||
| 309 | - context.draw() | ||
| 310 | - }, | ||
| 311 | - setLineWidth: function() { | ||
| 312 | - [2, 4, 6, 8, 10].forEach(function(item, index) { | ||
| 313 | - context.beginPath() | ||
| 314 | - context.setLineWidth(item) | ||
| 315 | - context.moveTo(20, 20 + 20 * index) | ||
| 316 | - context.lineTo(100, 20 + 20 * index) | ||
| 317 | - context.stroke() | ||
| 318 | - }) | ||
| 319 | - context.draw() | ||
| 320 | - }, | ||
| 321 | - setMiterLimit: function() { | ||
| 322 | - context.setLineWidth(4); | ||
| 323 | - [2, 4, 6, 8, 10].forEach(function(item, index) { | ||
| 324 | - context.beginPath() | ||
| 325 | - context.setMiterLimit(item) | ||
| 326 | - context.moveTo(20 + 80 * index, 20) | ||
| 327 | - context.lineTo(100 + 80 * index, 50) | ||
| 328 | - context.lineTo(20 + 80 * index, 100) | ||
| 329 | - context.stroke() | ||
| 330 | - }) | ||
| 331 | - context.draw() | ||
| 332 | - } | ||
| 333 | - } | ||
| 334 | - } | ||
| 335 | -</script> | ||
| 336 | - | ||
| 337 | -<style> | ||
| 338 | - .canvas-element-wrapper { | ||
| 339 | - display: block; | ||
| 340 | - margin-bottom: 100rpx; | ||
| 341 | - } | ||
| 342 | - | ||
| 343 | - .canvas-element { | ||
| 344 | - width: 100%; | ||
| 345 | - height: 500rpx; | ||
| 346 | - background-color: #ffffff; | ||
| 347 | - } | ||
| 348 | - | ||
| 349 | - .canvas-buttons { | ||
| 350 | - padding: 30rpx 50rpx 10rpx; | ||
| 351 | - width: 100%; | ||
| 352 | - height: 360rpx; | ||
| 353 | - box-sizing: border-box; | ||
| 354 | - } | ||
| 355 | - | ||
| 356 | - .canvas-button { | ||
| 357 | - float: left; | ||
| 358 | - display: inline-flex; | ||
| 359 | - align-items: center; | ||
| 360 | - justify-content: center; | ||
| 361 | - height: 40px; | ||
| 362 | - line-height: 1; | ||
| 363 | - width: 300rpx; | ||
| 364 | - margin: 15rpx 12rpx; | ||
| 365 | - } | ||
| 366 | -</style> |
pages/API/choose-location/choose-location.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view style="background:#FFFFFF; padding:40rpx;"> | ||
| 6 | - <view class="uni-hello-text uni-center">当前位置信息</view> | ||
| 7 | - <block v-if="hasLocation === false"> | ||
| 8 | - <view class="uni-h2 uni-center uni-common-mt">未选择位置</view> | ||
| 9 | - </block> | ||
| 10 | - <block v-if="hasLocation === true"> | ||
| 11 | - <view class="uni-hello-text uni-center" style="margin-top:10px;"> | ||
| 12 | - {{locationAddress}} | ||
| 13 | - </view> | ||
| 14 | - <view class="uni-h2 uni-center uni-common-mt"> | ||
| 15 | - <text>E: {{location.longitude[0]}}°{{location.longitude[1]}}′</text> | ||
| 16 | - <text>\nN: {{location.latitude[0]}}°{{location.latitude[1]}}′</text> | ||
| 17 | - </view> | ||
| 18 | - </block> | ||
| 19 | - </view> | ||
| 20 | - <view class="uni-btn-v"> | ||
| 21 | - <button type="primary" @tap="chooseLocation">选择位置</button> | ||
| 22 | - <button @tap="clear">清空</button> | ||
| 23 | - </view> | ||
| 24 | - </view> | ||
| 25 | - </view> | ||
| 26 | -</template> | ||
| 27 | -<script> | ||
| 28 | - import * as util from '../../../common/util.js' | ||
| 29 | - var formatLocation = util.formatLocation; | ||
| 30 | - | ||
| 31 | - export default { | ||
| 32 | - data() { | ||
| 33 | - return { | ||
| 34 | - title: 'chooseLocation', | ||
| 35 | - hasLocation: false, | ||
| 36 | - location: {}, | ||
| 37 | - locationAddress: '' | ||
| 38 | - } | ||
| 39 | - }, | ||
| 40 | - methods: { | ||
| 41 | - chooseLocation: function () { | ||
| 42 | - uni.chooseLocation({ | ||
| 43 | - success: (res) => { | ||
| 44 | - this.hasLocation = true, | ||
| 45 | - this.location = formatLocation(res.longitude, res.latitude), | ||
| 46 | - this.locationAddress = res.address | ||
| 47 | - } | ||
| 48 | - }) | ||
| 49 | - }, | ||
| 50 | - clear: function () { | ||
| 51 | - this.hasLocation = false | ||
| 52 | - } | ||
| 53 | - } | ||
| 54 | - } | ||
| 55 | -</script> | ||
| 56 | - | ||
| 57 | -<style> | ||
| 58 | - .page-body-info { | ||
| 59 | - padding-bottom: 0; | ||
| 60 | - height: 440rpx; | ||
| 61 | - } | ||
| 62 | -</style> |
pages/API/clipboard/clipboard.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-title">请输入剪贴板内容</view> | ||
| 6 | - <view class="uni-list"> | ||
| 7 | - <view class="uni-list-cell"> | ||
| 8 | - <input class="uni-input" type="text" placeholder="请输入剪贴板内容" :value="data" @input="dataChange"/> | ||
| 9 | - </view> | ||
| 10 | - </view> | ||
| 11 | - <view class="uni-btn-v"> | ||
| 12 | - <button type="primary" @click="setClipboard">存储数据</button> | ||
| 13 | - <button @tap="getClipboard">读取数据</button> | ||
| 14 | - </view> | ||
| 15 | - </view> | ||
| 16 | - </view> | ||
| 17 | -</template> | ||
| 18 | -<script> | ||
| 19 | - export default { | ||
| 20 | - data() { | ||
| 21 | - return { | ||
| 22 | - title: 'get/setClipboardData', | ||
| 23 | - data: '' | ||
| 24 | - } | ||
| 25 | - }, | ||
| 26 | - methods: { | ||
| 27 | - dataChange: function (e) { | ||
| 28 | - this.data = e.detail.value | ||
| 29 | - }, | ||
| 30 | - getClipboard: function () { | ||
| 31 | - uni.getClipboardData({ | ||
| 32 | - success: (res) => { | ||
| 33 | - console.log(res.data); | ||
| 34 | - const content = res.data ? '剪贴板内容为:' + res.data : '剪贴板暂无内容'; | ||
| 35 | - uni.showModal({ | ||
| 36 | - content, | ||
| 37 | - title: '读取剪贴板', | ||
| 38 | - showCancel: false | ||
| 39 | - }) | ||
| 40 | - }, | ||
| 41 | - fail: () => { | ||
| 42 | - uni.showModal({ | ||
| 43 | - content: '读取剪贴板失败!', | ||
| 44 | - showCancel: false | ||
| 45 | - }) | ||
| 46 | - } | ||
| 47 | - }); | ||
| 48 | - }, | ||
| 49 | - setClipboard: function () { | ||
| 50 | - var data = this.data; | ||
| 51 | - if (data.length === 0) { | ||
| 52 | - uni.showModal({ | ||
| 53 | - title: '设置剪贴板失败', | ||
| 54 | - content: '内容不能为空', | ||
| 55 | - showCancel: false | ||
| 56 | - }) | ||
| 57 | - } else { | ||
| 58 | - uni.setClipboardData({ | ||
| 59 | - data: data, | ||
| 60 | - success: () => { | ||
| 61 | - // 成功处理 | ||
| 62 | - // #ifdef MP-ALIPAY || MP-BAIDU || MP-TOUTIAO | ||
| 63 | - uni.showToast({ | ||
| 64 | - title: '设置剪贴板成功', | ||
| 65 | - icon: "success", | ||
| 66 | - mask: !1 | ||
| 67 | - }) | ||
| 68 | - // #endif | ||
| 69 | - }, | ||
| 70 | - fail: () => { | ||
| 71 | - // 失败处理 | ||
| 72 | - // #ifdef MP-ALIPAY || MP-BAIDU || MP-TOUTIAO | ||
| 73 | - uni.showToast({ | ||
| 74 | - title: '储存数据失败!', | ||
| 75 | - icon: "none", | ||
| 76 | - mask: !1 | ||
| 77 | - }) | ||
| 78 | - // #endif | ||
| 79 | - } | ||
| 80 | - }); | ||
| 81 | - } | ||
| 82 | - } | ||
| 83 | - } | ||
| 84 | - } | ||
| 85 | -</script> | ||
| 86 | - | ||
| 87 | -<style> | ||
| 88 | - | ||
| 89 | -</style> | ||
| 90 | - | ||
| 91 | - |
pages/API/download-file/download-file.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view v-if="imageSrc" class="image-container"> | ||
| 6 | - <image class="img" :src="imageSrc" mode="center" /> | ||
| 7 | - </view> | ||
| 8 | - <block v-else style="margin-top: 50px;"> | ||
| 9 | - <view class="uni-hello-text"> | ||
| 10 | - 点击按钮下载服务端示例图片（下载网络文件到本地临时目录） | ||
| 11 | - </view> | ||
| 12 | - <view class="uni-btn-v"> | ||
| 13 | - <button type="primary" @tap="downloadImage">下载</button> | ||
| 14 | - </view> | ||
| 15 | - </block> | ||
| 16 | - </view> | ||
| 17 | - </view> | ||
| 18 | -</template> | ||
| 19 | -<script> | ||
| 20 | - export default { | ||
| 21 | - data() { | ||
| 22 | - return { | ||
| 23 | - title: 'downloadFile', | ||
| 24 | - imageSrc: '' | ||
| 25 | - } | ||
| 26 | - }, | ||
| 27 | - onUnload() { | ||
| 28 | - this.imageSrc = ''; | ||
| 29 | - }, | ||
| 30 | - methods: { | ||
| 31 | - downloadImage: function () { | ||
| 32 | - uni.showLoading({ | ||
| 33 | - title:'下载中' | ||
| 34 | - }) | ||
| 35 | - var self = this | ||
| 36 | - uni.downloadFile({ | ||
| 37 | - url: "https://img-cdn-qiniu.dcloud.net.cn/uniapp/images/uni@2x.png", | ||
| 38 | - success: (res) => { | ||
| 39 | - console.log('downloadFile success, res is', res) | ||
| 40 | - self.imageSrc = res.tempFilePath; | ||
| 41 | - uni.hideLoading(); | ||
| 42 | - }, | ||
| 43 | - fail: (err) => { | ||
| 44 | - console.log('downloadFile fail, err is:', err) | ||
| 45 | - } | ||
| 46 | - }) | ||
| 47 | - } | ||
| 48 | - } | ||
| 49 | - } | ||
| 50 | -</script> | ||
| 51 | - | ||
| 52 | -<style> | ||
| 53 | -.img { | ||
| 54 | - width: 500rpx; | ||
| 55 | - height: 500rpx; | ||
| 56 | - margin: 0 auto; | ||
| 57 | -} | ||
| 58 | -.image-container { | ||
| 59 | - display: flex; | ||
| 60 | - justify-content: center; | ||
| 61 | - align-items: center; | ||
| 62 | -} | ||
| 63 | -</style> |
pages/API/file/file.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <block v-if="tempFilePath"> | ||
| 6 | - <image :src="tempFilePath" class="image" mode="aspectFit"></image> | ||
| 7 | - </block> | ||
| 8 | - <block v-if="!tempFilePath && savedFilePath"> | ||
| 9 | - <image :src="savedFilePath" class="image" mode="aspectFit"></image> | ||
| 10 | - </block> | ||
| 11 | - <block v-if="!tempFilePath && !savedFilePath"> | ||
| 12 | - <view class="uni-hello-addfile" @click="chooseImage">+ 请选择文件</view> | ||
| 13 | - </block> | ||
| 14 | - <view class="uni-btn-v"> | ||
| 15 | - <button class="btn-savefile" @click="saveFile">保存文件</button> | ||
| 16 | - <button @click="clear">删除文件</button> | ||
| 17 | - </view> | ||
| 18 | - <!-- #ifndef MP-ALIPAY || MP-TOUTIAO --> | ||
| 19 | - <view class="btn-area"> | ||
| 20 | - <button @click="openDocument">打开pdf文件</button> | ||
| 21 | - </view> | ||
| 22 | - <!-- #endif --> | ||
| 23 | - </view> | ||
| 24 | - </view> | ||
| 25 | -</template> | ||
| 26 | -<script> | ||
| 27 | - export default { | ||
| 28 | - data() { | ||
| 29 | - return { | ||
| 30 | - title: 'saveFile', | ||
| 31 | - tempFilePath: '', | ||
| 32 | - savedFilePath: '' | ||
| 33 | - } | ||
| 34 | - }, | ||
| 35 | - onLoad() { | ||
| 36 | - this.savedFilePath = uni.getStorageSync('savedFilePath'); | ||
| 37 | - }, | ||
| 38 | - methods: { | ||
| 39 | - chooseImage() { | ||
| 40 | - uni.chooseImage({ | ||
| 41 | - count: 1, | ||
| 42 | - success: (res) => { | ||
| 43 | - this.tempFilePath = res.tempFilePaths[0]; | ||
| 44 | - }, | ||
| 45 | - fail: (err) => { | ||
| 46 | - // #ifdef MP | ||
| 47 | - uni.getSetting({ | ||
| 48 | - success: (res) => { | ||
| 49 | - let authStatus = res.authSetting['scope.album'] && res.authSetting['scope.camera']; | ||
| 50 | - if (!authStatus) { | ||
| 51 | - uni.showModal({ | ||
| 52 | - title: '授权失败', | ||
| 53 | - content: 'Hello uni-app需要从您的相机或相册获取图片，请在设置界面打开相关权限', | ||
| 54 | - success: (res) => { | ||
| 55 | - if (res.confirm) { | ||
| 56 | - uni.openSetting() | ||
| 57 | - } | ||
| 58 | - } | ||
| 59 | - }) | ||
| 60 | - } | ||
| 61 | - } | ||
| 62 | - }) | ||
| 63 | - // #endif | ||
| 64 | - } | ||
| 65 | - }); | ||
| 66 | - }, | ||
| 67 | - saveFile() { | ||
| 68 | - if (this.tempFilePath.length > 0) { | ||
| 69 | - uni.saveFile({ | ||
| 70 | - tempFilePath: this.tempFilePath, | ||
| 71 | - success: (res) => { | ||
| 72 | - this.savedFilePath = res.savedFilePath; | ||
| 73 | - uni.setStorageSync('savedFilePath', res.savedFilePath); | ||
| 74 | - uni.showModal({ | ||
| 75 | - title: '保存成功', | ||
| 76 | - content: '下次进入页面时，此文件仍可用', | ||
| 77 | - showCancel: false | ||
| 78 | - }); | ||
| 79 | - }, | ||
| 80 | - fail: (res) => { | ||
| 81 | - uni.showModal({ | ||
| 82 | - title: '保存失败', | ||
| 83 | - content: '失败原因: ' + JSON.stringify(res), | ||
| 84 | - showCancel: false | ||
| 85 | - }); | ||
| 86 | - } | ||
| 87 | - }) | ||
| 88 | - } else { | ||
| 89 | - uni.showModal({ | ||
| 90 | - content: '请选择文件', | ||
| 91 | - showCancel: false | ||
| 92 | - }); | ||
| 93 | - } | ||
| 94 | - }, | ||
| 95 | - clear() { | ||
| 96 | - uni.setStorageSync('savedFilePath', ''); | ||
| 97 | - this.tempFilePath = ''; | ||
| 98 | - this.savedFilePath = ''; | ||
| 99 | - }, | ||
| 100 | - // #ifndef MP-ALIPAY || MP-TOUTIAO | ||
| 101 | - openDocument() { | ||
| 102 | - uni.downloadFile({ | ||
| 103 | - url: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/b3f1d0b0-5168-11eb-bd01-97bc1429a9ff.pdf', | ||
| 104 | - success: (res) => { | ||
| 105 | - uni.openDocument({ | ||
| 106 | - filePath: res.tempFilePath, | ||
| 107 | - success: () => { | ||
| 108 | - console.log('打开文档成功'); | ||
| 109 | - } | ||
| 110 | - }); | ||
| 111 | - } | ||
| 112 | - }); | ||
| 113 | - }, | ||
| 114 | - // #endif | ||
| 115 | - } | ||
| 116 | - } | ||
| 117 | -</script> | ||
| 118 | - | ||
| 119 | -<style> | ||
| 120 | - .image { | ||
| 121 | - width: 100%; | ||
| 122 | - height: 360rpx; | ||
| 123 | - } | ||
| 124 | - | ||
| 125 | - .btn-savefile { | ||
| 126 | - background-color: #007aff; | ||
| 127 | - color: #ffffff; | ||
| 128 | - } | ||
| 129 | -</style> |
pages/API/full-screen-video-ad/full-screen-video-ad.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <button :loading="loading" :disabled="loading" type="primary" class="btn" @click="showAd">显示广告</button> | ||
| 6 | - </view> | ||
| 7 | - </view> | ||
| 8 | -</template> | ||
| 9 | - | ||
| 10 | -<script> | ||
| 11 | - export default { | ||
| 12 | - data() { | ||
| 13 | - return { | ||
| 14 | - title: '全屏视频广告', | ||
| 15 | - loading: false, | ||
| 16 | - loadError: false | ||
| 17 | - } | ||
| 18 | - }, | ||
| 19 | - onReady() { | ||
| 20 | - // #ifdef APP-PLUS | ||
| 21 | - this.adOption = { | ||
| 22 | - adpid: '1507000611' | ||
| 23 | - }; | ||
| 24 | - // #endif | ||
| 25 | - this.createAd(); | ||
| 26 | - }, | ||
| 27 | - methods: { | ||
| 28 | - createAd() { | ||
| 29 | - var _ad = this._ad = uni.createFullScreenVideoAd(this.adOption); | ||
| 30 | - _ad.onLoad(() => { | ||
| 31 | - this.loading = false; | ||
| 32 | - this.loadError = false; | ||
| 33 | - _ad.show(); | ||
| 34 | - console.log('onLoad event') | ||
| 35 | - }); | ||
| 36 | - _ad.onClose((res) => { | ||
| 37 | - // 用户点击了【关闭广告】按钮 | ||
| 38 | - if (res && res.isEnded) { | ||
| 39 | - // 正常播放结束 | ||
| 40 | - console.log("onClose " + res.isEnded); | ||
| 41 | - } else { | ||
| 42 | - // 播放中途退出 | ||
| 43 | - console.log("onClose " + res.isEnded); | ||
| 44 | - } | ||
| 45 | - | ||
| 46 | - setTimeout(() => { | ||
| 47 | - uni.showToast({ | ||
| 48 | - title: "全屏视频" + (res.isEnded ? "成功" : "未") + "播放完毕", | ||
| 49 | - duration: 10000, | ||
| 50 | - position: 'bottom' | ||
| 51 | - }) | ||
| 52 | - }, 500) | ||
| 53 | - }); | ||
| 54 | - _ad.onError((err) => { | ||
| 55 | - this.loading = false; | ||
| 56 | - if (err.code) { | ||
| 57 | - this.loadError = true; | ||
| 58 | - } | ||
| 59 | - console.log('onError event', err) | ||
| 60 | - uni.showToast({ | ||
| 61 | - title: err.errMsg, | ||
| 62 | - position: 'bottom' | ||
| 63 | - }) | ||
| 64 | - }); | ||
| 65 | - }, | ||
| 66 | - showAd() { | ||
| 67 | - this.loading = true; | ||
| 68 | - this._ad.load(); | ||
| 69 | - } | ||
| 70 | - } | ||
| 71 | - } | ||
| 72 | -</script> | ||
| 73 | - | ||
| 74 | -<style> | ||
| 75 | - .btn { | ||
| 76 | - margin-bottom: 20px; | ||
| 77 | - } | ||
| 78 | - | ||
| 79 | - .ad-tips { | ||
| 80 | - color: #999; | ||
| 81 | - padding: 30px 0; | ||
| 82 | - text-align: center; | ||
| 83 | - } | ||
| 84 | -</style> |
pages/API/get-location/get-location.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view style="background:#FFFFFF; padding:40rpx;"> | ||
| 6 | - <view class="uni-hello-text uni-center">当前位置经纬度</view> | ||
| 7 | - <block v-if="hasLocation === false"> | ||
| 8 | - <view class="uni-h2 uni-center uni-common-mt">未获取</view> | ||
| 9 | - </block> | ||
| 10 | - <block v-if="hasLocation === true"> | ||
| 11 | - <view class="uni-h2 uni-center uni-common-mt"> | ||
| 12 | - <text>E: {{location.longitude[0]}}°{{location.longitude[1]}}′</text> | ||
| 13 | - <text>\nN: {{location.latitude[0]}}°{{location.latitude[1]}}′</text> | ||
| 14 | - </view> | ||
| 15 | - </block> | ||
| 16 | - </view> | ||
| 17 | - <view class="uni-btn-v"> | ||
| 18 | - <button type="primary" @tap="getLocation">获取位置</button> | ||
| 19 | - <button @tap="clear">清空</button> | ||
| 20 | - </view> | ||
| 21 | - </view> | ||
| 22 | - <uni-popup :show="type === 'showpopup'" mode="fixed" @hidePopup="togglePopup('')"> | ||
| 23 | - <view class="popup-view"> | ||
| 24 | - <text class="popup-title">需要用户授权位置权限</text> | ||
| 25 | - <view class="uni-flex popup-buttons"> | ||
| 26 | - <button class="uni-flex-item" type="primary" open-type="openSetting" @tap="openSetting">设置</button> | ||
| 27 | - <button class="uni-flex-item" @tap="togglePopup('')">取消</button> | ||
| 28 | - </view> | ||
| 29 | - </view> | ||
| 30 | - </uni-popup> | ||
| 31 | - </view> | ||
| 32 | -</template> | ||
| 33 | -<script> | ||
| 34 | - import * as util from '../../../common/util.js' | ||
| 35 | - var formatLocation = util.formatLocation; | ||
| 36 | - // #ifdef APP-PLUS | ||
| 37 | - import permision from "@/common/permission.js" | ||
| 38 | - // #endif | ||
| 39 | - | ||
| 40 | - export default { | ||
| 41 | - data() { | ||
| 42 | - return { | ||
| 43 | - title: 'getLocation', | ||
| 44 | - hasLocation: false, | ||
| 45 | - location: {}, | ||
| 46 | - type: '' | ||
| 47 | - } | ||
| 48 | - }, | ||
| 49 | - methods: { | ||
| 50 | - togglePopup(type) { | ||
| 51 | - this.type = type; | ||
| 52 | - }, | ||
| 53 | - showConfirm() { | ||
| 54 | - this.type = 'showpopup'; | ||
| 55 | - }, | ||
| 56 | - hideConfirm() { | ||
| 57 | - this.type = ''; | ||
| 58 | - }, | ||
| 59 | - async getLocation() { | ||
| 60 | - // #ifdef APP-PLUS | ||
| 61 | - let status = await this.checkPermission(); | ||
| 62 | - if (status !== 1) { | ||
| 63 | - return; | ||
| 64 | - } | ||
| 65 | - // #endif | ||
| 66 | - // #ifdef MP-WEIXIN || MP-TOUTIAO || MP-QQ | ||
| 67 | - let status = await this.getSetting(); | ||
| 68 | - if (status === 2) { | ||
| 69 | - this.showConfirm(); | ||
| 70 | - return; | ||
| 71 | - } | ||
| 72 | - // #endif | ||
| 73 | - | ||
| 74 | - this.doGetLocation(); | ||
| 75 | - }, | ||
| 76 | - doGetLocation() { | ||
| 77 | - uni.getLocation({ | ||
| 78 | - success: (res) => { | ||
| 79 | - this.hasLocation = true; | ||
| 80 | - this.location = formatLocation(res.longitude, res.latitude); | ||
| 81 | - }, | ||
| 82 | - fail: (err) => { | ||
| 83 | - // #ifdef MP-BAIDU | ||
| 84 | - if (err.errCode === 202 || err.errCode === 10003) { // 202模拟器 10003真机 user deny | ||
| 85 | - this.showConfirm(); | ||
| 86 | - } | ||
| 87 | - // #endif | ||
| 88 | - // #ifndef MP-BAIDU | ||
| 89 | - if (err.errMsg.indexOf("auth deny") >= 0) { | ||
| 90 | - uni.showToast({ | ||
| 91 | - title: "访问位置被拒绝" | ||
| 92 | - }) | ||
| 93 | - } else { | ||
| 94 | - uni.showToast({ | ||
| 95 | - title: err.errMsg | ||
| 96 | - }) | ||
| 97 | - } | ||
| 98 | - // #endif | ||
| 99 | - } | ||
| 100 | - }) | ||
| 101 | - }, | ||
| 102 | - getSetting: function() { | ||
| 103 | - return new Promise((resolve, reject) => { | ||
| 104 | - uni.getSetting({ | ||
| 105 | - success: (res) => { | ||
| 106 | - if (res.authSetting['scope.userLocation'] === undefined) { | ||
| 107 | - resolve(0); | ||
| 108 | - return; | ||
| 109 | - } | ||
| 110 | - if (res.authSetting['scope.userLocation']) { | ||
| 111 | - resolve(1); | ||
| 112 | - } else { | ||
| 113 | - resolve(2); | ||
| 114 | - } | ||
| 115 | - } | ||
| 116 | - }); | ||
| 117 | - }); | ||
| 118 | - }, | ||
| 119 | - openSetting: function() { | ||
| 120 | - this.hideConfirm(); | ||
| 121 | - uni.openSetting({ | ||
| 122 | - success: (res) => { | ||
| 123 | - if (res.authSetting && res.authSetting['scope.userLocation']) { | ||
| 124 | - this.doGetLocation(); | ||
| 125 | - } | ||
| 126 | - }, | ||
| 127 | - fail: (err) => {} | ||
| 128 | - }) | ||
| 129 | - }, | ||
| 130 | - async checkPermission() { | ||
| 131 | - let status = permision.isIOS ? await permision.requestIOS('location') : | ||
| 132 | - await permision.requestAndroid('android.permission.ACCESS_FINE_LOCATION'); | ||
| 133 | - | ||
| 134 | - if (status === null || status === 1) { | ||
| 135 | - status = 1; | ||
| 136 | - } else if (status === 2) { | ||
| 137 | - uni.showModal({ | ||
| 138 | - content: "系统定位已关闭", | ||
| 139 | - confirmText: "确定", | ||
| 140 | - showCancel: false, | ||
| 141 | - success: function(res) { | ||
| 142 | - } | ||
| 143 | - }) | ||
| 144 | - } else if (status.code) { | ||
| 145 | - uni.showModal({ | ||
| 146 | - content: status.message | ||
| 147 | - }) | ||
| 148 | - } else { | ||
| 149 | - uni.showModal({ | ||
| 150 | - content: "需要定位权限", | ||
| 151 | - confirmText: "设置", | ||
| 152 | - success: function(res) { | ||
| 153 | - if (res.confirm) { | ||
| 154 | - permision.gotoAppSetting(); | ||
| 155 | - } | ||
| 156 | - } | ||
| 157 | - }) | ||
| 158 | - } | ||
| 159 | - | ||
| 160 | - return status; | ||
| 161 | - }, | ||
| 162 | - clear: function() { | ||
| 163 | - this.hasLocation = false | ||
| 164 | - } | ||
| 165 | - } | ||
| 166 | - } | ||
| 167 | -</script> | ||
| 168 | - | ||
| 169 | -<style> | ||
| 170 | - .popup-view { | ||
| 171 | - width: 500rpx; | ||
| 172 | - } | ||
| 173 | - | ||
| 174 | - .popup-title { | ||
| 175 | - display: block; | ||
| 176 | - font-size: 16px; | ||
| 177 | - line-height: 3; | ||
| 178 | - margin-bottom: 10px; | ||
| 179 | - text-align: center; | ||
| 180 | - } | ||
| 181 | - | ||
| 182 | - .popup-buttons button { | ||
| 183 | - margin-left: 4px; | ||
| 184 | - margin-right: 4px; | ||
| 185 | - } | ||
| 186 | -</style> |
pages/API/get-network-type/get-network-type.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view style="background:#FFFFFF; padding:40rpx;"> | ||
| 6 | - <view class="uni-hello-text uni-center">网络状态</view> | ||
| 7 | - <block v-if="hasNetworkType === false"> | ||
| 8 | - <view class="uni-h2 uni-center uni-common-mt">未获取</view> | ||
| 9 | - <view class="uni-hello-text uni-center uni-common-mt">请点击下面按钮获取网络状态</view> | ||
| 10 | - </block> | ||
| 11 | - <block v-if="hasNetworkType === true"> | ||
| 12 | - <view class="uni-h2 uni-center uni-common-mt">{{networkType}}</view> | ||
| 13 | - </block> | ||
| 14 | - <view v-if="hasNetworkType === true && networkType === 'wifi'" class="uni-textarea uni-common-mt"> | ||
| 15 | - <textarea :value="connectedWifi"></textarea> | ||
| 16 | - </view> | ||
| 17 | - </view> | ||
| 18 | - <view class="uni-btn-v uni-common-mt"> | ||
| 19 | - <button type="primary" @tap="getNetworkType">获取设备网络状态</button> | ||
| 20 | - <!-- #ifdef MP-WEIXIN || MP-JD--> | ||
| 21 | - <button v-if="hasNetworkType === true && networkType === 'wifi'" class="uni-common-mt" type="primary" @tap="getConnectedWifi">获取 wifi 信息</button> | ||
| 22 | - <!-- #endif --> | ||
| 23 | - <button class="uni-common-mt" @tap="clear">清空</button> | ||
| 24 | - </view> | ||
| 25 | - </view> | ||
| 26 | - </view> | ||
| 27 | -</template> | ||
| 28 | -<script> | ||
| 29 | - export default { | ||
| 30 | - data() { | ||
| 31 | - return { | ||
| 32 | - title: 'getNetworkType', | ||
| 33 | - hasNetworkType: false, | ||
| 34 | - networkType: '', | ||
| 35 | - connectedWifi: '' | ||
| 36 | - } | ||
| 37 | - }, | ||
| 38 | - onUnload:function(){ | ||
| 39 | - this.networkType = '',this.hasNetworkType = false; | ||
| 40 | - }, | ||
| 41 | - methods: { | ||
| 42 | - getNetworkType: function () { | ||
| 43 | - uni.getNetworkType({ | ||
| 44 | - success: (res) => { | ||
| 45 | - console.log(res) | ||
| 46 | - this.hasNetworkType = true, this.networkType = res.subtype || res.networkType | ||
| 47 | - }, | ||
| 48 | - fail: () => { | ||
| 49 | - uni.showModal({ | ||
| 50 | - content:'获取失败！', | ||
| 51 | - showCancel:false | ||
| 52 | - }) | ||
| 53 | - } | ||
| 54 | - }) | ||
| 55 | - }, | ||
| 56 | - clear: function () { | ||
| 57 | - this.hasNetworkType = false, | ||
| 58 | - this.networkType = '', | ||
| 59 | - this.connectedWifi = '' | ||
| 60 | - }, | ||
| 61 | - // #ifdef MP-WEIXIN || MP-JD | ||
| 62 | - getConnectedWifi() { | ||
| 63 | - const that = this | ||
| 64 | - uni.startWifi({ | ||
| 65 | - success: function() { | ||
| 66 | - uni.getConnectedWifi({ | ||
| 67 | - success: function(res) { | ||
| 68 | - const { wifi } = res | ||
| 69 | - that.connectedWifi = JSON.stringify(wifi) | ||
| 70 | - }, | ||
| 71 | - fail: function(res) { | ||
| 72 | - } | ||
| 73 | - }) | ||
| 74 | - }, | ||
| 75 | - fail: function(res) { | ||
| 76 | - } | ||
| 77 | - }) | ||
| 78 | - } | ||
| 79 | - // #endif | ||
| 80 | - } | ||
| 81 | - } | ||
| 82 | -</script> | ||
| 83 | - | ||
| 84 | -<style> | ||
| 85 | - | ||
| 86 | -</style> |
pages/API/get-node-info/get-node-info.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="movable block"> | ||
| 6 | - <!-- #ifndef MP-TOUTIAO --> | ||
| 7 | - <movable-area> | ||
| 8 | - <movable-view class="target" direction="all" @change="getNodeInfo">Drag</movable-view> | ||
| 9 | - </movable-area> | ||
| 10 | - <!-- #endif --> | ||
| 11 | - <!-- #ifdef MP-TOUTIAO --> | ||
| 12 | - <view class="target" @click="setPosition" :style="{top:top,left:left}">Click</view> | ||
| 13 | - <!-- #endif --> | ||
| 14 | - </view> | ||
| 15 | - <view class="movable"> | ||
| 16 | - <view class="info"> | ||
| 17 | - <view v-for="(item,index) in info" :key="index"> | ||
| 18 | - <text class="b">{{item.key}}</text> | ||
| 19 | - <text class="span">{{item.val}}</text> | ||
| 20 | - </view> | ||
| 21 | - </view> | ||
| 22 | - </view> | ||
| 23 | - </view> | ||
| 24 | - </view> | ||
| 25 | -</template> | ||
| 26 | - | ||
| 27 | -<script> | ||
| 28 | - export default { | ||
| 29 | - data() { | ||
| 30 | - return { | ||
| 31 | - title: 'createSelectorQuery', | ||
| 32 | - top: 0, | ||
| 33 | - left: '0px', | ||
| 34 | - info: [] | ||
| 35 | - } | ||
| 36 | - }, | ||
| 37 | - onReady() { | ||
| 38 | - this.getNodeInfo() | ||
| 39 | - }, | ||
| 40 | - methods: { | ||
| 41 | - setPosition() { | ||
| 42 | - this.left = Math.random() * uni.upx2px(320) + 'px' | ||
| 43 | - this.top = Math.random() * uni.upx2px(320) + 'px' | ||
| 44 | - this.getNodeInfo() | ||
| 45 | - }, | ||
| 46 | - getNodeInfo() { | ||
| 47 | - uni.createSelectorQuery().select('.target').boundingClientRect().exec((ret) => { | ||
| 48 | - const rect = ret[0] | ||
| 49 | - if (rect) { | ||
| 50 | - const sort = ['left','right','top','bottom','width','height'] | ||
| 51 | - const info = [] | ||
| 52 | - for (let i in sort) { | ||
| 53 | - let key = sort[i] | ||
| 54 | - info.push({ | ||
| 55 | - 'key': key, | ||
| 56 | - 'val': rect[key] | ||
| 57 | - }) | ||
| 58 | - } | ||
| 59 | - this.info = info | ||
| 60 | - } | ||
| 61 | - }); | ||
| 62 | - } | ||
| 63 | - }, | ||
| 64 | - } | ||
| 65 | -</script> | ||
| 66 | - | ||
| 67 | -<style> | ||
| 68 | - .movable { | ||
| 69 | - display: flex; | ||
| 70 | - justify-content: center; | ||
| 71 | - } | ||
| 72 | - | ||
| 73 | - .block { | ||
| 74 | - height: 400rpx; | ||
| 75 | - width: 400rpx; | ||
| 76 | - background-color: #FFFFFF; | ||
| 77 | - border: 1px solid #ccc; | ||
| 78 | - position: relative; | ||
| 79 | - margin: 0 auto; | ||
| 80 | - margin-bottom: 30rpx; | ||
| 81 | - } | ||
| 82 | - | ||
| 83 | - movable-area { | ||
| 84 | - height: 400rpx; | ||
| 85 | - width: 400rpx; | ||
| 86 | - position: relative; | ||
| 87 | - } | ||
| 88 | - | ||
| 89 | - .target { | ||
| 90 | - height: 80rpx; | ||
| 91 | - width: 80rpx; | ||
| 92 | - line-height: 80rpx; | ||
| 93 | - text-align: center; | ||
| 94 | - color: #FFFFFF; | ||
| 95 | - background-color: #4cd964; | ||
| 96 | - font-size: 28rpx; | ||
| 97 | - position: absolute; | ||
| 98 | - } | ||
| 99 | - | ||
| 100 | - .info { | ||
| 101 | - display: flex; | ||
| 102 | - flex-direction: column; | ||
| 103 | - justify-content: center; | ||
| 104 | - align-items: center; | ||
| 105 | - } | ||
| 106 | - | ||
| 107 | - .b { | ||
| 108 | - font-weight: bold; | ||
| 109 | - width: 150rpx; | ||
| 110 | - display: inline-block; | ||
| 111 | - } | ||
| 112 | - | ||
| 113 | - .span { | ||
| 114 | - width: 100rpx; | ||
| 115 | - display: inline-block; | ||
| 116 | - } | ||
| 117 | -</style> |
pages/API/get-system-info/get-system-info.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-common-mt"> | ||
| 5 | - <view class="uni-list"> | ||
| 6 | - <view class="uni-list-cell"> | ||
| 7 | - <view class="uni-pd"> | ||
| 8 | - <view class="uni-label" style="width:180px;">设备型号</view> | ||
| 9 | - </view> | ||
| 10 | - <view class="uni-list-cell-db"> | ||
| 11 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.model"/> | ||
| 12 | - </view> | ||
| 13 | - </view> | ||
| 14 | - <view class="uni-list-cell"> | ||
| 15 | - <view class="uni-pd"> | ||
| 16 | - <view class="uni-label" style="width:180px;">客户端平台</view> | ||
| 17 | - </view> | ||
| 18 | - <view class="uni-list-cell-db"> | ||
| 19 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.platform"/> | ||
| 20 | - </view> | ||
| 21 | - </view> | ||
| 22 | - <view class="uni-list-cell"> | ||
| 23 | - <view class="uni-pd"> | ||
| 24 | - <view class="uni-label" style="width:180px;">操作系统版本</view> | ||
| 25 | - </view> | ||
| 26 | - <view class="uni-list-cell-db"> | ||
| 27 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.system"/> | ||
| 28 | - </view> | ||
| 29 | - </view> | ||
| 30 | - <view class="uni-list-cell"> | ||
| 31 | - <view class="uni-pd"> | ||
| 32 | - <view class="uni-label" style="width:180px;">语言</view> | ||
| 33 | - </view> | ||
| 34 | - <view class="uni-list-cell-db"> | ||
| 35 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.language"/> | ||
| 36 | - </view> | ||
| 37 | - </view> | ||
| 38 | - <view class="uni-list-cell"> | ||
| 39 | - <view class="uni-pd"> | ||
| 40 | - <view class="uni-label" style="width:180px;">版本</view> | ||
| 41 | - </view> | ||
| 42 | - <view class="uni-list-cell-db"> | ||
| 43 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.version"/> | ||
| 44 | - </view> | ||
| 45 | - </view> | ||
| 46 | - <view class="uni-list-cell"> | ||
| 47 | - <view class="uni-pd"> | ||
| 48 | - <view class="uni-label" style="width:180px;">屏幕宽度</view> | ||
| 49 | - </view> | ||
| 50 | - <view class="uni-list-cell-db"> | ||
| 51 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.screenWidth"/> | ||
| 52 | - </view> | ||
| 53 | - </view> | ||
| 54 | - <view class="uni-list-cell"> | ||
| 55 | - <view class="uni-pd"> | ||
| 56 | - <view class="uni-label" style="width:180px;">屏幕高度</view> | ||
| 57 | - </view> | ||
| 58 | - <view class="uni-list-cell-db"> | ||
| 59 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.screenHeight"/> | ||
| 60 | - </view> | ||
| 61 | - </view> | ||
| 62 | - <view class="uni-list-cell"> | ||
| 63 | - <view class="uni-pd"> | ||
| 64 | - <view class="uni-label" style="width:180px;">可使用窗口高度</view> | ||
| 65 | - </view> | ||
| 66 | - <view class="uni-list-cell-db"> | ||
| 67 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.windowHeight"/> | ||
| 68 | - </view> | ||
| 69 | - </view> | ||
| 70 | - <view class="uni-list-cell"> | ||
| 71 | - <view class="uni-pd"> | ||
| 72 | - <view class="uni-label" style="width:180px;">可使用窗口的顶部位置</view> | ||
| 73 | - </view> | ||
| 74 | - <view class="uni-list-cell-db"> | ||
| 75 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.windowTop"/> | ||
| 76 | - </view> | ||
| 77 | - </view> | ||
| 78 | - <view class="uni-list-cell"> | ||
| 79 | - <view class="uni-pd"> | ||
| 80 | - <view class="uni-label" style="width:180px;">可使用窗口的底部位置</view> | ||
| 81 | - </view> | ||
| 82 | - <view class="uni-list-cell-db"> | ||
| 83 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.windowBottom"/> | ||
| 84 | - </view> | ||
| 85 | - </view> | ||
| 86 | - <view class="uni-list-cell"> | ||
| 87 | - <view class="uni-pd"> | ||
| 88 | - <view class="uni-label" style="width:180px;">状态栏的高度</view> | ||
| 89 | - </view> | ||
| 90 | - <view class="uni-list-cell-db"> | ||
| 91 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.statusBarHeight"/> | ||
| 92 | - </view> | ||
| 93 | - </view> | ||
| 94 | - <view class="uni-list-cell"> | ||
| 95 | - <view class="uni-pd"> | ||
| 96 | - <view class="uni-label" style="width:180px;">DPI</view> | ||
| 97 | - </view> | ||
| 98 | - <view class="uni-list-cell-db"> | ||
| 99 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.pixelRatio"/> | ||
| 100 | - </view> | ||
| 101 | - </view> | ||
| 102 | - <!-- #ifdef MP --> | ||
| 103 | - <view class="uni-list-cell"> | ||
| 104 | - <view class="uni-pd"> | ||
| 105 | - <view class="uni-label" style="width:180px;">基础库版本</view> | ||
| 106 | - </view> | ||
| 107 | - <view class="uni-list-cell-db"> | ||
| 108 | - <input class="uni-input" type="text" :disabled="true" placeholder="未获取" :value="systemInfo.SDKVersion"/> | ||
| 109 | - </view> | ||
| 110 | - </view> | ||
| 111 | - <!-- #endif --> | ||
| 112 | - </view> | ||
| 113 | - <view class="uni-padding-wrap"> | ||
| 114 | - <view class="uni-btn-v"> | ||
| 115 | - <button type="primary" @tap="getSystemInfo">获取设备系统信息</button> | ||
| 116 | - </view> | ||
| 117 | - </view> | ||
| 118 | - </view> | ||
| 119 | - </view> | ||
| 120 | -</template> | ||
| 121 | -<script> | ||
| 122 | - export default { | ||
| 123 | - data() { | ||
| 124 | - return { | ||
| 125 | - title: 'getSystemInfo', | ||
| 126 | - systemInfo: {} | ||
| 127 | - } | ||
| 128 | - }, | ||
| 129 | - onUnload:function(){ | ||
| 130 | - this.systemInfo = {}; | ||
| 131 | - }, | ||
| 132 | - methods: { | ||
| 133 | - getSystemInfo: function () { | ||
| 134 | - uni.getSystemInfo({ | ||
| 135 | - success: (res) => { | ||
| 136 | - this.systemInfo = res | ||
| 137 | - } | ||
| 138 | - }) | ||
| 139 | - } | ||
| 140 | - } | ||
| 141 | - } | ||
| 142 | -</script> | ||
| 143 | - | ||
| 144 | -<style> | ||
| 145 | - .uni-pd { | ||
| 146 | - padding-left: 30rpx; | ||
| 147 | - } | ||
| 148 | -</style> |
pages/API/get-user-info/get-user-info.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view style="background:#FFF; padding:40rpx;"> | ||
| 6 | - <block v-if="hasUserInfo === false"> | ||
| 7 | - <view class="uni-hello-text uni-center"> | ||
| 8 | - <text>请点击下方按钮获取用户头像及昵称或手机号</text> | ||
| 9 | - </view> | ||
| 10 | - </block> | ||
| 11 | - <block v-if="hasUserInfo === true"> | ||
| 12 | - <view class="uni-h4 uni-center uni-common-mt">{{userInfo.nickName || userInfo.nickname || userInfo.gender || userInfo.email || userInfo.phoneNumber}}</view> | ||
| 13 | - <view v-if="userInfo.avatarUrl || userInfo.avatar_url " style="padding:30rpx 0; text-align:center;"> | ||
| 14 | - <image class="userinfo-avatar" :src="userInfo.avatarUrl||userInfo.avatar_url"></image> | ||
| 15 | - </view> | ||
| 16 | - </block> | ||
| 17 | - </view> | ||
| 18 | - <view class="uni-btn-v"> | ||
| 19 | - <!-- #ifdef APP-PLUS || MP-ALIPAY || MP-TOUTIAO --> | ||
| 20 | - <button type="primary" :loading="btnLoading" @click="getUserInfo">获取用户信息</button> | ||
| 21 | - <!-- #endif --> | ||
| 22 | - <!-- #ifdef MP-WEIXIN || MP-BAIDU || MP-QQ || MP-JD --> | ||
| 23 | - <button type="primary" open-type="getUserInfo" @getuserinfo="mpGetUserInfo">获取用户信息</button> | ||
| 24 | - <!-- #endif --> | ||
| 25 | - <button @click="clear">清空</button> | ||
| 26 | - </view> | ||
| 27 | - </view> | ||
| 28 | - </view> | ||
| 29 | -</template> | ||
| 30 | -<script> | ||
| 31 | - import { | ||
| 32 | - mapState, | ||
| 33 | - mapMutations, | ||
| 34 | - mapActions | ||
| 35 | - } from 'vuex' | ||
| 36 | - | ||
| 37 | - export default { | ||
| 38 | - data() { | ||
| 39 | - return { | ||
| 40 | - title: 'getUserInfo', | ||
| 41 | - hasUserInfo: false, | ||
| 42 | - userInfo: {}, | ||
| 43 | - btnLoading: false | ||
| 44 | - } | ||
| 45 | - }, | ||
| 46 | - computed: { | ||
| 47 | - ...mapState([ | ||
| 48 | - 'loginProvider', | ||
| 49 | - 'isUniverifyLogin' | ||
| 50 | - ]) | ||
| 51 | - }, | ||
| 52 | - methods: { | ||
| 53 | - ...mapActions(['getPhoneNumber']), | ||
| 54 | - // 获取用户信息 API 在小程序可直接使用，在 5+App 里面需要先登录才能调用 | ||
| 55 | - getUserInfo() { | ||
| 56 | - this.btnLoading = true; | ||
| 57 | - if (this.isUniverifyLogin) { | ||
| 58 | - // 一键登录 | ||
| 59 | - this.getPhoneNumber(uni.getStorageSync('univerifyInfo')).then(phoneNumber => { | ||
| 60 | - this.hasUserInfo = true; | ||
| 61 | - this.userInfo = { | ||
| 62 | - phoneNumber | ||
| 63 | - }; | ||
| 64 | - }).catch(err => { | ||
| 65 | - console.error('getUserInfo fail:', err); | ||
| 66 | - this.hasUserInfo = false; | ||
| 67 | - }).finally(() => { | ||
| 68 | - this.btnLoading = false; | ||
| 69 | - }) | ||
| 70 | - return; | ||
| 71 | - } | ||
| 72 | - | ||
| 73 | - if(this.loginProvider === 'apple'){ | ||
| 74 | - const nickname = uni.getStorageSync('apple_nickname') | ||
| 75 | - if(nickname){ | ||
| 76 | - this.hasUserInfo = true; | ||
| 77 | - this.userInfo = { nickName:nickname } | ||
| 78 | - this.btnLoading = false; | ||
| 79 | - return; | ||
| 80 | - } | ||
| 81 | - } | ||
| 82 | - | ||
| 83 | - uni.getUserInfo({ | ||
| 84 | - provider: this.loginProvider, | ||
| 85 | - success: (result) => { | ||
| 86 | - this.hasUserInfo = true; | ||
| 87 | - this.userInfo = result.userInfo; | ||
| 88 | - }, | ||
| 89 | - fail: (error) => { | ||
| 90 | - console.log('getUserInfo fail', error); | ||
| 91 | - let content = error.errMsg; | ||
| 92 | - if (~content.indexOf('uni.login')) { | ||
| 93 | - content = '请在登录页面完成登录操作'; | ||
| 94 | - } | ||
| 95 | - // #ifndef APP-PLUS | ||
| 96 | - uni.getSetting({ | ||
| 97 | - success: (res) => { | ||
| 98 | - let authStatus = res.authSetting['scope.userInfo']; | ||
| 99 | - if (!authStatus) { | ||
| 100 | - uni.showModal({ | ||
| 101 | - title: '授权失败', | ||
| 102 | - content: 'Hello uni-app需要获取您的用户信息，请在设置界面打开相关权限', | ||
| 103 | - success: (res) => { | ||
| 104 | - if (res.confirm) { | ||
| 105 | - uni.openSetting() | ||
| 106 | - } | ||
| 107 | - } | ||
| 108 | - }) | ||
| 109 | - } else { | ||
| 110 | - uni.showModal({ | ||
| 111 | - title: '获取用户信息失败', | ||
| 112 | - content: '错误原因' + content, | ||
| 113 | - showCancel: false | ||
| 114 | - }); | ||
| 115 | - } | ||
| 116 | - } | ||
| 117 | - }) | ||
| 118 | - // #endif | ||
| 119 | - // #ifdef APP-PLUS | ||
| 120 | - uni.showModal({ | ||
| 121 | - title: '获取用户信息失败', | ||
| 122 | - content: '错误原因' + content, | ||
| 123 | - showCancel: false | ||
| 124 | - }); | ||
| 125 | - // #endif | ||
| 126 | - }, | ||
| 127 | - complete: () => { | ||
| 128 | - this.btnLoading = false; | ||
| 129 | - } | ||
| 130 | - }); | ||
| 131 | - }, | ||
| 132 | - mpGetUserInfo(result) { | ||
| 133 | - console.log('mpGetUserInfo', result); | ||
| 134 | - if (result.detail.errMsg !== 'getUserInfo:ok') { | ||
| 135 | - uni.showModal({ | ||
| 136 | - title: '获取用户信息失败', | ||
| 137 | - content: '错误原因' + result.detail.errMsg, | ||
| 138 | - showCancel: false | ||
| 139 | - }); | ||
| 140 | - return; | ||
| 141 | - } | ||
| 142 | - this.hasUserInfo = true; | ||
| 143 | - if(result.detail && result.detail.userInfo){ | ||
| 144 | - this.userInfo = result.detail.userInfo; | ||
| 145 | - }else{ | ||
| 146 | - // #ifdef MP-JD | ||
| 147 | - this.userInfo = result.detail.user_info; | ||
| 148 | - // #endif | ||
| 149 | - } | ||
| 150 | - }, | ||
| 151 | - clear() { | ||
| 152 | - this.hasUserInfo = false; | ||
| 153 | - this.userInfo = {}; | ||
| 154 | - } | ||
| 155 | - } | ||
| 156 | - } | ||
| 157 | -</script> | ||
| 158 | - | ||
| 159 | -<style> | ||
| 160 | - .userinfo-avatar { | ||
| 161 | - border-radius: 128rpx; | ||
| 162 | - width: 128rpx; | ||
| 163 | - height: 128rpx; | ||
| 164 | - } | ||
| 165 | -</style> |
pages/API/ibeacon/ibeacon.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-btn-v"> | ||
| 6 | - <button type="primary" :disabled="isOpen" @click="openBluetoothAdapter">打开蓝牙模块</button> | ||
| 7 | - <button type="primary" :disabled="!isOpen" @click="closeBluetoothAdapter">关闭蓝牙模块</button> | ||
| 8 | - <button type="primary" :disabled="!isOpen || isStarted" :loading="isStarted" @click="startBeaconDiscovery">开始搜索附近的iBeacon设备</button> | ||
| 9 | - <button type="primary" :disabled="!isStarted" @click="stopBeaconDiscovery">停止搜索附近的iBeacon设备</button> | ||
| 10 | - </view> | ||
| 11 | - </view> | ||
| 12 | - <scroll-view class="uni-scroll_box"> | ||
| 13 | - <view class="uni-title" v-if="isStarted || deviceList.length > 0">已经发现 {{ deviceList.length }} 台设备:</view> | ||
| 14 | - <view class="uni-list-box" v-for="(item, index) in deviceList" :key="item.uuid"> | ||
| 15 | - <view> | ||
| 16 | - <view class="uni-list_name">UUID: {{ item.uuid }}</view> | ||
| 17 | - <view class="uni-list_item">major: {{ item.major }}</view> | ||
| 18 | - <view class="uni-list_item">minor: {{ item.minor }}</view> | ||
| 19 | - <view class="uni-list_item">rssi: {{ item.rssi }} dBm</view> | ||
| 20 | - <view class="uni-list_item">accuracy: {{ item.accuracy }}</view> | ||
| 21 | - <view class="uni-list_item">heading: {{ item.heading }}</view> | ||
| 22 | - </view> | ||
| 23 | - </view> | ||
| 24 | - </scroll-view> | ||
| 25 | - </view> | ||
| 26 | -</template> | ||
| 27 | -<script> | ||
| 28 | - const DEVICE_UUID_WEICHAT = 'FDA50693-A4E2-4FB1-AFCF-C6EB07647825'; | ||
| 29 | - export default { | ||
| 30 | - data() { | ||
| 31 | - return { | ||
| 32 | - title: 'iBeacon', | ||
| 33 | - isOpen: false, | ||
| 34 | - isStarted: false, | ||
| 35 | - deviceList: [], | ||
| 36 | - isPageOpened: false | ||
| 37 | - }; | ||
| 38 | - }, | ||
| 39 | - onLoad() { | ||
| 40 | - this.onBeaconUpdate(); | ||
| 41 | - }, | ||
| 42 | - onShow() { | ||
| 43 | - this.isPageOpened = true; | ||
| 44 | - }, | ||
| 45 | - methods: { | ||
| 46 | - maskclose() { | ||
| 47 | - this.maskShow = false; | ||
| 48 | - }, | ||
| 49 | - openBluetoothAdapter() { | ||
| 50 | - uni.openBluetoothAdapter({ | ||
| 51 | - success: (res) => { | ||
| 52 | - console.log('初始化蓝牙成功:' + res.errMsg); | ||
| 53 | - console.log(res); | ||
| 54 | - this.isOpen = true; | ||
| 55 | - this.deviceList = []; | ||
| 56 | - }, | ||
| 57 | - fail: (err) => { | ||
| 58 | - console.log('初始化蓝牙失败，错误码：' + (err.errCode || err.errMsg)); | ||
| 59 | - if (err.errCode !== 0) { | ||
| 60 | - initTypes(err.errCode, err.errMsg); | ||
| 61 | - } | ||
| 62 | - } | ||
| 63 | - }); | ||
| 64 | - }, | ||
| 65 | - closeBluetoothAdapter(OBJECT) { | ||
| 66 | - this.stopBeaconDiscovery(); | ||
| 67 | - wx.closeBluetoothAdapter({ | ||
| 68 | - success: (res) => { | ||
| 69 | - this.isOpen = false; | ||
| 70 | - console.log('断开蓝牙模块成功'); | ||
| 71 | - } | ||
| 72 | - }); | ||
| 73 | - }, | ||
| 74 | - onBeaconUpdate() { | ||
| 75 | - uni.onBeaconUpdate(res => { | ||
| 76 | - if (!this.isPageOpened || !this.isOpen || !this.isStarted) { | ||
| 77 | - return; | ||
| 78 | - } | ||
| 79 | - console.log(res); | ||
| 80 | - // if (res.code !== 0) { | ||
| 81 | - // return; | ||
| 82 | - // } | ||
| 83 | - if (res.beacons && res.beacons.length > 0) { | ||
| 84 | - this.getBeacons(); | ||
| 85 | - } else if (!res.connected) { | ||
| 86 | - this.deviceList = []; | ||
| 87 | - } | ||
| 88 | - }); | ||
| 89 | - }, | ||
| 90 | - startBeaconDiscovery() { | ||
| 91 | - uni.startBeaconDiscovery({ | ||
| 92 | - uuids: this.getUUIDList(), | ||
| 93 | - success: (res) => { | ||
| 94 | - this.isStarted = true; | ||
| 95 | - console.log(res); | ||
| 96 | - }, | ||
| 97 | - fail: (err) => { | ||
| 98 | - console.error(err); | ||
| 99 | - } | ||
| 100 | - }); | ||
| 101 | - }, | ||
| 102 | - stopBeaconDiscovery(types) { | ||
| 103 | - if(this.isStarted) { | ||
| 104 | - uni.stopBeaconDiscovery({ | ||
| 105 | - success: (res) => { | ||
| 106 | - this.isStarted = false; | ||
| 107 | - }, | ||
| 108 | - fail: (err) => { | ||
| 109 | - console.error(err); | ||
| 110 | - } | ||
| 111 | - }); | ||
| 112 | - } | ||
| 113 | - }, | ||
| 114 | - getBeacons() { | ||
| 115 | - uni.getBeacons({ | ||
| 116 | - success: (res) => { | ||
| 117 | - if (res.beacons && res.beacons.length > 0) { | ||
| 118 | - console.log(res.beacons); | ||
| 119 | - this.deviceList = res.beacons; | ||
| 120 | - } | ||
| 121 | - }, | ||
| 122 | - fail: (err) => { | ||
| 123 | - console.log('获取设备服务失败，错误码：' + err.errCode); | ||
| 124 | - if (errCode.errCode !== 0) { | ||
| 125 | - initTypes(errCode.errCode); | ||
| 126 | - } | ||
| 127 | - } | ||
| 128 | - }); | ||
| 129 | - }, | ||
| 130 | - getUUIDList() { | ||
| 131 | - // #ifdef APP-PLUS | ||
| 132 | - const sysInfo = uni.getSystemInfoSync(); | ||
| 133 | - if (!sysInfo) { | ||
| 134 | - return []; | ||
| 135 | - } | ||
| 136 | - let isIOS = sysInfo.platform ? (sysInfo.platform.toLowerCase() === "ios") : false; | ||
| 137 | - if (isIOS) { | ||
| 138 | - return [DEVICE_UUID_WEICHAT]; | ||
| 139 | - } | ||
| 140 | - return []; | ||
| 141 | - // #endif | ||
| 142 | - | ||
| 143 | - // #ifndef APP-PLUS | ||
| 144 | - return [DEVICE_UUID_WEICHAT]; | ||
| 145 | - // #endif | ||
| 146 | - } | ||
| 147 | - }, | ||
| 148 | - onUnload() { | ||
| 149 | - this.isPageOpened = false; | ||
| 150 | - } | ||
| 151 | - }; | ||
| 152 | - | ||
| 153 | - /** | ||
| 154 | - * 判断初始化蓝牙状态 | ||
| 155 | - */ | ||
| 156 | - function initTypes(code, errMsg) { | ||
| 157 | - switch (code) { | ||
| 158 | - case 10000: | ||
| 159 | - toast('未初始化蓝牙适配器'); | ||
| 160 | - break; | ||
| 161 | - case 10001: | ||
| 162 | - toast('未检测到蓝牙，请打开蓝牙重试！'); | ||
| 163 | - break; | ||
| 164 | - case 10002: | ||
| 165 | - toast('没有找到指定设备'); | ||
| 166 | - break; | ||
| 167 | - case 10003: | ||
| 168 | - toast('连接失败'); | ||
| 169 | - break; | ||
| 170 | - case 10004: | ||
| 171 | - toast('没有找到指定服务'); | ||
| 172 | - break; | ||
| 173 | - case 10005: | ||
| 174 | - toast('没有找到指定特征值'); | ||
| 175 | - break; | ||
| 176 | - case 10006: | ||
| 177 | - toast('当前连接已断开'); | ||
| 178 | - break; | ||
| 179 | - case 10007: | ||
| 180 | - toast('当前特征值不支持此操作'); | ||
| 181 | - break; | ||
| 182 | - case 10008: | ||
| 183 | - toast('其余所有系统上报的异常'); | ||
| 184 | - break; | ||
| 185 | - case 10009: | ||
| 186 | - toast('Android 系统特有，系统版本低于 4.3 不支持 BLE'); | ||
| 187 | - break; | ||
| 188 | - default: | ||
| 189 | - toast(errMsg); | ||
| 190 | - } | ||
| 191 | - } | ||
| 192 | - | ||
| 193 | - /** | ||
| 194 | - * 弹出框封装 | ||
| 195 | - */ | ||
| 196 | - function toast(content, showCancel = false) { | ||
| 197 | - uni.showModal({ | ||
| 198 | - title: '提示', | ||
| 199 | - content, | ||
| 200 | - showCancel | ||
| 201 | - }); | ||
| 202 | - } | ||
| 203 | -</script> | ||
| 204 | - | ||
| 205 | -<style> | ||
| 206 | - .uni-title { | ||
| 207 | - /* width: 100%; */ | ||
| 208 | - /* height: 80rpx; */ | ||
| 209 | - text-align: center; | ||
| 210 | - } | ||
| 211 | - | ||
| 212 | - .uni-mask { | ||
| 213 | - position: fixed; | ||
| 214 | - top: 0; | ||
| 215 | - left: 0; | ||
| 216 | - bottom: 0; | ||
| 217 | - display: flex; | ||
| 218 | - align-items: center; | ||
| 219 | - width: 100%; | ||
| 220 | - background: rgba(0, 0, 0, 0.6); | ||
| 221 | - padding: 0 30rpx; | ||
| 222 | - box-sizing: border-box; | ||
| 223 | - } | ||
| 224 | - | ||
| 225 | - .uni-scroll_box { | ||
| 226 | - height: 70%; | ||
| 227 | - background: #fff; | ||
| 228 | - border-radius: 20rpx; | ||
| 229 | - } | ||
| 230 | - | ||
| 231 | - .uni-list-box { | ||
| 232 | - margin: 0 20rpx; | ||
| 233 | - padding: 15rpx 0; | ||
| 234 | - border-bottom: 1px #f5f5f5 solid; | ||
| 235 | - box-sizing: border-box; | ||
| 236 | - } | ||
| 237 | - | ||
| 238 | - .uni-list:last-child { | ||
| 239 | - border: none; | ||
| 240 | - } | ||
| 241 | - | ||
| 242 | - .uni-list_name { | ||
| 243 | - font-size: 30rpx; | ||
| 244 | - color: #333; | ||
| 245 | - } | ||
| 246 | - | ||
| 247 | - .uni-list_item { | ||
| 248 | - font-size: 24rpx; | ||
| 249 | - color: #555; | ||
| 250 | - line-height: 1.5; | ||
| 251 | - } | ||
| 252 | - | ||
| 253 | - .uni-success_box { | ||
| 254 | - position: absolute; | ||
| 255 | - left: 0; | ||
| 256 | - bottom: 0; | ||
| 257 | - min-height: 100rpx; | ||
| 258 | - width: 100%; | ||
| 259 | - background: #fff; | ||
| 260 | - box-sizing: border-box; | ||
| 261 | - border-top: 1px #eee solid; | ||
| 262 | - } | ||
| 263 | - | ||
| 264 | - .uni-success_sub { | ||
| 265 | - /* width: 100%%; */ | ||
| 266 | - height: 100rpx; | ||
| 267 | - display: flex; | ||
| 268 | - justify-content: space-between; | ||
| 269 | - align-items: center; | ||
| 270 | - padding: 0 30rpx; | ||
| 271 | - } | ||
| 272 | - | ||
| 273 | - .uni-close_button { | ||
| 274 | - padding: 0 20rpx; | ||
| 275 | - height: 60rpx; | ||
| 276 | - line-height: 60rpx; | ||
| 277 | - background: #ce3c39; | ||
| 278 | - color: #ffffff; | ||
| 279 | - border-radius: 10rpx; | ||
| 280 | - } | ||
| 281 | - | ||
| 282 | - .uni-success_content { | ||
| 283 | - height: 600rpx; | ||
| 284 | - margin: 30rpx; | ||
| 285 | - margin-top: 0; | ||
| 286 | - border: 1px #eee solid; | ||
| 287 | - padding: 30rpx; | ||
| 288 | - } | ||
| 289 | - | ||
| 290 | - .uni-content_list { | ||
| 291 | - padding-bottom: 10rpx; | ||
| 292 | - border-bottom: 1px #f5f5f5 solid; | ||
| 293 | - } | ||
| 294 | - | ||
| 295 | - .uni-tips { | ||
| 296 | - text-align: center; | ||
| 297 | - font-size: 24rpx; | ||
| 298 | - color: #666; | ||
| 299 | - } | ||
| 300 | -</style> |
pages/API/image/image.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-common-mt"> | ||
| 5 | - <form> | ||
| 6 | - <view class="uni-list"> | ||
| 7 | - <view class="uni-list-cell"> | ||
| 8 | - <view class="uni-list-cell-left"> | ||
| 9 | - <view class="uni-label">图片来源</view> | ||
| 10 | - </view> | ||
| 11 | - <view class="uni-list-cell-right"> | ||
| 12 | - <picker :range="sourceType" @change="sourceTypeChange" :value="sourceTypeIndex" mode="selector"> | ||
| 13 | - <view class="uni-input">{{sourceType[sourceTypeIndex]}}</view> | ||
| 14 | - </picker> | ||
| 15 | - </view> | ||
| 16 | - </view> | ||
| 17 | - | ||
| 18 | - <view class="uni-list-cell"> | ||
| 19 | - <view class="uni-list-cell-left"> | ||
| 20 | - <view class="uni-label">图片质量</view> | ||
| 21 | - </view> | ||
| 22 | - <view class="uni-list-cell-right"> | ||
| 23 | - <picker :range="sizeType" @change="sizeTypeChange" :value="sizeTypeIndex" mode="selector"> | ||
| 24 | - <view class="uni-input">{{sizeType[sizeTypeIndex]}}</view> | ||
| 25 | - </picker> | ||
| 26 | - </view> | ||
| 27 | - </view> | ||
| 28 | - | ||
| 29 | - <view class="uni-list-cell"> | ||
| 30 | - <view class="uni-list-cell-left"> | ||
| 31 | - <view class="uni-label">数量限制</view> | ||
| 32 | - </view> | ||
| 33 | - <view class="uni-list-cell-right"> | ||
| 34 | - <picker :range="count" @change="countChange" mode="selector"> | ||
| 35 | - <view class="uni-input">{{count[countIndex]}}</view> | ||
| 36 | - </picker> | ||
| 37 | - </view> | ||
| 38 | - </view> | ||
| 39 | - </view> | ||
| 40 | - | ||
| 41 | - | ||
| 42 | - <view class="uni-list list-pd"> | ||
| 43 | - <view class="uni-list-cell cell-pd"> | ||
| 44 | - <view class="uni-uploader"> | ||
| 45 | - <view class="uni-uploader-head"> | ||
| 46 | - <view class="uni-uploader-title">点击可预览选好的图片</view> | ||
| 47 | - <view class="uni-uploader-info">{{imageList.length}}/9</view> | ||
| 48 | - </view> | ||
| 49 | - <view class="uni-uploader-body"> | ||
| 50 | - <view class="uni-uploader__files"> | ||
| 51 | - <block v-for="(image,index) in imageList" :key="index"> | ||
| 52 | - <view class="uni-uploader__file"> | ||
| 53 | - <image class="uni-uploader__img" :src="image" :data-src="image" @tap="previewImage"></image> | ||
| 54 | - </view> | ||
| 55 | - </block> | ||
| 56 | - <view class="uni-uploader__input-box"> | ||
| 57 | - <view class="uni-uploader__input" @tap="chooseImage"></view> | ||
| 58 | - </view> | ||
| 59 | - </view> | ||
| 60 | - </view> | ||
| 61 | - </view> | ||
| 62 | - </view> | ||
| 63 | - </view> | ||
| 64 | - </form> | ||
| 65 | - </view> | ||
| 66 | - </view> | ||
| 67 | -</template> | ||
| 68 | -<script> | ||
| 69 | - import permision from "@/common/permission.js" | ||
| 70 | - var sourceType = [ | ||
| 71 | - ['camera'], | ||
| 72 | - ['album'], | ||
| 73 | - ['camera', 'album'] | ||
| 74 | - ] | ||
| 75 | - var sizeType = [ | ||
| 76 | - ['compressed'], | ||
| 77 | - ['original'], | ||
| 78 | - ['compressed', 'original'] | ||
| 79 | - ] | ||
| 80 | - export default { | ||
| 81 | - data() { | ||
| 82 | - return { | ||
| 83 | - title: 'choose/previewImage', | ||
| 84 | - imageList: [], | ||
| 85 | - sourceTypeIndex: 2, | ||
| 86 | - sourceType: ['拍照', '相册', '拍照或相册'], | ||
| 87 | - sizeTypeIndex: 2, | ||
| 88 | - sizeType: ['压缩', '原图', '压缩或原图'], | ||
| 89 | - countIndex: 8, | ||
| 90 | - count: [1, 2, 3, 4, 5, 6, 7, 8, 9] | ||
| 91 | - } | ||
| 92 | - }, | ||
| 93 | - onUnload() { | ||
| 94 | - this.imageList = [], | ||
| 95 | - this.sourceTypeIndex = 2, | ||
| 96 | - this.sourceType = ['拍照', '相册', '拍照或相册'], | ||
| 97 | - this.sizeTypeIndex = 2, | ||
| 98 | - this.sizeType = ['压缩', '原图', '压缩或原图'], | ||
| 99 | - this.countIndex = 8; | ||
| 100 | - }, | ||
| 101 | - methods: { | ||
| 102 | - sourceTypeChange: function(e) { | ||
| 103 | - this.sourceTypeIndex = parseInt(e.detail.value) | ||
| 104 | - }, | ||
| 105 | - sizeTypeChange: function(e) { | ||
| 106 | - this.sizeTypeIndex = parseInt(e.detail.value) | ||
| 107 | - }, | ||
| 108 | - countChange: function(e) { | ||
| 109 | - this.countIndex = e.detail.value; | ||
| 110 | - }, | ||
| 111 | - chooseImage: async function() { | ||
| 112 | - // #ifdef APP-PLUS | ||
| 113 | - // TODO 选择相机或相册时 需要弹出actionsheet，目前无法获得是相机还是相册，在失败回调中处理 | ||
| 114 | - if (this.sourceTypeIndex !== 2) { | ||
| 115 | - let status = await this.checkPermission(); | ||
| 116 | - if (status !== 1) { | ||
| 117 | - return; | ||
| 118 | - } | ||
| 119 | - } | ||
| 120 | - // #endif | ||
| 121 | - | ||
| 122 | - if (this.imageList.length === 9) { | ||
| 123 | - let isContinue = await this.isFullImg(); | ||
| 124 | - console.log("是否继续?", isContinue); | ||
| 125 | - if (!isContinue) { | ||
| 126 | - return; | ||
| 127 | - } | ||
| 128 | - } | ||
| 129 | - uni.chooseImage({ | ||
| 130 | - sourceType: sourceType[this.sourceTypeIndex], | ||
| 131 | - sizeType: sizeType[this.sizeTypeIndex], | ||
| 132 | - count: this.imageList.length + this.count[this.countIndex] > 9 ? 9 - this.imageList.length : this.count[this.countIndex], | ||
| 133 | - success: (res) => { | ||
| 134 | - this.imageList = this.imageList.concat(res.tempFilePaths); | ||
| 135 | - }, | ||
| 136 | - fail: (err) => { | ||
| 137 | - console.log("err: ",err); | ||
| 138 | - // #ifdef APP-PLUS | ||
| 139 | - if (err['code'] && err.code !== 0 && this.sourceTypeIndex === 2) { | ||
| 140 | - this.checkPermission(err.code); | ||
| 141 | - } | ||
| 142 | - // #endif | ||
| 143 | - // #ifdef MP | ||
| 144 | - if(err.errMsg.indexOf('cancel') !== '-1'){ | ||
| 145 | - return; | ||
| 146 | - } | ||
| 147 | - uni.getSetting({ | ||
| 148 | - success: (res) => { | ||
| 149 | - let authStatus = false; | ||
| 150 | - switch (this.sourceTypeIndex) { | ||
| 151 | - case 0: | ||
| 152 | - authStatus = res.authSetting['scope.camera']; | ||
| 153 | - break; | ||
| 154 | - case 1: | ||
| 155 | - authStatus = res.authSetting['scope.album']; | ||
| 156 | - break; | ||
| 157 | - case 2: | ||
| 158 | - authStatus = res.authSetting['scope.album'] && res.authSetting['scope.camera']; | ||
| 159 | - break; | ||
| 160 | - default: | ||
| 161 | - break; | ||
| 162 | - } | ||
| 163 | - if (!authStatus) { | ||
| 164 | - uni.showModal({ | ||
| 165 | - title: '授权失败', | ||
| 166 | - content: 'Hello uni-app需要从您的相机或相册获取图片，请在设置界面打开相关权限', | ||
| 167 | - success: (res) => { | ||
| 168 | - if (res.confirm) { | ||
| 169 | - uni.openSetting() | ||
| 170 | - } | ||
| 171 | - } | ||
| 172 | - }) | ||
| 173 | - } | ||
| 174 | - } | ||
| 175 | - }) | ||
| 176 | - // #endif | ||
| 177 | - } | ||
| 178 | - }) | ||
| 179 | - }, | ||
| 180 | - isFullImg: function() { | ||
| 181 | - return new Promise((res) => { | ||
| 182 | - uni.showModal({ | ||
| 183 | - content: "已经有9张图片了,是否清空现有图片？", | ||
| 184 | - success: (e) => { | ||
| 185 | - if (e.confirm) { | ||
| 186 | - this.imageList = []; | ||
| 187 | - res(true); | ||
| 188 | - } else { | ||
| 189 | - res(false) | ||
| 190 | - } | ||
| 191 | - }, | ||
| 192 | - fail: () => { | ||
| 193 | - res(false) | ||
| 194 | - } | ||
| 195 | - }) | ||
| 196 | - }) | ||
| 197 | - }, | ||
| 198 | - previewImage: function(e) { | ||
| 199 | - var current = e.target.dataset.src | ||
| 200 | - uni.previewImage({ | ||
| 201 | - current: current, | ||
| 202 | - urls: this.imageList | ||
| 203 | - }) | ||
| 204 | - }, | ||
| 205 | - async checkPermission(code) { | ||
| 206 | - let type = code ? code - 1 : this.sourceTypeIndex; | ||
| 207 | - let status = permision.isIOS ? await permision.requestIOS(sourceType[type][0]) : | ||
| 208 | - await permision.requestAndroid(type === 0 ? 'android.permission.CAMERA' : | ||
| 209 | - 'android.permission.READ_EXTERNAL_STORAGE'); | ||
| 210 | - | ||
| 211 | - if (status === null || status === 1) { | ||
| 212 | - status = 1; | ||
| 213 | - } else { | ||
| 214 | - uni.showModal({ | ||
| 215 | - content: "没有开启权限", | ||
| 216 | - confirmText: "设置", | ||
| 217 | - success: function(res) { | ||
| 218 | - if (res.confirm) { | ||
| 219 | - permision.gotoAppSetting(); | ||
| 220 | - } | ||
| 221 | - } | ||
| 222 | - }) | ||
| 223 | - } | ||
| 224 | - | ||
| 225 | - return status; | ||
| 226 | - } | ||
| 227 | - } | ||
| 228 | - } | ||
| 229 | -</script> | ||
| 230 | - | ||
| 231 | -<style> | ||
| 232 | - .cell-pd { | ||
| 233 | - padding: 22rpx 30rpx; | ||
| 234 | - } | ||
| 235 | - | ||
| 236 | - .list-pd { | ||
| 237 | - margin-top: 50rpx; | ||
| 238 | - } | ||
| 239 | -</style> |
pages/API/inner-audio/inner-audio.vue deleted
| 1 | -<template> | ||
| 2 | - <view class="uni-padding-wrap"> | ||
| 3 | - <page-head title="audio"></page-head> | ||
| 4 | - <view class="uni-common-mt"> | ||
| 5 | - <slider :value="position" :min="0" :max="duration" @changing="onchanging" @change="onchange"></slider> | ||
| 6 | - </view> | ||
| 7 | - <!-- <view class="uni-common-mt play-time-area"> | ||
| 8 | - <text class="current-time">{{currentTime}}</text> | ||
| 9 | - <text class="duration">{{duration}}</text> | ||
| 10 | - </view> --> | ||
| 11 | - <view class="play-button-area"> | ||
| 12 | - <image class="icon-play" :src="playImage" @click="play"></image> | ||
| 13 | - </view> | ||
| 14 | - </view> | ||
| 15 | -</template> | ||
| 16 | -<script> | ||
| 17 | - const audioUrl = 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3' | ||
| 18 | - export default { | ||
| 19 | - data() { | ||
| 20 | - return { | ||
| 21 | - title: "innerAudioContext", | ||
| 22 | - isPlaying: false, | ||
| 23 | - isPlayEnd: false, | ||
| 24 | - currentTime: 0, | ||
| 25 | - duration: 100 | ||
| 26 | - } | ||
| 27 | - }, | ||
| 28 | - computed: { | ||
| 29 | - position() { | ||
| 30 | - return this.isPlayEnd ? 0 : this.currentTime; | ||
| 31 | - }, | ||
| 32 | - playImage() { | ||
| 33 | - return this.isPlaying ? "/static/pause.png" : "/static/play.png" | ||
| 34 | - } | ||
| 35 | - }, | ||
| 36 | - onLoad() { | ||
| 37 | - this._isChanging = false; | ||
| 38 | - this._audioContext = null; | ||
| 39 | - this.createAudio(); | ||
| 40 | - }, | ||
| 41 | - onUnload() { | ||
| 42 | - if (this._audioContext != null && this.isPlaying) { | ||
| 43 | - this.stop(); | ||
| 44 | - } | ||
| 45 | - }, | ||
| 46 | - methods: { | ||
| 47 | - createAudio() { | ||
| 48 | - var innerAudioContext = this._audioContext = uni.createInnerAudioContext(); | ||
| 49 | - innerAudioContext.autoplay = false; | ||
| 50 | - innerAudioContext.src = audioUrl; | ||
| 51 | - innerAudioContext.onPlay(() => { | ||
| 52 | - console.log('开始播放'); | ||
| 53 | - }); | ||
| 54 | - innerAudioContext.onTimeUpdate((e) => { | ||
| 55 | - if (this._isChanging === true) { | ||
| 56 | - return; | ||
| 57 | - } | ||
| 58 | - this.currentTime = innerAudioContext.currentTime || 0; | ||
| 59 | - this.duration = innerAudioContext.duration || 0; | ||
| 60 | - }); | ||
| 61 | - innerAudioContext.onEnded(() => { | ||
| 62 | - this.currentTime = 0; | ||
| 63 | - this.isPlaying = false; | ||
| 64 | - this.isPlayEnd = true; | ||
| 65 | - }); | ||
| 66 | - innerAudioContext.onError((res) => { | ||
| 67 | - this.isPlaying = false; | ||
| 68 | - console.log(res.errMsg); | ||
| 69 | - console.log(res.errCode); | ||
| 70 | - }); | ||
| 71 | - return innerAudioContext; | ||
| 72 | - }, | ||
| 73 | - onchanging() { | ||
| 74 | - this._isChanging = true; | ||
| 75 | - }, | ||
| 76 | - onchange(e) { | ||
| 77 | - console.log(e.detail.value); | ||
| 78 | - console.log(typeof e.detail.value); | ||
| 79 | - this._audioContext.seek(e.detail.value); | ||
| 80 | - this._isChanging = false; | ||
| 81 | - }, | ||
| 82 | - play() { | ||
| 83 | - if (this.isPlaying) { | ||
| 84 | - this.pause(); | ||
| 85 | - return; | ||
| 86 | - } | ||
| 87 | - this.isPlaying = true; | ||
| 88 | - this._audioContext.play(); | ||
| 89 | - this.isPlayEnd = false; | ||
| 90 | - }, | ||
| 91 | - pause() { | ||
| 92 | - this._audioContext.pause(); | ||
| 93 | - this.isPlaying = false; | ||
| 94 | - }, | ||
| 95 | - stop() { | ||
| 96 | - this._audioContext.stop(); | ||
| 97 | - this.isPlaying = false; | ||
| 98 | - } | ||
| 99 | - } | ||
| 100 | - } | ||
| 101 | -</script> | ||
| 102 | -<style> | ||
| 103 | - .play-time-area { | ||
| 104 | - display: flex; | ||
| 105 | - flex-direction: row; | ||
| 106 | - margin-top: 20px; | ||
| 107 | - } | ||
| 108 | - | ||
| 109 | - .duration { | ||
| 110 | - margin-left: auto; | ||
| 111 | - } | ||
| 112 | - | ||
| 113 | - .play-button-area { | ||
| 114 | - display: flex; | ||
| 115 | - flex-direction: row; | ||
| 116 | - justify-content: center; | ||
| 117 | - margin-top: 50px; | ||
| 118 | - } | ||
| 119 | - | ||
| 120 | - .icon-play { | ||
| 121 | - width: 60px; | ||
| 122 | - height: 60px; | ||
| 123 | - } | ||
| 124 | -</style> |
pages/API/intersection-observer/intersection-observer.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-title uni-common-mt"> | ||
| 6 | - {{appear ? '小球出现' : '小球消失'}} | ||
| 7 | - </view> | ||
| 8 | - <scroll-view class="scroll-view" scroll-y> | ||
| 9 | - <view class="scroll-area"> | ||
| 10 | - <text class="notice">向下滚动让小球出现</text> | ||
| 11 | - <view class="ball"></view> | ||
| 12 | - </view> | ||
| 13 | - </scroll-view> | ||
| 14 | - </view> | ||
| 15 | - </view> | ||
| 16 | -</template> | ||
| 17 | -<script> | ||
| 18 | - let observer = null; | ||
| 19 | - export default { | ||
| 20 | - data() { | ||
| 21 | - return { | ||
| 22 | - appear: false, | ||
| 23 | - title:'intersectionObserver' | ||
| 24 | - } | ||
| 25 | - }, | ||
| 26 | - onReady() { | ||
| 27 | - observer = uni.createIntersectionObserver(this); | ||
| 28 | - observer.relativeTo('.scroll-view').observe('.ball', (res) => { | ||
| 29 | - if (res.intersectionRatio > 0 && !this.appear) { | ||
| 30 | - this.appear = true; | ||
| 31 | - } else if (!res.intersectionRatio > 0 && this.appear) { | ||
| 32 | - this.appear = false; | ||
| 33 | - } | ||
| 34 | - }) | ||
| 35 | - }, | ||
| 36 | - onUnload() { | ||
| 37 | - if (observer) { | ||
| 38 | - observer.disconnect() | ||
| 39 | - } | ||
| 40 | - } | ||
| 41 | - } | ||
| 42 | -</script> | ||
| 43 | -<style> | ||
| 44 | - .scroll-view { | ||
| 45 | - height: 400rpx; | ||
| 46 | - background: #fff; | ||
| 47 | - border: 1px solid #ccc; | ||
| 48 | - box-sizing: border-box; | ||
| 49 | - } | ||
| 50 | - | ||
| 51 | - .scroll-area { | ||
| 52 | - height: 1300rpx; | ||
| 53 | - display: flex; | ||
| 54 | - flex-direction: column; | ||
| 55 | - align-items: center; | ||
| 56 | - } | ||
| 57 | - | ||
| 58 | - .notice { | ||
| 59 | - margin-top: 150rpx; | ||
| 60 | - margin: 150rpx 0 400rpx 0; | ||
| 61 | - } | ||
| 62 | - | ||
| 63 | - .ball { | ||
| 64 | - width: 200rpx; | ||
| 65 | - height: 200rpx; | ||
| 66 | - background: #4cd964; | ||
| 67 | - border-radius: 50%; | ||
| 68 | - } | ||
| 69 | -</style> |
pages/API/login/login.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view style="background:#FFF; padding:40rpx;"> | ||
| 6 | - <block v-if="hasLogin === true"> | ||
| 7 | - <view class="uni-h3 uni-center uni-common-mt">已登录 | ||
| 8 | - <text v-if="isUniverifyLogin" style="font-size: 0.8em;"> | ||
| 9 | - <i v-if="!phoneNumber.length" class="uni-icon_toast uni-loading"></i> | ||
| 10 | - <i v-else>（{{phoneNumber}}）</i> | ||
| 11 | - </text> | ||
| 12 | - </view> | ||
| 13 | - <view class="uni-hello-text uni-center"> | ||
| 14 | - <text>每个账号仅需登录 1 次，\n后续每次进入页面即可自动拉取用户信息。</text> | ||
| 15 | - </view> | ||
| 16 | - </block> | ||
| 17 | - <block v-if="hasLogin === false"> | ||
| 18 | - <view class="uni-h3 uni-center uni-common-mt">未登录</view> | ||
| 19 | - <view class="uni-hello-text uni-center"> | ||
| 20 | - 请点击按钮登录 | ||
| 21 | - </view> | ||
| 22 | - </block> | ||
| 23 | - </view> | ||
| 24 | - <view class="uni-btn-v uni- uni-common-mt"> | ||
| 25 | - <!-- #ifdef MP-TOUTIAO --> | ||
| 26 | - <button type="primary" class="page-body-button" v-for="(value,key) in providerList" @click="tologin(value)" :key="key"> | ||
| 27 | - 登录 | ||
| 28 | - </button> | ||
| 29 | - <!-- #endif --> | ||
| 30 | - <!-- #ifndef MP-TOUTIAO --> | ||
| 31 | - <button type="primary" class="page-body-button" v-for="(value,key) in providerList" @click="tologin(value)" | ||
| 32 | - :loading="value.id === 'univerify' ? univerifyBtnLoading : false" :key="key">{{value.name}}</button> | ||
| 33 | - <!-- #endif --> | ||
| 34 | - </view> | ||
| 35 | - </view> | ||
| 36 | - </view> | ||
| 37 | -</template> | ||
| 38 | -<script> | ||
| 39 | - import { | ||
| 40 | - mapState, | ||
| 41 | - mapMutations, | ||
| 42 | - mapActions | ||
| 43 | - } from 'vuex' | ||
| 44 | - const univerifyInfoKey = 'univerifyInfo'; | ||
| 45 | - | ||
| 46 | - export default { | ||
| 47 | - data() { | ||
| 48 | - return { | ||
| 49 | - title: 'login', | ||
| 50 | - providerList: [], | ||
| 51 | - phoneNumber: '', | ||
| 52 | - univerifyBtnLoading: false | ||
| 53 | - } | ||
| 54 | - }, | ||
| 55 | - computed: { | ||
| 56 | - ...mapState(['hasLogin', 'isUniverifyLogin', 'univerifyErrorMsg']) | ||
| 57 | - }, | ||
| 58 | - onLoad() { | ||
| 59 | - uni.getProvider({ | ||
| 60 | - service: 'oauth', | ||
| 61 | - success: (result) => { | ||
| 62 | - this.providerList = result.provider.map((value) => { | ||
| 63 | - let providerName = ''; | ||
| 64 | - switch (value) { | ||
| 65 | - case 'weixin': | ||
| 66 | - providerName = '微信登录' | ||
| 67 | - break; | ||
| 68 | - case 'qq': | ||
| 69 | - providerName = 'QQ登录' | ||
| 70 | - break; | ||
| 71 | - case 'sinaweibo': | ||
| 72 | - providerName = '新浪微博登录' | ||
| 73 | - break; | ||
| 74 | - case 'xiaomi': | ||
| 75 | - providerName = '小米登录' | ||
| 76 | - break; | ||
| 77 | - case 'alipay': | ||
| 78 | - providerName = '支付宝登录' | ||
| 79 | - break; | ||
| 80 | - case 'baidu': | ||
| 81 | - providerName = '百度登录' | ||
| 82 | - break; | ||
| 83 | - case 'jd': | ||
| 84 | - providerName = '京东登录' | ||
| 85 | - break; | ||
| 86 | - case 'toutiao': | ||
| 87 | - providerName = '头条登录' | ||
| 88 | - break; | ||
| 89 | - case 'apple': | ||
| 90 | - providerName = '苹果登录' | ||
| 91 | - break; | ||
| 92 | - case 'univerify': | ||
| 93 | - providerName = '一键登录' | ||
| 94 | - break; | ||
| 95 | - } | ||
| 96 | - return { | ||
| 97 | - name: providerName, | ||
| 98 | - id: value | ||
| 99 | - } | ||
| 100 | - }); | ||
| 101 | - | ||
| 102 | - }, | ||
| 103 | - fail: (error) => { | ||
| 104 | - console.log('获取登录通道失败', error); | ||
| 105 | - } | ||
| 106 | - }); | ||
| 107 | - | ||
| 108 | - if (this.hasLogin && this.isUniverifyLogin) { | ||
| 109 | - this.getPhoneNumber(uni.getStorageSync(univerifyInfoKey)).then((phoneNumber) => { | ||
| 110 | - this.phoneNumber = phoneNumber | ||
| 111 | - }) | ||
| 112 | - } | ||
| 113 | - }, | ||
| 114 | - methods: { | ||
| 115 | - ...mapMutations(['login', 'setUniverifyLogin']), | ||
| 116 | - ...mapActions(['getPhoneNumber']), | ||
| 117 | - Toast(data, duration = 1000) { | ||
| 118 | - uni.showToast(Object.assign({}, data, { | ||
| 119 | - duration | ||
| 120 | - })) | ||
| 121 | - }, | ||
| 122 | - tologin(provider) { | ||
| 123 | - if (provider.id === 'univerify') { | ||
| 124 | - this.univerifyBtnLoading = true; | ||
| 125 | - } | ||
| 126 | - | ||
| 127 | - // 一键登录已在APP onLaunch的时候进行了预登陆，可以显著提高登录速度。登录成功后，预登陆状态会重置 | ||
| 128 | - uni.login({ | ||
| 129 | - provider: provider.id, | ||
| 130 | - // #ifdef MP-ALIPAY | ||
| 131 | - scopes: 'auth_user', //支付宝小程序需设置授权类型 | ||
| 132 | - // #endif | ||
| 133 | - success: async (res) => { | ||
| 134 | - console.log('login success:', res); | ||
| 135 | - this.Toast({ | ||
| 136 | - title: '登录成功' | ||
| 137 | - }) | ||
| 138 | - // 更新保存在 store 中的登录状态 | ||
| 139 | - this.login(provider.id); | ||
| 140 | - | ||
| 141 | - // #ifdef APP-PLUS | ||
| 142 | - this.setUniverifyLogin(provider.id === 'univerify') | ||
| 143 | - switch (provider.id) { | ||
| 144 | - case 'univerify': | ||
| 145 | - this.loginByUniverify(provider.id, res) | ||
| 146 | - break; | ||
| 147 | - case 'apple': | ||
| 148 | - this.loginByApple(provider.id, res) | ||
| 149 | - break; | ||
| 150 | - } | ||
| 151 | - // #endif | ||
| 152 | - | ||
| 153 | - // #ifdef MP-WEIXIN | ||
| 154 | - console.warn('如需获取openid请参考uni-id: https://uniapp.dcloud.net.cn/uniCloud/uni-id') | ||
| 155 | - uni.request({ | ||
| 156 | - url: 'https://97fca9f2-41f6-449f-a35e-3f135d4c3875.bspapp.com/http/user-center', | ||
| 157 | - method: 'POST', | ||
| 158 | - data: { | ||
| 159 | - action: 'loginByWeixin', | ||
| 160 | - params: { | ||
| 161 | - code: res.code, | ||
| 162 | - platform: 'mp-weixin' | ||
| 163 | - } | ||
| 164 | - }, | ||
| 165 | - success(res) { | ||
| 166 | - console.log(res); | ||
| 167 | - if (res.data.code !== 0) { | ||
| 168 | - console.log('获取openid失败：', res.data.errMsg); | ||
| 169 | - return | ||
| 170 | - } | ||
| 171 | - uni.setStorageSync('openid', res.data.openid) | ||
| 172 | - }, | ||
| 173 | - fail(err) { | ||
| 174 | - console.log('获取openid失败：', err); | ||
| 175 | - } | ||
| 176 | - }) | ||
| 177 | - // #endif | ||
| 178 | - }, | ||
| 179 | - fail: (err) => { | ||
| 180 | - console.log('login fail:', err); | ||
| 181 | - | ||
| 182 | - // 一键登录点击其他登录方式 | ||
| 183 | - if (err.code == '30002') { | ||
| 184 | - uni.closeAuthView(); | ||
| 185 | - this.Toast({ | ||
| 186 | - title: '其他登录方式' | ||
| 187 | - }) | ||
| 188 | - return; | ||
| 189 | - } | ||
| 190 | - | ||
| 191 | - // 未开通 | ||
| 192 | - if (err.code == 1000) { | ||
| 193 | - uni.showModal({ | ||
| 194 | - title: '登录失败', | ||
| 195 | - content: `${err.errMsg}\n，错误码：${err.code}`, | ||
| 196 | - confirmText: '开通指南', | ||
| 197 | - cancelText: '确定', | ||
| 198 | - success: (res) => { | ||
| 199 | - if (res.confirm) { | ||
| 200 | - setTimeout(() => { | ||
| 201 | - plus.runtime.openWeb('https://ask.dcloud.net.cn/article/37965') | ||
| 202 | - }, 500) | ||
| 203 | - } | ||
| 204 | - } | ||
| 205 | - }); | ||
| 206 | - return; | ||
| 207 | - } | ||
| 208 | - | ||
| 209 | - // 一键登录预登陆失败 | ||
| 210 | - if (err.code == '30005') { | ||
| 211 | - uni.showModal({ | ||
| 212 | - showCancel: false, | ||
| 213 | - title: '预登录失败', | ||
| 214 | - content: this.univerifyErrorMsg || err.errMsg | ||
| 215 | - }); | ||
| 216 | - return; | ||
| 217 | - } | ||
| 218 | - | ||
| 219 | - // 一键登录用户关闭验证界面 | ||
| 220 | - if (err.code != '30003') { | ||
| 221 | - uni.showModal({ | ||
| 222 | - showCancel: false, | ||
| 223 | - title: '登录失败', | ||
| 224 | - content: JSON.stringify(err) | ||
| 225 | - }); | ||
| 226 | - } | ||
| 227 | - }, | ||
| 228 | - complete: () => { | ||
| 229 | - this.univerifyBtnLoading = false; | ||
| 230 | - } | ||
| 231 | - }); | ||
| 232 | - }, | ||
| 233 | - loginByUniverify(provider, res) { | ||
| 234 | - this.setUniverifyLogin(true); | ||
| 235 | - uni.closeAuthView(); | ||
| 236 | - | ||
| 237 | - const univerifyInfo = { | ||
| 238 | - provider, | ||
| 239 | - ...res.authResult, | ||
| 240 | - } | ||
| 241 | - | ||
| 242 | - this.getPhoneNumber(univerifyInfo).then((phoneNumber) => { | ||
| 243 | - this.phoneNumber = phoneNumber; | ||
| 244 | - uni.setStorageSync(univerifyInfoKey, univerifyInfo) | ||
| 245 | - }).catch(err => { | ||
| 246 | - uni.showModal({ | ||
| 247 | - showCancel: false, | ||
| 248 | - title: '手机号获取失败', | ||
| 249 | - content: `${err.errMsg}\n，错误码：${err.code}` | ||
| 250 | - }) | ||
| 251 | - console.error(res); | ||
| 252 | - }) | ||
| 253 | - }, | ||
| 254 | - async loginByApple(provider, res) { | ||
| 255 | - // 获取用户信息 | ||
| 256 | - let getUserInfoErr, result | ||
| 257 | - // #ifndef VUE3 | ||
| 258 | - [getUserInfoErr, result] = await uni.getUserInfo({ | ||
| 259 | - provider | ||
| 260 | - }); | ||
| 261 | - // #endif | ||
| 262 | - | ||
| 263 | - // #ifdef VUE3 | ||
| 264 | - try { | ||
| 265 | - result = await uni.getUserInfo({ | ||
| 266 | - provider | ||
| 267 | - }); | ||
| 268 | - } catch(e) { | ||
| 269 | - getUserInfoErr = e | ||
| 270 | - } | ||
| 271 | - // #endif | ||
| 272 | - | ||
| 273 | - if (getUserInfoErr) { | ||
| 274 | - let content = getUserInfoErr.errMsg; | ||
| 275 | - if (~content.indexOf('uni.login')) { | ||
| 276 | - content = '请在登录页面完成登录操作'; | ||
| 277 | - } | ||
| 278 | - uni.showModal({ | ||
| 279 | - title: '获取用户信息失败', | ||
| 280 | - content: '错误原因' + content, | ||
| 281 | - showCancel: false | ||
| 282 | - }); | ||
| 283 | - } | ||
| 284 | - // uni-id 苹果登录 | ||
| 285 | - console.warn('此处使用uni-id处理苹果登录，详情参考: https://uniapp.dcloud.net.cn/uniCloud/uni-id') | ||
| 286 | - uni.request({ | ||
| 287 | - url: 'https://97fca9f2-41f6-449f-a35e-3f135d4c3875.bspapp.com/http/user-center', | ||
| 288 | - method: 'POST', | ||
| 289 | - data: { | ||
| 290 | - action: 'loginByApple', | ||
| 291 | - params: result.userInfo | ||
| 292 | - }, | ||
| 293 | - success: (res) => { | ||
| 294 | - console.log('uniId login success', res); | ||
| 295 | - if(res.data.code !== 0){ | ||
| 296 | - uni.showModal({ | ||
| 297 | - showCancel: false, | ||
| 298 | - content: `苹果登录失败: ${JSON.stringify(res.data.msg)}`, | ||
| 299 | - }) | ||
| 300 | - } else { | ||
| 301 | - uni.setStorageSync('openid', res.data.openid) | ||
| 302 | - uni.setStorageSync('apple_nickname', res.data.userInfo.nickname) | ||
| 303 | - } | ||
| 304 | - }, | ||
| 305 | - fail: (e) => { | ||
| 306 | - uni.showModal({ | ||
| 307 | - content: `苹果登录失败: ${JSON.stringify(e)}`, | ||
| 308 | - showCancel: false | ||
| 309 | - }) | ||
| 310 | - } | ||
| 311 | - }) | ||
| 312 | - } | ||
| 313 | - } | ||
| 314 | - } | ||
| 315 | -</script> | ||
| 316 | - | ||
| 317 | -<style> | ||
| 318 | - button { | ||
| 319 | - background-color: #007aff; | ||
| 320 | - color: #ffffff; | ||
| 321 | - } | ||
| 322 | -</style> |
pages/API/make-phone-call/make-phone-call.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-hello-text uni-center">请在下方输入电话号码</view> | ||
| 6 | - <input class="input uni-common-mt" type="number" name="input" @input="bindInput" /> | ||
| 7 | - <view class="uni-btn-v uni-common-mt"> | ||
| 8 | - <button @tap="makePhoneCall" type="primary" :disabled="disabled">拨打</button> | ||
| 9 | - </view> | ||
| 10 | - </view> | ||
| 11 | - </view> | ||
| 12 | -</template> | ||
| 13 | -<script> | ||
| 14 | - export default { | ||
| 15 | - data() { | ||
| 16 | - return { | ||
| 17 | - title: 'makePhoneCall', | ||
| 18 | - disabled: true | ||
| 19 | - } | ||
| 20 | - }, | ||
| 21 | - methods: { | ||
| 22 | - bindInput: function (e) { | ||
| 23 | - this.inputValue = e.detail.value | ||
| 24 | - if (this.inputValue.length > 0) { | ||
| 25 | - this.disabled = false | ||
| 26 | - } else { | ||
| 27 | - this.disabled = true | ||
| 28 | - } | ||
| 29 | - }, | ||
| 30 | - makePhoneCall: function () { | ||
| 31 | - uni.makePhoneCall({ | ||
| 32 | - phoneNumber: this.inputValue, | ||
| 33 | - success: () => { | ||
| 34 | - console.log("成功拨打电话") | ||
| 35 | - } | ||
| 36 | - }) | ||
| 37 | - } | ||
| 38 | - } | ||
| 39 | - } | ||
| 40 | -</script> | ||
| 41 | - | ||
| 42 | -<style> | ||
| 43 | - .input { | ||
| 44 | - height: 119rpx; | ||
| 45 | - line-height: 119rpx; | ||
| 46 | - font-size: 78rpx; | ||
| 47 | - border-bottom: 1rpx solid #E2E2E2; | ||
| 48 | - text-align:center; | ||
| 49 | - } | ||
| 50 | -</style> |
pages/API/map-search/map-search.nvue deleted
| 1 | -<template> | ||
| 2 | - <view class="content"> | ||
| 3 | - <map class="map" ref="dcmap" :markers="markers" @tap="selectPoint"></map> | ||
| 4 | - <scroll-view class="scrollview" scroll-y="true"> | ||
| 5 | - <button class="button" @click="reverseGeocode">reverseGeocode</button> | ||
| 6 | - <button class="button" @click="poiSearchNearBy">poiSearchNearBy</button> | ||
| 7 | - </scroll-view> | ||
| 8 | - </view> | ||
| 9 | -</template> | ||
| 10 | - | ||
| 11 | -<script> | ||
| 12 | - // 116.397477,39.908692 | ||
| 13 | - let mapSearch = weex.requireModule('mapSearch') | ||
| 14 | - export default { | ||
| 15 | - data() { | ||
| 16 | - return { | ||
| 17 | - markers: [{ | ||
| 18 | - id: '1', | ||
| 19 | - latitude: 39.9086920000, | ||
| 20 | - longitude: 116.3974770000, | ||
| 21 | - title: '天安门', | ||
| 22 | - zIndex: '1', | ||
| 23 | - iconPath: '/static/gps.png', | ||
| 24 | - width: 20, | ||
| 25 | - height: 20, | ||
| 26 | - anchor: { | ||
| 27 | - x: 0.5, | ||
| 28 | - y: 1 | ||
| 29 | - }, | ||
| 30 | - callout: { | ||
| 31 | - content: '首都北京\n天安门', | ||
| 32 | - color: '#00BFFF', | ||
| 33 | - fontSize: 12, | ||
| 34 | - borderRadius: 2, | ||
| 35 | - borderWidth: 0, | ||
| 36 | - borderColor: '#333300', | ||
| 37 | - bgColor: '#CCFF11', | ||
| 38 | - padding: '1', | ||
| 39 | - display: 'ALWAYS' | ||
| 40 | - } | ||
| 41 | - }] | ||
| 42 | - } | ||
| 43 | - }, | ||
| 44 | - methods: { | ||
| 45 | - selectPoint(e) { | ||
| 46 | - console.log(e); | ||
| 47 | - }, | ||
| 48 | - reverseGeocode() { | ||
| 49 | - var point = this.markers[0] | ||
| 50 | - mapSearch.reverseGeocode({ | ||
| 51 | - point: { | ||
| 52 | - latitude: point.latitude, | ||
| 53 | - longitude: point.longitude | ||
| 54 | - } | ||
| 55 | - }, ret => { | ||
| 56 | - console.log(JSON.stringify(ret)); | ||
| 57 | - uni.showModal({ | ||
| 58 | - content: JSON.stringify(ret) | ||
| 59 | - }) | ||
| 60 | - }) | ||
| 61 | - }, | ||
| 62 | - poiSearchNearBy() { | ||
| 63 | - var point = this.markers[0] | ||
| 64 | - mapSearch.poiSearchNearBy({ | ||
| 65 | - point: { | ||
| 66 | - latitude: point.latitude, | ||
| 67 | - longitude: point.longitude | ||
| 68 | - }, | ||
| 69 | - key: '停车场', | ||
| 70 | - radius: 1000 | ||
| 71 | - }, ret => { | ||
| 72 | - console.log(ret); | ||
| 73 | - uni.showModal({ | ||
| 74 | - content: JSON.stringify(ret) | ||
| 75 | - }) | ||
| 76 | - }) | ||
| 77 | - | ||
| 78 | - } | ||
| 79 | - } | ||
| 80 | - } | ||
| 81 | -</script> | ||
| 82 | - | ||
| 83 | -<style> | ||
| 84 | - .content { | ||
| 85 | - flex: 1; | ||
| 86 | - } | ||
| 87 | - | ||
| 88 | - .map { | ||
| 89 | - width: 750rpx; | ||
| 90 | - height: 500rpx; | ||
| 91 | - background-color: black; | ||
| 92 | - } | ||
| 93 | - | ||
| 94 | - .scrollview { | ||
| 95 | - flex: 1; | ||
| 96 | - } | ||
| 97 | - | ||
| 98 | - .button { | ||
| 99 | - margin-top: 30rpx; | ||
| 100 | - margin-bottom: 20rpx; | ||
| 101 | - } | ||
| 102 | -</style> |
pages/API/map/map.nvue deleted
| 1 | -<template> | ||
| 2 | - <view class="content"> | ||
| 3 | - <map class="map" id="map1" ref="map1" :controls="controls" :scale="scale" :longitude="location.longitude" | ||
| 4 | - :latitude="location.latitude" :show-location="showLocation" :enable-3D="enable3D" :rotate="rotate" :skew="skew" | ||
| 5 | - :show-compass="showCompass" :enable-overlooking="enableOverlooking" :enable-zoom="enableZoom" | ||
| 6 | - :enable-scroll="enableScroll" :enable-rotate="enableRotate" :enable-satellite="enableSatellite" | ||
| 7 | - :enable-traffic="enableTraffic" :markers="markers" :polyline="polyline" :circles="circles" :polygons="polygons" | ||
| 8 | - :include-points="includePoints" @tap="maptap" @controltap="oncontroltap" @markertap="onmarkertap" | ||
| 9 | - @callouttap="oncallouttap" @poitap="onpoitap" @updated="onupdated" @regionchange="onregionchange"></map> | ||
| 10 | - <scroll-view class="scrollview" scroll-y="true"> | ||
| 11 | - <!-- <view class="list-item"> | ||
| 12 | - <text class="list-text">显示3D楼块</text> | ||
| 13 | - <switch :checked="enable3D" @change="enableThreeD" /> | ||
| 14 | - </view> | ||
| 15 | - <view class="list-item"> | ||
| 16 | - <text class="list-text">显示指南针</text> | ||
| 17 | - <switch :checked="showCompass" @change="changeShowCompass" /> | ||
| 18 | - </view> | ||
| 19 | - <view class="list-item"> | ||
| 20 | - <text class="list-text">开启俯视</text> | ||
| 21 | - <switch :checked="enableOverlooking" @change="changeEnableOverlooking" /> | ||
| 22 | - </view> | ||
| 23 | - <view class="list-item"> | ||
| 24 | - <text class="list-text">是否支持缩放</text> | ||
| 25 | - <switch :checked="enableZoom" @change="changeEnableZoom" /> | ||
| 26 | - </view> | ||
| 27 | - <view class="list-item"> | ||
| 28 | - <text class="list-text">是否支持拖动</text> | ||
| 29 | - <switch :checked="enableScroll" @change="changeEnableScroll" /> | ||
| 30 | - </view> | ||
| 31 | - <view class="list-item"> | ||
| 32 | - <text class="list-text">是否支持旋转</text> | ||
| 33 | - <switch :checked="enableRotate" @change="changeEnableRotate" /> | ||
| 34 | - </view> | ||
| 35 | - <view class="list-item"> | ||
| 36 | - <text class="list-text">是否开启卫星图</text> | ||
| 37 | - <switch :checked="enableSatellite" @change="changeEnableSatellite" /> | ||
| 38 | - </view> | ||
| 39 | - <view class="list-item"> | ||
| 40 | - <text class="list-text">是否开启实时路况</text> | ||
| 41 | - <switch :checked="enableTraffic" @change="changeEnableTraffic" /> | ||
| 42 | - </view> --> | ||
| 43 | - <!-- #ifndef MP-JD --> | ||
| 44 | - <button class="button" @click="changeScale">changeScale</button> | ||
| 45 | - <button class="button" @click="changeRotate">changeRotate</button> | ||
| 46 | - <button class="button" @click="changeSkew">skew</button> | ||
| 47 | - <!-- #endif --> | ||
| 48 | - <button class="button" @click="addMarkers">addMarkers</button> | ||
| 49 | - <button class="button" @click="addPolyline">addPolyline</button> | ||
| 50 | - <!-- #ifndef MP-JD --> | ||
| 51 | - <button class="button" @click="addPolygons">addPolygons</button> | ||
| 52 | - <!-- #endif --> | ||
| 53 | - <button class="button" @click="addCircles">addCircles</button> | ||
| 54 | - <button class="button" @click="includePoint">includePoints</button> | ||
| 55 | - <button class="button" @click="handleGetCenterLocation">getCenterLocation</button> | ||
| 56 | - <button class="button" @click="handleGetRegion">getRegion</button> | ||
| 57 | - <!-- #ifndef MP-JD --> | ||
| 58 | - <button class="button" @click="handleTranslateMarker">translateMarker</button> | ||
| 59 | - <!-- #endif --> | ||
| 60 | - </scroll-view> | ||
| 61 | - </view> | ||
| 62 | -</template> | ||
| 63 | - | ||
| 64 | -<script> | ||
| 65 | - const testMarkers = [{ | ||
| 66 | - id: 0, | ||
| 67 | - latitude: 39.989631, | ||
| 68 | - longitude: 116.481018, | ||
| 69 | - title: '方恒国际 阜通东大街6号', | ||
| 70 | - zIndex: '1', | ||
| 71 | - rotate: 0, | ||
| 72 | - width: 20, | ||
| 73 | - height: 20, | ||
| 74 | - anchor: { | ||
| 75 | - x: 0.5, | ||
| 76 | - y: 1 | ||
| 77 | - }, | ||
| 78 | - callout: { | ||
| 79 | - content: '方恒国际 阜通东大街6号', | ||
| 80 | - color: '#00BFFF', | ||
| 81 | - fontSize: 10, | ||
| 82 | - borderRadius: 4, | ||
| 83 | - borderWidth: 1, | ||
| 84 | - borderColor: '#333300', | ||
| 85 | - bgColor: '#CCFF99', | ||
| 86 | - padding: '5', | ||
| 87 | - display: 'ALWAYS' | ||
| 88 | - } | ||
| 89 | - }, | ||
| 90 | - { | ||
| 91 | - id: 1, | ||
| 92 | - latitude: 39.9086920000, | ||
| 93 | - longitude: 116.3974770000, | ||
| 94 | - title: '天安门', | ||
| 95 | - zIndex: '1', | ||
| 96 | - iconPath: '/static/location.png', | ||
| 97 | - width: 40, | ||
| 98 | - height: 40, | ||
| 99 | - anchor: { | ||
| 100 | - x: 0.5, | ||
| 101 | - y: 1 | ||
| 102 | - }, | ||
| 103 | - callout: { | ||
| 104 | - content: '首都北京\n天安门', | ||
| 105 | - color: '#00BFFF', | ||
| 106 | - fontSize: 12, | ||
| 107 | - borderRadius: 2, | ||
| 108 | - borderWidth: 0, | ||
| 109 | - borderColor: '#333300', | ||
| 110 | - bgColor: '#CCFF11', | ||
| 111 | - padding: '1', | ||
| 112 | - display: 'ALWAYS' | ||
| 113 | - } | ||
| 114 | - } | ||
| 115 | - ]; | ||
| 116 | - const testPolyline = [{ | ||
| 117 | - points: [{ | ||
| 118 | - latitude: 39.925539, | ||
| 119 | - longitude: 116.279037 | ||
| 120 | - }, | ||
| 121 | - { | ||
| 122 | - latitude: 39.925539, | ||
| 123 | - longitude: 116.520285 | ||
| 124 | - } | ||
| 125 | - ], | ||
| 126 | - color: '#FFCCFF', | ||
| 127 | - width: 7, | ||
| 128 | - dottedLine: true, | ||
| 129 | - arrowLine: true, | ||
| 130 | - borderColor: '#000000', | ||
| 131 | - borderWidth: 2 | ||
| 132 | - }, | ||
| 133 | - { | ||
| 134 | - points: [{ | ||
| 135 | - latitude: 39.938698, | ||
| 136 | - longitude: 116.275177 | ||
| 137 | - }, | ||
| 138 | - { | ||
| 139 | - latitude: 39.966069, | ||
| 140 | - longitude: 116.289253 | ||
| 141 | - }, | ||
| 142 | - { | ||
| 143 | - latitude: 39.944226, | ||
| 144 | - longitude: 116.306076 | ||
| 145 | - }, | ||
| 146 | - { | ||
| 147 | - latitude: 39.966069, | ||
| 148 | - longitude: 116.322899 | ||
| 149 | - }, | ||
| 150 | - { | ||
| 151 | - latitude: 39.938698, | ||
| 152 | - longitude: 116.336975 | ||
| 153 | - } | ||
| 154 | - ], | ||
| 155 | - color: '#CCFFFF', | ||
| 156 | - width: 5, | ||
| 157 | - dottedLine: true, | ||
| 158 | - arrowLine: true, | ||
| 159 | - borderColor: '#CC0000', | ||
| 160 | - borderWidth: 3 | ||
| 161 | - } | ||
| 162 | - ]; | ||
| 163 | - const testPolygons = [{ | ||
| 164 | - points: [{ | ||
| 165 | - latitude: 39.781892, | ||
| 166 | - longitude: 116.293413 | ||
| 167 | - }, | ||
| 168 | - { | ||
| 169 | - latitude: 39.787600, | ||
| 170 | - longitude: 116.391842 | ||
| 171 | - }, | ||
| 172 | - { | ||
| 173 | - latitude: 39.733187, | ||
| 174 | - longitude: 116.417932 | ||
| 175 | - }, | ||
| 176 | - { | ||
| 177 | - latitude: 39.704653, | ||
| 178 | - longitude: 116.338255 | ||
| 179 | - } | ||
| 180 | - ], | ||
| 181 | - fillColor: '#FFCCFF', | ||
| 182 | - strokeWidth: 3, | ||
| 183 | - strokeColor: '#CC99CC', | ||
| 184 | - zIndex: 11 | ||
| 185 | - }, | ||
| 186 | - { | ||
| 187 | - points: [{ | ||
| 188 | - latitude: 39.887600, | ||
| 189 | - longitude: 116.518932 | ||
| 190 | - }, | ||
| 191 | - { | ||
| 192 | - latitude: 39.781892, | ||
| 193 | - longitude: 116.518932 | ||
| 194 | - }, | ||
| 195 | - { | ||
| 196 | - latitude: 39.781892, | ||
| 197 | - longitude: 116.428932 | ||
| 198 | - }, | ||
| 199 | - { | ||
| 200 | - latitude: 39.887600, | ||
| 201 | - longitude: 116.428932 | ||
| 202 | - } | ||
| 203 | - ], | ||
| 204 | - fillColor: '#CCFFFF', | ||
| 205 | - strokeWidth: 5, | ||
| 206 | - strokeColor: '#CC0000', | ||
| 207 | - zIndex: 3 | ||
| 208 | - } | ||
| 209 | - ]; | ||
| 210 | - const testCircles = [{ | ||
| 211 | - latitude: 39.996441, | ||
| 212 | - longitude: 116.411146, | ||
| 213 | - radius: 15000, | ||
| 214 | - strokeWidth: 5, | ||
| 215 | - color: '#CCFFFF', | ||
| 216 | - fillColor: '#CC0000' | ||
| 217 | - }, | ||
| 218 | - { | ||
| 219 | - latitude: 40.096441, | ||
| 220 | - longitude: 116.511146, | ||
| 221 | - radius: 12000, | ||
| 222 | - strokeWidth: 3, | ||
| 223 | - color: '#CCFFFF', | ||
| 224 | - fillColor: '#FFCCFF' | ||
| 225 | - }, | ||
| 226 | - { | ||
| 227 | - latitude: 39.896441, | ||
| 228 | - longitude: 116.311146, | ||
| 229 | - radius: 9000, | ||
| 230 | - strokeWidth: 1, | ||
| 231 | - color: '#CCFFFF', | ||
| 232 | - fillColor: '#CC0000' | ||
| 233 | - } | ||
| 234 | - ]; | ||
| 235 | - const testIncludePoints = [{ | ||
| 236 | - latitude: 39.989631, | ||
| 237 | - longitude: 116.481018, | ||
| 238 | - }, | ||
| 239 | - { | ||
| 240 | - latitude: 39.9086920000, | ||
| 241 | - longitude: 116.3974770000, | ||
| 242 | - } | ||
| 243 | - ]; | ||
| 244 | - export default { | ||
| 245 | - data() { | ||
| 246 | - return { | ||
| 247 | - location: { | ||
| 248 | - longitude: 116.3974770000, | ||
| 249 | - latitude: 39.9086920000 | ||
| 250 | - }, | ||
| 251 | - controls: [{ | ||
| 252 | - id: 1, | ||
| 253 | - position: { | ||
| 254 | - left: 5, | ||
| 255 | - top: 180, | ||
| 256 | - width: 30, | ||
| 257 | - height: 30 | ||
| 258 | - }, | ||
| 259 | - iconPath: '/static/logo.png', | ||
| 260 | - clickable: true | ||
| 261 | - }], | ||
| 262 | - showLocation: false, | ||
| 263 | - scale: 13, | ||
| 264 | - showCompass: true, | ||
| 265 | - enable3D: true, | ||
| 266 | - enableOverlooking: true, | ||
| 267 | - enableZoom: true, | ||
| 268 | - enableScroll: true, | ||
| 269 | - enableRotate: true, | ||
| 270 | - enableSatellite: false, | ||
| 271 | - enableTraffic: false, | ||
| 272 | - polyline: [], | ||
| 273 | - markers: [], | ||
| 274 | - polygons: [], | ||
| 275 | - circles: [], | ||
| 276 | - includePoints: [], | ||
| 277 | - rotate: 0, | ||
| 278 | - skew: 0 | ||
| 279 | - } | ||
| 280 | - }, | ||
| 281 | - onLoad() {}, | ||
| 282 | - onReady() { | ||
| 283 | - this.map = uni.createMapContext("map1", this); | ||
| 284 | - }, | ||
| 285 | - methods: { | ||
| 286 | - // #ifndef MP-JD | ||
| 287 | - changeScale() { | ||
| 288 | - this.scale = this.scale == 9 ? 15 : 9; | ||
| 289 | - }, | ||
| 290 | - changeRotate() { | ||
| 291 | - this.rotate = this.rotate == 90 ? 0 : 90; | ||
| 292 | - }, | ||
| 293 | - changeSkew() { | ||
| 294 | - this.skew = this.skew == 30 ? 0 : 30; | ||
| 295 | - }, | ||
| 296 | - // #endif | ||
| 297 | - enableThreeD(e) { | ||
| 298 | - this.enable3D = e.detail.value; | ||
| 299 | - }, | ||
| 300 | - changeShowCompass(e) { | ||
| 301 | - this.showCompass = e.detail.value; | ||
| 302 | - }, | ||
| 303 | - changeEnableOverlooking(e) { | ||
| 304 | - this.enableOverlooking = e.detail.value; | ||
| 305 | - }, | ||
| 306 | - changeEnableZoom(e) { | ||
| 307 | - this.enableZoom = e.detail.value; | ||
| 308 | - }, | ||
| 309 | - changeEnableScroll(e) { | ||
| 310 | - this.enableScroll = e.detail.value; | ||
| 311 | - }, | ||
| 312 | - changeEnableRotate(e) { | ||
| 313 | - this.enableRotate = e.detail.value; | ||
| 314 | - }, | ||
| 315 | - changeEnableSatellite(e) { | ||
| 316 | - this.enableSatellite = e.detail.value; | ||
| 317 | - }, | ||
| 318 | - changeEnableTraffic(e) { | ||
| 319 | - this.enableTraffic = e.detail.value; | ||
| 320 | - }, | ||
| 321 | - addMarkers() { | ||
| 322 | - this.markers = testMarkers; | ||
| 323 | - }, | ||
| 324 | - addPolyline() { | ||
| 325 | - this.polyline = testPolyline; | ||
| 326 | - }, | ||
| 327 | - // #ifndef MP-JD | ||
| 328 | - addPolygons() { | ||
| 329 | - this.polygons = testPolygons; | ||
| 330 | - }, | ||
| 331 | - // #endif | ||
| 332 | - addCircles() { | ||
| 333 | - this.circles = testCircles; | ||
| 334 | - }, | ||
| 335 | - includePoint() { | ||
| 336 | - this.includePoints = testIncludePoints; | ||
| 337 | - }, | ||
| 338 | - handleGetCenterLocation() { | ||
| 339 | - this.map.getCenterLocation({ | ||
| 340 | - success: ret => { | ||
| 341 | - console.log(JSON.stringify(ret)); | ||
| 342 | - uni.showModal({ | ||
| 343 | - content: JSON.stringify(ret) | ||
| 344 | - }) | ||
| 345 | - } | ||
| 346 | - }) | ||
| 347 | - }, | ||
| 348 | - handleGetRegion() { | ||
| 349 | - this.map.getRegion({ | ||
| 350 | - success: ret => { | ||
| 351 | - console.log(JSON.stringify(ret)); | ||
| 352 | - uni.showModal({ | ||
| 353 | - content: JSON.stringify(ret) | ||
| 354 | - }) | ||
| 355 | - } | ||
| 356 | - }) | ||
| 357 | - }, | ||
| 358 | - // #ifndef MP-JD | ||
| 359 | - handleTranslateMarker() { | ||
| 360 | - this.map.translateMarker({ | ||
| 361 | - markerId: 1, | ||
| 362 | - destination: { | ||
| 363 | - latitude: 39.989631, | ||
| 364 | - longitude: 116.481018 | ||
| 365 | - }, | ||
| 366 | - duration: 2000 | ||
| 367 | - }, ret => { | ||
| 368 | - console.log(JSON.stringify(ret)); | ||
| 369 | - uni.showModal({ | ||
| 370 | - content: JSON.stringify(ret) | ||
| 371 | - }) | ||
| 372 | - }); | ||
| 373 | - }, | ||
| 374 | - // #endif | ||
| 375 | - maptap(e) { | ||
| 376 | - uni.showModal({ | ||
| 377 | - content: JSON.stringify(e) | ||
| 378 | - }) | ||
| 379 | - }, | ||
| 380 | - onmarkertap(e) { | ||
| 381 | - uni.showModal({ | ||
| 382 | - content: JSON.stringify(e) | ||
| 383 | - }) | ||
| 384 | - }, | ||
| 385 | - oncontroltap(e) { | ||
| 386 | - uni.showModal({ | ||
| 387 | - content: JSON.stringify(e) | ||
| 388 | - }) | ||
| 389 | - }, | ||
| 390 | - oncallouttap(e) { | ||
| 391 | - uni.showModal({ | ||
| 392 | - content: JSON.stringify(e) | ||
| 393 | - }) | ||
| 394 | - }, | ||
| 395 | - onupdated(e) { | ||
| 396 | - console.log(JSON.stringify(e)) | ||
| 397 | - }, | ||
| 398 | - onregionchange(e) { | ||
| 399 | - console.log(JSON.stringify(e)); | ||
| 400 | - }, | ||
| 401 | - onpoitap(e) { | ||
| 402 | - uni.showModal({ | ||
| 403 | - content: JSON.stringify(e) | ||
| 404 | - }) | ||
| 405 | - } | ||
| 406 | - } | ||
| 407 | - } | ||
| 408 | -</script> | ||
| 409 | - | ||
| 410 | -<style> | ||
| 411 | - .content { | ||
| 412 | - flex: 1; | ||
| 413 | - } | ||
| 414 | - | ||
| 415 | - .map { | ||
| 416 | - width: 750rpx; | ||
| 417 | - /* #ifdef H5 */ | ||
| 418 | - width: 100%; | ||
| 419 | - /* #endif */ | ||
| 420 | - height: 250px; | ||
| 421 | - background-color: #f0f0f0; | ||
| 422 | - } | ||
| 423 | - | ||
| 424 | - .scrollview { | ||
| 425 | - /* #ifdef H5 */ | ||
| 426 | - margin-top: 240px; | ||
| 427 | - /* #endif */ | ||
| 428 | - flex: 1; | ||
| 429 | - padding: 10px; | ||
| 430 | - } | ||
| 431 | - | ||
| 432 | - .list-item { | ||
| 433 | - flex-direction: row; | ||
| 434 | - flex-wrap: nowrap; | ||
| 435 | - align-items: center; | ||
| 436 | - padding: 5px 0px; | ||
| 437 | - } | ||
| 438 | - | ||
| 439 | - .list-text { | ||
| 440 | - flex: 1; | ||
| 441 | - } | ||
| 442 | - | ||
| 443 | - .button { | ||
| 444 | - margin-top: 5px; | ||
| 445 | - margin-bottom: 5px; | ||
| 446 | - } | ||
| 447 | -</style> |
pages/API/modal/modal.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-btn-v"> | ||
| 6 | - <button type="default" @tap="modalTap">有标题的modal</button> | ||
| 7 | - <button type="default" @tap="noTitlemodalTap">无标题的modal</button> | ||
| 8 | - </view> | ||
| 9 | - </view> | ||
| 10 | - </view> | ||
| 11 | -</template> | ||
| 12 | -<script> | ||
| 13 | - | ||
| 14 | - export default { | ||
| 15 | - data() { | ||
| 16 | - return { | ||
| 17 | - title: 'modal', | ||
| 18 | - modalHidden: true, | ||
| 19 | - modalHidden2: true | ||
| 20 | - } | ||
| 21 | - }, | ||
| 22 | - methods: { | ||
| 23 | - modalTap: function (e) { | ||
| 24 | - uni.showModal({ | ||
| 25 | - title: "弹窗标题", | ||
| 26 | - content: "弹窗内容，告知当前状态、信息和解决方法，描述文字尽量控制在三行内", | ||
| 27 | - showCancel: false, | ||
| 28 | - confirmText: "确定" | ||
| 29 | - }) | ||
| 30 | - }, | ||
| 31 | - noTitlemodalTap: function (e) { | ||
| 32 | - uni.showModal({ | ||
| 33 | - content: "弹窗内容，告知当前状态、信息和解决方法，描述文字尽量控制在三行内", | ||
| 34 | - confirmText: "确定", | ||
| 35 | - cancelText: "取消" | ||
| 36 | - }) | ||
| 37 | - } | ||
| 38 | - } | ||
| 39 | - } | ||
| 40 | -</script> | ||
| 41 | \ No newline at end of file | 0 | \ No newline at end of file |
pages/API/navigator/navigator.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-btn-v"> | ||
| 6 | - <button @tap="navigateTo">跳转新页面，并传递数据</button> | ||
| 7 | - <button @tap="navigateBack">返回上一页</button> | ||
| 8 | - <button @tap="redirectTo">在当前页面打开</button> | ||
| 9 | - <button @tap="switchTab">切换到模板选项卡</button> | ||
| 10 | - <button v-if="!hasLeftWin" @tap="reLaunch">关闭所有页面，打开首页</button> | ||
| 11 | - <!-- #ifdef APP-PLUS --> | ||
| 12 | - <button @tap="customAnimation">使用自定义动画打开页面</button> | ||
| 13 | - <!-- #endif --> | ||
| 14 | - <!-- #ifdef APP-PLUS || H5 --> | ||
| 15 | - <button @tap="preloadPage">预载复杂页面</button> | ||
| 16 | - <!-- #endif --> | ||
| 17 | - <!-- #ifdef APP-PLUS --> | ||
| 18 | - <button @tap="unPreloadPage">取消页面预载</button> | ||
| 19 | - <!-- #endif --> | ||
| 20 | - <!-- #ifdef APP-PLUS || H5 --> | ||
| 21 | - <button @tap="navigateToPreloadPage">打开复杂页面</button> | ||
| 22 | - <!-- #endif --> | ||
| 23 | - </view> | ||
| 24 | - </view> | ||
| 25 | - </view> | ||
| 26 | -</template> | ||
| 27 | -<script> | ||
| 28 | - const preloadPageUrl = '/pages/extUI/calendar/calendar' | ||
| 29 | - import { mapState } from 'vuex' | ||
| 30 | - export default { | ||
| 31 | - data() { | ||
| 32 | - return { | ||
| 33 | - title: 'navigate' | ||
| 34 | - } | ||
| 35 | - }, | ||
| 36 | - computed: { | ||
| 37 | - ...mapState({ | ||
| 38 | - hasLeftWin: state => !state.noMatchLeftWindow | ||
| 39 | - }) | ||
| 40 | - }, | ||
| 41 | - methods: { | ||
| 42 | - navigateTo() { | ||
| 43 | - uni.navigateTo({ | ||
| 44 | - url: 'new-page/new-vue-page-1?data=Hello' | ||
| 45 | - }) | ||
| 46 | - }, | ||
| 47 | - navigateBack() { | ||
| 48 | - uni.navigateBack(); | ||
| 49 | - }, | ||
| 50 | - redirectTo() { | ||
| 51 | - uni.redirectTo({ | ||
| 52 | - url: 'new-page/new-vue-page-1' | ||
| 53 | - }); | ||
| 54 | - }, | ||
| 55 | - switchTab() { | ||
| 56 | - uni.switchTab({ | ||
| 57 | - url: '/pages/tabBar/template/template' | ||
| 58 | - }); | ||
| 59 | - }, | ||
| 60 | - reLaunch() { | ||
| 61 | - if (this.hasLeftWin) { | ||
| 62 | - uni.reLaunch({ | ||
| 63 | - url: '/pages/component/view/view' | ||
| 64 | - }); | ||
| 65 | - return; | ||
| 66 | - } | ||
| 67 | - uni.reLaunch({ | ||
| 68 | - url: '/pages/tabBar/component/component' | ||
| 69 | - }); | ||
| 70 | - }, | ||
| 71 | - customAnimation(){ | ||
| 72 | - uni.navigateTo({ | ||
| 73 | - url: 'new-page/new-vue-page-1?data=使用自定义动画打开页面', | ||
| 74 | - animationType: 'slide-in-bottom', | ||
| 75 | - animationDuration: 200 | ||
| 76 | - }) | ||
| 77 | - }, | ||
| 78 | - preloadPage(){ | ||
| 79 | - uni.preloadPage({ | ||
| 80 | - url: preloadPageUrl, | ||
| 81 | - success(){ | ||
| 82 | - uni.showToast({ | ||
| 83 | - title:'页面预载成功' | ||
| 84 | - }) | ||
| 85 | - }, | ||
| 86 | - fail(){ | ||
| 87 | - uni.showToast({ | ||
| 88 | - title:'页面预载失败' | ||
| 89 | - }) | ||
| 90 | - } | ||
| 91 | - }) | ||
| 92 | - }, | ||
| 93 | - unPreloadPage(){ | ||
| 94 | - uni.unPreloadPage({ | ||
| 95 | - url: preloadPageUrl | ||
| 96 | - }) | ||
| 97 | - }, | ||
| 98 | - navigateToPreloadPage(){ | ||
| 99 | - uni.navigateTo({ | ||
| 100 | - url: preloadPageUrl | ||
| 101 | - }) | ||
| 102 | - } | ||
| 103 | - } | ||
| 104 | - } | ||
| 105 | -</script> |
pages/API/navigator/new-page/new-nvue-page-1.nvue deleted
| 1 | -<template> | ||
| 2 | - <view class="root"> | ||
| 3 | - <view class="page-body"> | ||
| 4 | - <view class="new-page__color" @click="setColorIndex(colorIndex>1?0:colorIndex+1)" :style="{backgroundColor:currentColor}"> | ||
| 5 | - <text class="new-page__color-text">点击改变颜色</text> | ||
| 6 | - </view> | ||
| 7 | - <view class="new-page__text-box"> | ||
| 8 | - <text class="new-page__text">点击上方色块使用vuex在页面之间进行通讯</text> | ||
| 9 | - </view> | ||
| 10 | - <view class="new-page__button"> | ||
| 11 | - <button class="new-page__button-item" @click="navToNvue">跳转NVUE页面</button> | ||
| 12 | - <button class="new-page__button-item" @click="navToVue">跳转VUE页面</button> | ||
| 13 | - </view> | ||
| 14 | - </view> | ||
| 15 | - </view> | ||
| 16 | -</template> | ||
| 17 | -<script> | ||
| 18 | - import {mapState,mapGetters,mapMutations} from 'vuex' | ||
| 19 | - export default { | ||
| 20 | - data() { | ||
| 21 | - return { | ||
| 22 | - } | ||
| 23 | - }, | ||
| 24 | - computed:{ | ||
| 25 | - ...mapState(['colorIndex','colorList']), | ||
| 26 | - ...mapGetters(['currentColor']) | ||
| 27 | - }, | ||
| 28 | - methods:{ | ||
| 29 | - ...mapMutations(['setColorIndex']), | ||
| 30 | - navToNvue(){ | ||
| 31 | - uni.navigateTo({ | ||
| 32 | - url:'new-nvue-page-2' | ||
| 33 | - }) | ||
| 34 | - }, | ||
| 35 | - navToVue(){ | ||
| 36 | - uni.navigateTo({ | ||
| 37 | - url:'new-vue-page-2' | ||
| 38 | - }) | ||
| 39 | - } | ||
| 40 | - } | ||
| 41 | - } | ||
| 42 | -</script> | ||
| 43 | -<style> | ||
| 44 | - .new-page__text { | ||
| 45 | - font-size: 14px; | ||
| 46 | - color: #666666; | ||
| 47 | - } | ||
| 48 | - | ||
| 49 | - .root{ | ||
| 50 | - flex-direction: column; | ||
| 51 | - } | ||
| 52 | - | ||
| 53 | - .page-body{ | ||
| 54 | - flex: 1; | ||
| 55 | - flex-direction: column; | ||
| 56 | - justify-content: flex-start; | ||
| 57 | - align-items: center; | ||
| 58 | - padding-top: 50px; | ||
| 59 | - } | ||
| 60 | - | ||
| 61 | - .new-page__text-box{ | ||
| 62 | - padding: 20px; | ||
| 63 | - } | ||
| 64 | - | ||
| 65 | - .new-page__color{ | ||
| 66 | - width: 200px; | ||
| 67 | - height: 100px; | ||
| 68 | - justify-content: center; | ||
| 69 | - align-items: center; | ||
| 70 | - } | ||
| 71 | - | ||
| 72 | - .new-page__color-text{ | ||
| 73 | - font-size: 14px; | ||
| 74 | - color: #FFFFFF; | ||
| 75 | - line-height: 30px; | ||
| 76 | - text-align: center; | ||
| 77 | - } | ||
| 78 | - | ||
| 79 | - .new-page__button-item{ | ||
| 80 | - margin-top: 15px; | ||
| 81 | - width: 300px; | ||
| 82 | - } | ||
| 83 | -</style> |
pages/API/navigator/new-page/new-nvue-page-2.nvue deleted
| 1 | -<template> | ||
| 2 | - <view class="root"> | ||
| 3 | - <view class="page-body"> | ||
| 4 | - <view class="new-page__color" @click="setColorIndex(colorIndex>1?0:colorIndex+1)" :style="{backgroundColor:currentColor}"> | ||
| 5 | - <text class="new-page__color-text">点击改变颜色</text> | ||
| 6 | - </view> | ||
| 7 | - <view class="new-page__text-box"> | ||
| 8 | - <text class="new-page__text">点击上方色块使用vuex在页面之间进行通讯</text> | ||
| 9 | - </view> | ||
| 10 | - </view> | ||
| 11 | - </view> | ||
| 12 | -</template> | ||
| 13 | -<script> | ||
| 14 | - import {mapState,mapGetters,mapMutations} from 'vuex' | ||
| 15 | - export default { | ||
| 16 | - data() { | ||
| 17 | - return { | ||
| 18 | - } | ||
| 19 | - }, | ||
| 20 | - computed:{ | ||
| 21 | - ...mapState(['colorIndex','colorList']), | ||
| 22 | - ...mapGetters(['currentColor']) | ||
| 23 | - }, | ||
| 24 | - methods:{ | ||
| 25 | - ...mapMutations(['setColorIndex']) | ||
| 26 | - } | ||
| 27 | - } | ||
| 28 | -</script> | ||
| 29 | -<style> | ||
| 30 | - .new-page__text { | ||
| 31 | - font-size: 14px; | ||
| 32 | - color: #666666; | ||
| 33 | - } | ||
| 34 | - | ||
| 35 | - .root{ | ||
| 36 | - flex-direction: column; | ||
| 37 | - } | ||
| 38 | - | ||
| 39 | - .page-body{ | ||
| 40 | - flex: 1; | ||
| 41 | - flex-direction: column; | ||
| 42 | - justify-content: flex-start; | ||
| 43 | - align-items: center; | ||
| 44 | - padding-top: 50px; | ||
| 45 | - } | ||
| 46 | - | ||
| 47 | - .new-page__text-box{ | ||
| 48 | - padding: 20px; | ||
| 49 | - } | ||
| 50 | - | ||
| 51 | - .new-page__color{ | ||
| 52 | - width: 200px; | ||
| 53 | - height: 100px; | ||
| 54 | - justify-content: center; | ||
| 55 | - align-items: center; | ||
| 56 | - } | ||
| 57 | - | ||
| 58 | - .new-page__color-text{ | ||
| 59 | - font-size: 14px; | ||
| 60 | - color: #FFFFFF; | ||
| 61 | - line-height: 30px; | ||
| 62 | - text-align: center; | ||
| 63 | - } | ||
| 64 | - | ||
| 65 | - .new-page__button-item{ | ||
| 66 | - margin-top: 15px; | ||
| 67 | - width: 300px; | ||
| 68 | - } | ||
| 69 | -</style> |
pages/API/navigator/new-page/new-vue-page-1.vue deleted
| 1 | -<template> | ||
| 2 | - <view class="root"> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="page-body"> | ||
| 5 | - <view class="new-page__text-box"> | ||
| 6 | - <text class="new-page__text">从上个页面接收到参数：{{data}}</text> | ||
| 7 | - </view> | ||
| 8 | - <view class="new-page__color" @click="setColorIndex(colorIndex>1?0:colorIndex+1)" :style="{backgroundColor:currentColor}"> | ||
| 9 | - <text class="new-page__color-text">点击改变颜色</text> | ||
| 10 | - </view> | ||
| 11 | - <view class="new-page__text-box"> | ||
| 12 | - <text class="new-page__text">点击上方色块使用vuex在页面之间进行通讯</text> | ||
| 13 | - </view> | ||
| 14 | - <view class="new-page__button"> | ||
| 15 | - <!-- #ifndef VUE3--> | ||
| 16 | - <button class="new-page__button-item" @click="navToNvue">跳转NVUE页面</button> | ||
| 17 | - <!-- #endif --> | ||
| 18 | - <button class="new-page__button-item" @click="navToVue">跳转VUE页面</button> | ||
| 19 | - </view> | ||
| 20 | - </view> | ||
| 21 | - </view> | ||
| 22 | -</template> | ||
| 23 | -<script> | ||
| 24 | - import {mapState,mapGetters,mapMutations} from 'vuex' | ||
| 25 | - export default { | ||
| 26 | - data() { | ||
| 27 | - return { | ||
| 28 | - title: '新页面', | ||
| 29 | - data:"" | ||
| 30 | - } | ||
| 31 | - }, | ||
| 32 | - computed:{ | ||
| 33 | - ...mapState(['colorIndex','colorList']), | ||
| 34 | - ...mapGetters(['currentColor']) | ||
| 35 | - }, | ||
| 36 | - onLoad(e){ | ||
| 37 | - if(e.data){ | ||
| 38 | - this.data = e.data; | ||
| 39 | - } | ||
| 40 | - uni.$on('postMsg',(res)=>{ | ||
| 41 | - uni.showModal({ | ||
| 42 | - content: `收到uni.$emit消息:${res.msg}`, | ||
| 43 | - showCancel: false | ||
| 44 | - }) | ||
| 45 | - }) | ||
| 46 | - }, | ||
| 47 | - onUnload() { | ||
| 48 | - uni.$off('postMsg') | ||
| 49 | - }, | ||
| 50 | - methods:{ | ||
| 51 | - ...mapMutations(['setColorIndex']), | ||
| 52 | - navToNvue(){ | ||
| 53 | - uni.navigateTo({ | ||
| 54 | - url:'new-nvue-page-1' | ||
| 55 | - }) | ||
| 56 | - }, | ||
| 57 | - navToVue(){ | ||
| 58 | - uni.navigateTo({ | ||
| 59 | - url:'new-vue-page-2' | ||
| 60 | - }) | ||
| 61 | - } | ||
| 62 | - } | ||
| 63 | - } | ||
| 64 | -</script> | ||
| 65 | -<style> | ||
| 66 | - .new-page__text { | ||
| 67 | - font-size: 14px; | ||
| 68 | - color: #666666; | ||
| 69 | - } | ||
| 70 | - | ||
| 71 | - .root{ | ||
| 72 | - display: flex; | ||
| 73 | - flex: 1; | ||
| 74 | - flex-direction: column; | ||
| 75 | - } | ||
| 76 | - | ||
| 77 | - .page-body{ | ||
| 78 | - /* flex: 1; */ | ||
| 79 | - display: flex; | ||
| 80 | - flex-direction: column; | ||
| 81 | - justify-content: flex-start; | ||
| 82 | - align-items: center; | ||
| 83 | - } | ||
| 84 | - | ||
| 85 | - .new-page__text-box{ | ||
| 86 | - padding: 20px; | ||
| 87 | - } | ||
| 88 | - | ||
| 89 | - .new-page__color{ | ||
| 90 | - display: flex; | ||
| 91 | - width: 200px; | ||
| 92 | - height: 100px; | ||
| 93 | - justify-content: center; | ||
| 94 | - align-items: center; | ||
| 95 | - } | ||
| 96 | - | ||
| 97 | - .new-page__color-text{ | ||
| 98 | - font-size: 14px; | ||
| 99 | - color: #FFFFFF; | ||
| 100 | - line-height: 30px; | ||
| 101 | - text-align: center; | ||
| 102 | - } | ||
| 103 | - | ||
| 104 | - .new-page__button-item{ | ||
| 105 | - margin-top: 15px; | ||
| 106 | - width: 300px; | ||
| 107 | - } | ||
| 108 | -</style> |
pages/API/navigator/new-page/new-vue-page-2.vue deleted
| 1 | -<template> | ||
| 2 | - <view class="root"> | ||
| 3 | - <view class="page-body"> | ||
| 4 | - <view class="new-page__color" @click="setColorIndex(colorIndex>1?0:colorIndex+1)" :style="{backgroundColor:currentColor}"> | ||
| 5 | - <text class="new-page__color-text">点击改变颜色</text> | ||
| 6 | - </view> | ||
| 7 | - <view class="new-page__text-box"> | ||
| 8 | - <text class="new-page__text">点击上方色块使用vuex在页面之间进行通讯</text> | ||
| 9 | - </view> | ||
| 10 | - <view class="new-page__button"> | ||
| 11 | - <button class="new-page__button-item" @click="emitMsg">向上一页面传递数据</button> | ||
| 12 | - </view> | ||
| 13 | - </view> | ||
| 14 | - </view> | ||
| 15 | -</template> | ||
| 16 | -<script> | ||
| 17 | - import { | ||
| 18 | - mapState, | ||
| 19 | - mapGetters, | ||
| 20 | - mapMutations | ||
| 21 | - } from 'vuex' | ||
| 22 | - export default { | ||
| 23 | - data() { | ||
| 24 | - return {} | ||
| 25 | - }, | ||
| 26 | - computed: { | ||
| 27 | - ...mapState(['colorIndex', 'colorList']), | ||
| 28 | - ...mapGetters(['currentColor']) | ||
| 29 | - }, | ||
| 30 | - methods: { | ||
| 31 | - ...mapMutations(['setColorIndex']), | ||
| 32 | - emitMsg() { | ||
| 33 | - uni.$emit('postMsg', { | ||
| 34 | - msg: 'From: Vue Page' | ||
| 35 | - }) | ||
| 36 | - } | ||
| 37 | - } | ||
| 38 | - } | ||
| 39 | -</script> | ||
| 40 | -<style> | ||
| 41 | - .new-page__text { | ||
| 42 | - font-size: 14px; | ||
| 43 | - color: #666666; | ||
| 44 | - } | ||
| 45 | - | ||
| 46 | - .root { | ||
| 47 | - display: flex; | ||
| 48 | - flex: 1; | ||
| 49 | - flex-direction: column; | ||
| 50 | - } | ||
| 51 | - | ||
| 52 | - .page-body { | ||
| 53 | - flex: 1; | ||
| 54 | - display: flex; | ||
| 55 | - flex-direction: column; | ||
| 56 | - justify-content: flex-start; | ||
| 57 | - align-items: center; | ||
| 58 | - padding-top: 50px; | ||
| 59 | - } | ||
| 60 | - | ||
| 61 | - .new-page__text-box { | ||
| 62 | - padding: 20px; | ||
| 63 | - } | ||
| 64 | - | ||
| 65 | - .new-page__color { | ||
| 66 | - display: flex; | ||
| 67 | - width: 200px; | ||
| 68 | - height: 100px; | ||
| 69 | - justify-content: center; | ||
| 70 | - align-items: center; | ||
| 71 | - } | ||
| 72 | - | ||
| 73 | - .new-page__color-text { | ||
| 74 | - font-size: 14px; | ||
| 75 | - color: #FFFFFF; | ||
| 76 | - line-height: 30px; | ||
| 77 | - text-align: center; | ||
| 78 | - } | ||
| 79 | - | ||
| 80 | - .new-page__button-item { | ||
| 81 | - margin-top: 15px; | ||
| 82 | - width: 300px; | ||
| 83 | - } | ||
| 84 | -</style> |
pages/API/on-accelerometer-change/on-accelerometer-change.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <!-- #ifdef APP-PLUS --> | ||
| 6 | - <view class="uni-btn-v"> | ||
| 7 | - <button class="shake" @tap="shake">摇一摇</button> | ||
| 8 | - </view> | ||
| 9 | - <!-- #endif --> | ||
| 10 | - <view class="uni-btn-v"> | ||
| 11 | - <button type="primary" @tap="watchAcce">监听设备的加速度变化</button> | ||
| 12 | - <button type="primary" @tap="stopAcce">停止监听设备的加速度变化</button> | ||
| 13 | - </view> | ||
| 14 | - <view class="uni-textarea uni-common-mt"> | ||
| 15 | - <textarea class="acc-show" :value="value" /> | ||
| 16 | - </view> | ||
| 17 | - </view> | ||
| 18 | - </view> | ||
| 19 | -</template> | ||
| 20 | -<script> | ||
| 21 | - | ||
| 22 | - export default { | ||
| 23 | - data() { | ||
| 24 | - return { | ||
| 25 | - title: 'onAccelerometerChange', | ||
| 26 | - value: '' | ||
| 27 | - } | ||
| 28 | - }, | ||
| 29 | - onUnload() { | ||
| 30 | - uni.stopAccelerometer(); | ||
| 31 | - }, | ||
| 32 | - methods: { | ||
| 33 | - //#ifdef APP-PLUS | ||
| 34 | - shake() { | ||
| 35 | - uni.navigateTo({ | ||
| 36 | - url: '/platforms/app-plus/shake/shake' | ||
| 37 | - }) | ||
| 38 | - }, | ||
| 39 | - //#endif | ||
| 40 | - watchAcce() { | ||
| 41 | - uni.onAccelerometerChange((res) => { | ||
| 42 | - this.value = "监听设备的加速度变化:\n" + "X轴：" + res.x.toFixed(2) + "\nY轴：" + res.y.toFixed(2) + | ||
| 43 | - "\nZ轴：" + res.z.toFixed(2); | ||
| 44 | - }) | ||
| 45 | - }, | ||
| 46 | - stopAcce() { | ||
| 47 | - uni.stopAccelerometer() | ||
| 48 | - } | ||
| 49 | - } | ||
| 50 | - } | ||
| 51 | -</script> | ||
| 52 | - | ||
| 53 | -<style> | ||
| 54 | - .shake { | ||
| 55 | - background-color: #FFCC33; | ||
| 56 | - color: #ffffff; | ||
| 57 | - margin-bottom: 50rpx; | ||
| 58 | - } | ||
| 59 | - .uni-textarea .acc-show{ | ||
| 60 | - height: 240rpx; | ||
| 61 | - } | ||
| 62 | -</style> |
pages/API/on-compass-change/on-compass-change.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-hello-text uni-center" style="padding-bottom:50rpx;"> | ||
| 6 | - 旋转手机即可获取方位信息 | ||
| 7 | - </view> | ||
| 8 | - <view class="direction"> | ||
| 9 | - <view class="bg-compass-line"></view> | ||
| 10 | - <image class="bg-compass" src="../../../static/compass.png" :style="'transform: rotate('+direction+'deg)'"></image> | ||
| 11 | - <view class="direction-value"> | ||
| 12 | - <text>{{direction}}</text> | ||
| 13 | - <text class="direction-degree">o</text> | ||
| 14 | - </view> | ||
| 15 | - </view> | ||
| 16 | - </view> | ||
| 17 | - </view> | ||
| 18 | -</template> | ||
| 19 | -<script> | ||
| 20 | - export default { | ||
| 21 | - data() { | ||
| 22 | - return { | ||
| 23 | - title: 'onCompassChange', | ||
| 24 | - direction: 0 | ||
| 25 | - } | ||
| 26 | - }, | ||
| 27 | - onReady: function () { | ||
| 28 | - uni.onCompassChange((res) => { | ||
| 29 | - this.direction = parseInt(res.direction) | ||
| 30 | - }) | ||
| 31 | - }, | ||
| 32 | - onUnload() { | ||
| 33 | - // #ifndef MP-ALIPAY | ||
| 34 | - uni.stopCompass(); | ||
| 35 | - this.direction = 0; | ||
| 36 | - // #endif | ||
| 37 | - | ||
| 38 | - // #ifdef MP-ALIPAY | ||
| 39 | - uni.offCompassChange(); | ||
| 40 | - // #endif | ||
| 41 | - } | ||
| 42 | - } | ||
| 43 | -</script> | ||
| 44 | - | ||
| 45 | -<style> | ||
| 46 | - .direction { | ||
| 47 | - position: relative; | ||
| 48 | - margin-top: 70rpx; | ||
| 49 | - display: flex; | ||
| 50 | - width: 540rpx; | ||
| 51 | - height: 540rpx; | ||
| 52 | - align-items: center; | ||
| 53 | - justify-content: center; | ||
| 54 | - margin:0 auto; | ||
| 55 | - } | ||
| 56 | - | ||
| 57 | - .direction-value { | ||
| 58 | - position: relative; | ||
| 59 | - font-size: 200rpx; | ||
| 60 | - color: #353535; | ||
| 61 | - line-height: 1; | ||
| 62 | - z-index: 1; | ||
| 63 | - } | ||
| 64 | - | ||
| 65 | - .direction-degree { | ||
| 66 | - position: absolute; | ||
| 67 | - top: 0; | ||
| 68 | - right: -40rpx; | ||
| 69 | - font-size: 60rpx; | ||
| 70 | - } | ||
| 71 | - | ||
| 72 | - .bg-compass { | ||
| 73 | - position: absolute; | ||
| 74 | - top: 0; | ||
| 75 | - left: 0; | ||
| 76 | - width: 540rpx; | ||
| 77 | - height: 540rpx; | ||
| 78 | - transition: .1s; | ||
| 79 | - } | ||
| 80 | - | ||
| 81 | - .bg-compass-line { | ||
| 82 | - position: absolute; | ||
| 83 | - left: 267rpx; | ||
| 84 | - top: -10rpx; | ||
| 85 | - width: 6rpx; | ||
| 86 | - height: 56rpx; | ||
| 87 | - background-color: #1AAD19; | ||
| 88 | - border-radius: 999rpx; | ||
| 89 | - z-index: 1; | ||
| 90 | - } | ||
| 91 | -</style> |
pages/API/open-location/open-location.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-common-mt"> | ||
| 5 | - <form @submit="openLocation"> | ||
| 6 | - <view class="uni-list"> | ||
| 7 | - <view class="uni-list-cell"> | ||
| 8 | - <view class="uni-list-cell-left"> | ||
| 9 | - <view class="uni-label">经度</view> | ||
| 10 | - </view> | ||
| 11 | - <view class="uni-list-cell-db"> | ||
| 12 | - <input class="uni-input" type="text" :disabled="true" value="116.39747" name="longitude"/> | ||
| 13 | - </view> | ||
| 14 | - </view> | ||
| 15 | - <view class="uni-list-cell"> | ||
| 16 | - <view class="uni-list-cell-left"> | ||
| 17 | - <view class="uni-label">纬度</view> | ||
| 18 | - </view> | ||
| 19 | - <view class="uni-list-cell-db"> | ||
| 20 | - <input class="uni-input" type="text" :disabled="true" value="39.9085" name="latitude"/> | ||
| 21 | - </view> | ||
| 22 | - </view> | ||
| 23 | - <view class="uni-list-cell"> | ||
| 24 | - <view class="uni-list-cell-left"> | ||
| 25 | - <view class="uni-label">位置名称</view> | ||
| 26 | - </view> | ||
| 27 | - <view class="uni-list-cell-db"> | ||
| 28 | - <input class="uni-input" type="text" :disabled="true" value="天安门" name="name"/> | ||
| 29 | - </view> | ||
| 30 | - </view> | ||
| 31 | - <view class="uni-list-cell"> | ||
| 32 | - <view class="uni-list-cell-left"> | ||
| 33 | - <view class="uni-label">详细位置</view> | ||
| 34 | - </view> | ||
| 35 | - <view class="uni-list-cell-db"> | ||
| 36 | - <input class="uni-input" type="text" :disabled="true" value="北京市东城区东长安街" name="address"/> | ||
| 37 | - </view> | ||
| 38 | - </view> | ||
| 39 | - </view> | ||
| 40 | - <view class="uni-padding-wrap"> | ||
| 41 | - <view class="uni-btn-v uni-common-mt"> | ||
| 42 | - <button type="primary" formType="submit">查看位置</button> | ||
| 43 | - </view> | ||
| 44 | - </view> | ||
| 45 | - </form> | ||
| 46 | - </view> | ||
| 47 | - </view> | ||
| 48 | -</template> | ||
| 49 | -<script> | ||
| 50 | - export default { | ||
| 51 | - data() { | ||
| 52 | - return { | ||
| 53 | - title: 'openLocation' | ||
| 54 | - } | ||
| 55 | - }, | ||
| 56 | - methods: { | ||
| 57 | - openLocation: function (e) { | ||
| 58 | - console.log(e) | ||
| 59 | - var value = e.detail.value | ||
| 60 | - uni.openLocation({ | ||
| 61 | - longitude: Number(value.longitude), | ||
| 62 | - latitude: Number(value.latitude), | ||
| 63 | - name: value.name, | ||
| 64 | - address: value.address | ||
| 65 | - }) | ||
| 66 | - } | ||
| 67 | - } | ||
| 68 | - } | ||
| 69 | -</script> | ||
| 70 | - | ||
| 71 | -<style> | ||
| 72 | - .uni-list-cell-left { | ||
| 73 | - padding: 0 30rpx; | ||
| 74 | - } | ||
| 75 | -</style> |
pages/API/pull-down-refresh/pull-down-refresh.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view style="font-size: 12px; color: #666;">注：PC 不支持下拉刷新</view> | ||
| 6 | - <view class="text" v-for="(num,index) in data" :key="index">list - {{num}}</view> | ||
| 7 | - <view class="uni-loadmore" v-if="showLoadMore">{{loadMoreText}}</view> | ||
| 8 | - </view> | ||
| 9 | - </view> | ||
| 10 | -</template> | ||
| 11 | -<script> | ||
| 12 | - export default { | ||
| 13 | - data() { | ||
| 14 | - return { | ||
| 15 | - title: '下拉刷新 + 加载更多', | ||
| 16 | - data: [], | ||
| 17 | - loadMoreText: "加载中...", | ||
| 18 | - showLoadMore: false, | ||
| 19 | - max: 0 | ||
| 20 | - } | ||
| 21 | - }, | ||
| 22 | - onLoad() { | ||
| 23 | - this.initData(); | ||
| 24 | - }, | ||
| 25 | - onUnload() { | ||
| 26 | - this.max = 0, | ||
| 27 | - this.data = [], | ||
| 28 | - this.loadMoreText = "加载更多", | ||
| 29 | - this.showLoadMore = false; | ||
| 30 | - }, | ||
| 31 | - onReachBottom() { | ||
| 32 | - console.log("onReachBottom"); | ||
| 33 | - if (this.max > 40) { | ||
| 34 | - this.loadMoreText = "没有更多数据了!" | ||
| 35 | - return; | ||
| 36 | - } | ||
| 37 | - this.showLoadMore = true; | ||
| 38 | - setTimeout(() => { | ||
| 39 | - this.setListData(); | ||
| 40 | - }, 300); | ||
| 41 | - }, | ||
| 42 | - onPullDownRefresh() { | ||
| 43 | - console.log('onPullDownRefresh'); | ||
| 44 | - this.initData(); | ||
| 45 | - }, | ||
| 46 | - methods: { | ||
| 47 | - initData(){ | ||
| 48 | - setTimeout(() => { | ||
| 49 | - this.max = 0; | ||
| 50 | - this.data = []; | ||
| 51 | - let data = []; | ||
| 52 | - this.max += 20; | ||
| 53 | - for (var i = this.max - 19; i < this.max + 1; i++) { | ||
| 54 | - data.push(i) | ||
| 55 | - } | ||
| 56 | - this.data = this.data.concat(data); | ||
| 57 | - uni.stopPullDownRefresh(); | ||
| 58 | - }, 300); | ||
| 59 | - }, | ||
| 60 | - setListData() { | ||
| 61 | - let data = []; | ||
| 62 | - this.max += 10; | ||
| 63 | - for (var i = this.max - 9; i < this.max + 1; i++) { | ||
| 64 | - data.push(i) | ||
| 65 | - } | ||
| 66 | - this.data = this.data.concat(data); | ||
| 67 | - } | ||
| 68 | - } | ||
| 69 | - } | ||
| 70 | -</script> | ||
| 71 | - | ||
| 72 | -<style> | ||
| 73 | - .text { | ||
| 74 | - margin: 16rpx 0; | ||
| 75 | - width:100%; | ||
| 76 | - background-color: #fff; | ||
| 77 | - height: 120rpx; | ||
| 78 | - line-height: 120rpx; | ||
| 79 | - text-align: center; | ||
| 80 | - color: #555; | ||
| 81 | - border-radius: 8rpx; | ||
| 82 | - } | ||
| 83 | -</style> |
pages/API/request-payment/request-payment.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view style="background:#FFF; padding:50rpx 0;"> | ||
| 6 | - <view class="uni-hello-text uni-center"><text>支付金额</text></view> | ||
| 7 | - <view class="uni-h1 uni-center uni-common-mt"> | ||
| 8 | - <text class="rmbLogo">￥</text> | ||
| 9 | - <input class="price" type="digit" :value="price" maxlength="4" @input="priceChange" /> | ||
| 10 | - </view> | ||
| 11 | - </view> | ||
| 12 | - <view class="uni-btn-v uni-common-mt"> | ||
| 13 | - <!-- #ifdef MP-WEIXIN --> | ||
| 14 | - <button type="primary" @click="weixinPay" :loading="loading">微信支付</button> | ||
| 15 | - <!-- #endif --> | ||
| 16 | - <!-- #ifdef APP-PLUS --> | ||
| 17 | - <template v-if="providerList.length > 0"> | ||
| 18 | - <button v-for="(item,index) in providerList" :key="index" @click="requestPayment(item,index)" :loading="item.loading">{{item.name}}支付</button> | ||
| 19 | - </template> | ||
| 20 | - <!-- #endif --> | ||
| 21 | - </view> | ||
| 22 | - </view> | ||
| 23 | - </view> | ||
| 24 | -</template> | ||
| 25 | -<script> | ||
| 26 | - export default { | ||
| 27 | - data() { | ||
| 28 | - return { | ||
| 29 | - title: 'request-payment', | ||
| 30 | - loading: false, | ||
| 31 | - price: 1, | ||
| 32 | - providerList: [] | ||
| 33 | - } | ||
| 34 | - }, | ||
| 35 | - onLoad: function() { | ||
| 36 | - // #ifdef APP-PLUS | ||
| 37 | - uni.getProvider({ | ||
| 38 | - service: "payment", | ||
| 39 | - success: (e) => { | ||
| 40 | - console.log("payment success:" + JSON.stringify(e)); | ||
| 41 | - let providerList = []; | ||
| 42 | - e.provider.map((value) => { | ||
| 43 | - switch (value) { | ||
| 44 | - case 'alipay': | ||
| 45 | - providerList.push({ | ||
| 46 | - name: '支付宝', | ||
| 47 | - id: value, | ||
| 48 | - loading: false | ||
| 49 | - }); | ||
| 50 | - break; | ||
| 51 | - case 'wxpay': | ||
| 52 | - providerList.push({ | ||
| 53 | - name: '微信', | ||
| 54 | - id: value, | ||
| 55 | - loading: false | ||
| 56 | - }); | ||
| 57 | - break; | ||
| 58 | - default: | ||
| 59 | - break; | ||
| 60 | - } | ||
| 61 | - }) | ||
| 62 | - this.providerList = providerList; | ||
| 63 | - }, | ||
| 64 | - fail: (e) => { | ||
| 65 | - console.log("获取支付通道失败：", e); | ||
| 66 | - } | ||
| 67 | - }); | ||
| 68 | - // #endif | ||
| 69 | - }, | ||
| 70 | - methods: { | ||
| 71 | - loginMpWeixin() { | ||
| 72 | - return new Promise((resolve, reject) => { | ||
| 73 | - uni.login({ | ||
| 74 | - provider: 'weixin', | ||
| 75 | - success(res) { | ||
| 76 | - console.warn('此处使用uni-id处理微信小程序登录，详情参考: https://uniapp.dcloud.net.cn/uniCloud/uni-id') | ||
| 77 | - uni.request({ | ||
| 78 | - url: 'https://97fca9f2-41f6-449f-a35e-3f135d4c3875.bspapp.com/http/user-center', | ||
| 79 | - method: 'POST', | ||
| 80 | - data: { | ||
| 81 | - action: 'loginByWeixin', | ||
| 82 | - params: { | ||
| 83 | - code: res.code, | ||
| 84 | - platform: 'mp-weixin' | ||
| 85 | - } | ||
| 86 | - }, | ||
| 87 | - success(res) { | ||
| 88 | - if (res.data.code !== 0) { | ||
| 89 | - reject(new Error('获取openid失败：', res.result.msg)) | ||
| 90 | - return | ||
| 91 | - } | ||
| 92 | - uni.setStorageSync('openid', res.data.openid) | ||
| 93 | - resolve(res.data.openid) | ||
| 94 | - }, | ||
| 95 | - fail(err) { | ||
| 96 | - reject(new Error('获取openid失败：' + err)) | ||
| 97 | - } | ||
| 98 | - }) | ||
| 99 | - }, | ||
| 100 | - fail(err) { | ||
| 101 | - reject(err) | ||
| 102 | - } | ||
| 103 | - }) | ||
| 104 | - }) | ||
| 105 | - }, | ||
| 106 | - async weixinPay() { | ||
| 107 | - let openid = uni.getStorageSync('openid') | ||
| 108 | - console.log("发起支付"); | ||
| 109 | - this.loading = true; | ||
| 110 | - if (!openid) { | ||
| 111 | - try { | ||
| 112 | - openid = await this.loginMpWeixin() | ||
| 113 | - } catch (e) { | ||
| 114 | - console.error(e) | ||
| 115 | - } | ||
| 116 | - | ||
| 117 | - if (!openid) { | ||
| 118 | - uni.showModal({ | ||
| 119 | - content: '获取openid失败', | ||
| 120 | - showCancel: false | ||
| 121 | - }) | ||
| 122 | - this.loading = false | ||
| 123 | - return | ||
| 124 | - } | ||
| 125 | - } | ||
| 126 | - this.openid = openid | ||
| 127 | - let orderInfo = await this.getOrderInfo('wxpay') | ||
| 128 | - if (!orderInfo) { | ||
| 129 | - uni.showModal({ | ||
| 130 | - content: '获取支付信息失败', | ||
| 131 | - showCancel: false | ||
| 132 | - }) | ||
| 133 | - return | ||
| 134 | - } | ||
| 135 | - uni.requestPayment({ | ||
| 136 | - ...orderInfo, | ||
| 137 | - success: (res) => { | ||
| 138 | - uni.showToast({ | ||
| 139 | - title: "感谢您的赞助!" | ||
| 140 | - }) | ||
| 141 | - }, | ||
| 142 | - fail: (res) => { | ||
| 143 | - uni.showModal({ | ||
| 144 | - content: "支付失败,原因为: " + res | ||
| 145 | - .errMsg, | ||
| 146 | - showCancel: false | ||
| 147 | - }) | ||
| 148 | - }, | ||
| 149 | - complete: () => { | ||
| 150 | - this.loading = false; | ||
| 151 | - } | ||
| 152 | - }) | ||
| 153 | - }, | ||
| 154 | - async requestPayment(e, index) { | ||
| 155 | - this.providerList[index].loading = true; | ||
| 156 | - const provider = e.id | ||
| 157 | - let orderInfo = await this.getOrderInfo(provider); | ||
| 158 | - if (!orderInfo) { | ||
| 159 | - uni.showModal({ | ||
| 160 | - content: '获取支付信息失败', | ||
| 161 | - showCancel: false | ||
| 162 | - }) | ||
| 163 | - return | ||
| 164 | - } | ||
| 165 | - console.log('--------orderInfo--------') | ||
| 166 | - console.log(orderInfo); | ||
| 167 | - uni.requestPayment({ | ||
| 168 | - provider, | ||
| 169 | - orderInfo: orderInfo, | ||
| 170 | - success: (e) => { | ||
| 171 | - console.log("success", e); | ||
| 172 | - uni.showToast({ | ||
| 173 | - title: "感谢您的赞助!" | ||
| 174 | - }) | ||
| 175 | - }, | ||
| 176 | - fail: (e) => { | ||
| 177 | - console.log("fail", e); | ||
| 178 | - uni.showModal({ | ||
| 179 | - content: "支付失败,原因为: " + e.errMsg, | ||
| 180 | - showCancel: false | ||
| 181 | - }) | ||
| 182 | - }, | ||
| 183 | - complete: () => { | ||
| 184 | - this.providerList[index].loading = false; | ||
| 185 | - } | ||
| 186 | - }) | ||
| 187 | - }, | ||
| 188 | - getOrderInfo(provider) { | ||
| 189 | - return new Promise((resolve, reject) => { | ||
| 190 | - if (!this.price) { | ||
| 191 | - reject(new Error('请输入金额')) | ||
| 192 | - } | ||
| 193 | - console.warn('此处使用uni-pay处理支付，详情参考: https://uniapp.dcloud.io/uniCloud/unipay') | ||
| 194 | - uni.request({ | ||
| 195 | - method: 'POST', | ||
| 196 | - url: 'https://97fca9f2-41f6-449f-a35e-3f135d4c3875.bspapp.com/http/pay', | ||
| 197 | - data: { | ||
| 198 | - provider, | ||
| 199 | - openid: this.openid, | ||
| 200 | - totalFee: Number(this.price) * 100, // 转为以分为单位 | ||
| 201 | - // #ifdef APP-PLUS | ||
| 202 | - platform: 'app-plus', | ||
| 203 | - // #endif | ||
| 204 | - // #ifdef MP-WEIXIN | ||
| 205 | - platform: 'mp-weixin', | ||
| 206 | - // #endif | ||
| 207 | - }, | ||
| 208 | - success(res) { | ||
| 209 | - if (res.data.code === 0) { | ||
| 210 | - resolve(res.data.orderInfo) | ||
| 211 | - } else { | ||
| 212 | - reject(new Error('获取支付信息失败' + res.data.msg)) | ||
| 213 | - } | ||
| 214 | - }, | ||
| 215 | - fail(err) { | ||
| 216 | - reject(new Error('请求支付接口失败' + err)) | ||
| 217 | - } | ||
| 218 | - }) | ||
| 219 | - }) | ||
| 220 | - }, | ||
| 221 | - priceChange(e) { | ||
| 222 | - console.log(e.detail.value) | ||
| 223 | - this.price = e.detail.value; | ||
| 224 | - } | ||
| 225 | - } | ||
| 226 | - } | ||
| 227 | -</script> | ||
| 228 | - | ||
| 229 | -<style> | ||
| 230 | - .rmbLogo { | ||
| 231 | - font-size: 40rpx; | ||
| 232 | - } | ||
| 233 | - | ||
| 234 | - button { | ||
| 235 | - background-color: #007aff; | ||
| 236 | - color: #ffffff; | ||
| 237 | - } | ||
| 238 | - | ||
| 239 | - .uni-h1.uni-center { | ||
| 240 | - display: flex; | ||
| 241 | - flex-direction: row; | ||
| 242 | - justify-content: center; | ||
| 243 | - align-items: flex-end; | ||
| 244 | - } | ||
| 245 | - | ||
| 246 | - .price { | ||
| 247 | - border-bottom: 1px solid #eee; | ||
| 248 | - width: 200rpx; | ||
| 249 | - height: 80rpx; | ||
| 250 | - padding-bottom: 4rpx; | ||
| 251 | - } | ||
| 252 | - | ||
| 253 | - .ipaPayBtn { | ||
| 254 | - margin-top: 30rpx; | ||
| 255 | - } | ||
| 256 | -</style> |
pages/API/request/request.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-hello-text"> | ||
| 6 | - 请点击按钮向服务器发起请求 | ||
| 7 | - </view> | ||
| 8 | - <view class="uni-textarea uni-common-mt"> | ||
| 9 | - <textarea :value="res"></textarea> | ||
| 10 | - </view> | ||
| 11 | - <view class="uni-btn-v uni-common-mt"> | ||
| 12 | - <button type="primary" @click="sendRequest" :loading="loading">发起请求（Callback）</button> | ||
| 13 | - <button type="primary" @click="sendRequest('promise')" :loading="loading">发起请求（Promise）</button> | ||
| 14 | - <button type="primary" @click="sendRequest('await')" :loading="loading">发起请求（Async/Await）</button> | ||
| 15 | - </view> | ||
| 16 | - </view> | ||
| 17 | - </view> | ||
| 18 | -</template> | ||
| 19 | -<script> | ||
| 20 | - const requestUrl = 'https://unidemo.dcloud.net.cn/ajax/echo/text?name=uni-app' | ||
| 21 | - const duration = 2000 | ||
| 22 | - export default { | ||
| 23 | - data() { | ||
| 24 | - return { | ||
| 25 | - title: 'request', | ||
| 26 | - loading: false, | ||
| 27 | - res: '' | ||
| 28 | - } | ||
| 29 | - }, | ||
| 30 | - methods: { | ||
| 31 | - sendRequest(mode) { | ||
| 32 | - this.loading = true; | ||
| 33 | - switch (mode) { | ||
| 34 | - case 'promise': | ||
| 35 | - this._requestPromise(); | ||
| 36 | - break; | ||
| 37 | - case 'await': | ||
| 38 | - this._requestAwait(); | ||
| 39 | - break; | ||
| 40 | - default: | ||
| 41 | - this._request(); | ||
| 42 | - break; | ||
| 43 | - } | ||
| 44 | - }, | ||
| 45 | - _request() { | ||
| 46 | - uni.request({ | ||
| 47 | - url: requestUrl, | ||
| 48 | - dataType: 'text', | ||
| 49 | - data: { | ||
| 50 | - noncestr: Date.now() | ||
| 51 | - }, | ||
| 52 | - success: (res) => { | ||
| 53 | - console.log('request success', res) | ||
| 54 | - uni.showToast({ | ||
| 55 | - title: '请求成功', | ||
| 56 | - icon: 'success', | ||
| 57 | - mask: true, | ||
| 58 | - duration: duration | ||
| 59 | - }); | ||
| 60 | - this.res = '请求结果 : ' + JSON.stringify(res); | ||
| 61 | - }, | ||
| 62 | - fail: (err) => { | ||
| 63 | - console.log('request fail', err); | ||
| 64 | - uni.showModal({ | ||
| 65 | - content: err.errMsg, | ||
| 66 | - showCancel: false | ||
| 67 | - }); | ||
| 68 | - }, | ||
| 69 | - complete: () => { | ||
| 70 | - this.loading = false; | ||
| 71 | - } | ||
| 72 | - }); | ||
| 73 | - }, | ||
| 74 | - _requestPromise() { | ||
| 75 | - // #ifndef VUE3 | ||
| 76 | - uni.request({ | ||
| 77 | - url: requestUrl, | ||
| 78 | - dataType: 'text', | ||
| 79 | - data: { | ||
| 80 | - noncestr: Date.now() | ||
| 81 | - } | ||
| 82 | - }).then(res => { | ||
| 83 | - console.log('request success', res[1]); | ||
| 84 | - uni.showToast({ | ||
| 85 | - title: '请求成功', | ||
| 86 | - icon: 'success', | ||
| 87 | - mask: true, | ||
| 88 | - duration: duration | ||
| 89 | - }); | ||
| 90 | - this.res = '请求结果 : ' + JSON.stringify(res[1]); | ||
| 91 | - this.loading = false; | ||
| 92 | - }).catch(err => { | ||
| 93 | - console.log('request fail', err); | ||
| 94 | - uni.showModal({ | ||
| 95 | - content: err.errMsg, | ||
| 96 | - showCancel: false | ||
| 97 | - }); | ||
| 98 | - | ||
| 99 | - this.loading = false; | ||
| 100 | - }); | ||
| 101 | - // #endif | ||
| 102 | - | ||
| 103 | - // #ifdef VUE3 | ||
| 104 | - uni.request({ | ||
| 105 | - url: requestUrl, | ||
| 106 | - dataType: 'text', | ||
| 107 | - data: { | ||
| 108 | - noncestr: Date.now() | ||
| 109 | - } | ||
| 110 | - }).then(res => { | ||
| 111 | - console.log('request success', res); | ||
| 112 | - uni.showToast({ | ||
| 113 | - title: '请求成功', | ||
| 114 | - icon: 'success', | ||
| 115 | - mask: true, | ||
| 116 | - duration: duration | ||
| 117 | - }); | ||
| 118 | - this.res = '请求结果 : ' + JSON.stringify(res); | ||
| 119 | - | ||
| 120 | - this.loading = false; | ||
| 121 | - }).catch(err => { | ||
| 122 | - console.log('request fail', err); | ||
| 123 | - uni.showModal({ | ||
| 124 | - content: err.errMsg, | ||
| 125 | - showCancel: false | ||
| 126 | - }); | ||
| 127 | - | ||
| 128 | - this.loading = false; | ||
| 129 | - }); | ||
| 130 | - // #endif | ||
| 131 | - }, | ||
| 132 | - async _requestAwait() { | ||
| 133 | - let res, err | ||
| 134 | - // #ifndef VUE3 | ||
| 135 | - [err, res] = await uni.request({ | ||
| 136 | - url: requestUrl, | ||
| 137 | - dataType: 'text', | ||
| 138 | - data: { | ||
| 139 | - noncestr: Date.now() | ||
| 140 | - } | ||
| 141 | - }); | ||
| 142 | - // #endif | ||
| 143 | - // #ifdef VUE3 | ||
| 144 | - try { | ||
| 145 | - res = await uni.request({ | ||
| 146 | - url: requestUrl, | ||
| 147 | - dataType: 'text', | ||
| 148 | - data: { | ||
| 149 | - noncestr: Date.now() | ||
| 150 | - } | ||
| 151 | - }); | ||
| 152 | - } catch(e){ | ||
| 153 | - err=e | ||
| 154 | - } | ||
| 155 | - // #endif | ||
| 156 | - if (err) { | ||
| 157 | - console.log('request fail', err); | ||
| 158 | - uni.showModal({ | ||
| 159 | - content: err.errMsg, | ||
| 160 | - showCancel: false | ||
| 161 | - }); | ||
| 162 | - } else { | ||
| 163 | - console.log('request success', res) | ||
| 164 | - uni.showToast({ | ||
| 165 | - title: '请求成功', | ||
| 166 | - icon: 'success', | ||
| 167 | - mask: true, | ||
| 168 | - duration: duration | ||
| 169 | - }); | ||
| 170 | - this.res = '请求结果 : ' + JSON.stringify(res); | ||
| 171 | - } | ||
| 172 | - this.loading = false; | ||
| 173 | - } | ||
| 174 | - } | ||
| 175 | - } | ||
| 176 | -</script> |
pages/API/rewarded-video-ad/rewarded-video-ad.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <button v-if="!loadError" :loading="loading" :disabled="loading" type="primary" class="btn" @click="show">显示广告</button> | ||
| 6 | - <button v-if="loadError" :loading="loading" :disabled="loading" type="primary" class="btn" @click="reloadAd">重新加载广告</button> | ||
| 7 | - </view> | ||
| 8 | - <!-- #ifndef APP-PLUS --> | ||
| 9 | - <view class="ad-tips"> | ||
| 10 | - <text>小程序端的广告ID由小程序平台提供</text> | ||
| 11 | - </view> | ||
| 12 | - <!-- #endif --> | ||
| 13 | - </view> | ||
| 14 | -</template> | ||
| 15 | - | ||
| 16 | -<script> | ||
| 17 | - const ERROR_CODE = [-5001, -5002, -5003, -5004, -5005, -5006]; | ||
| 18 | - | ||
| 19 | - export default { | ||
| 20 | - data() { | ||
| 21 | - return { | ||
| 22 | - title: '激励视频广告', | ||
| 23 | - loading: false, | ||
| 24 | - loadError: false | ||
| 25 | - } | ||
| 26 | - }, | ||
| 27 | - onReady() { | ||
| 28 | - // #ifdef APP-PLUS | ||
| 29 | - this.adOption = { | ||
| 30 | - adpid: '1507000689' | ||
| 31 | - }; | ||
| 32 | - // #endif | ||
| 33 | - // #ifdef MP-WEIXIN | ||
| 34 | - this.adOption = { | ||
| 35 | - adUnitId: '' | ||
| 36 | - }; | ||
| 37 | - // #endif | ||
| 38 | - this.createAd(); | ||
| 39 | - }, | ||
| 40 | - methods: { | ||
| 41 | - createAd() { | ||
| 42 | - var rewardedVideoAd = this.rewardedVideoAd = uni.createRewardedVideoAd(this.adOption); | ||
| 43 | - rewardedVideoAd.onLoad(() => { | ||
| 44 | - this.loading = false; | ||
| 45 | - this.loadError = false; | ||
| 46 | - console.log('onLoad event') | ||
| 47 | - }); | ||
| 48 | - rewardedVideoAd.onClose((res) => { | ||
| 49 | - this.loading = true; | ||
| 50 | - // 用户点击了【关闭广告】按钮 | ||
| 51 | - if (res && res.isEnded) { | ||
| 52 | - // 正常播放结束 | ||
| 53 | - console.log("onClose " + res.isEnded); | ||
| 54 | - } else { | ||
| 55 | - // 播放中途退出 | ||
| 56 | - console.log("onClose " + res.isEnded); | ||
| 57 | - } | ||
| 58 | - | ||
| 59 | - setTimeout(() => { | ||
| 60 | - uni.showToast({ | ||
| 61 | - title: "激励视频" + (res.isEnded ? "成功" : "未") + "播放完毕", | ||
| 62 | - duration: 10000, | ||
| 63 | - position: 'bottom' | ||
| 64 | - }) | ||
| 65 | - }, 500) | ||
| 66 | - }); | ||
| 67 | - rewardedVideoAd.onError((err) => { | ||
| 68 | - this.loading = false; | ||
| 69 | - if (err.code && ERROR_CODE.indexOf(err.code) !== -1) { | ||
| 70 | - this.loadError = true; | ||
| 71 | - } | ||
| 72 | - console.log('onError event', err) | ||
| 73 | - }); | ||
| 74 | - this.loading = true; | ||
| 75 | - }, | ||
| 76 | - show() { | ||
| 77 | - const rewardedVideoAd = this.rewardedVideoAd; | ||
| 78 | - rewardedVideoAd.show().catch(() => { | ||
| 79 | - rewardedVideoAd.load() | ||
| 80 | - .then(() => rewardedVideoAd.show()) | ||
| 81 | - .catch(err => { | ||
| 82 | - console.log('激励视频 广告显示失败', err) | ||
| 83 | - uni.showToast({ | ||
| 84 | - title: err.errMsg || err.message, | ||
| 85 | - duration: 5000, | ||
| 86 | - position: 'bottom' | ||
| 87 | - }) | ||
| 88 | - }) | ||
| 89 | - }) | ||
| 90 | - }, | ||
| 91 | - reloadAd() { | ||
| 92 | - this.loading = true; | ||
| 93 | - this.rewardedVideoAd.load(); | ||
| 94 | - } | ||
| 95 | - } | ||
| 96 | - } | ||
| 97 | -</script> | ||
| 98 | - | ||
| 99 | -<style> | ||
| 100 | - .btn { | ||
| 101 | - margin-bottom: 20px; | ||
| 102 | - } | ||
| 103 | - | ||
| 104 | - .ad-tips { | ||
| 105 | - color: #999; | ||
| 106 | - padding: 30px 0; | ||
| 107 | - text-align: center; | ||
| 108 | - } | ||
| 109 | -</style> |
pages/API/save-media/save-media.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view v-if="imagePath !== ''" class="media-box image"> | ||
| 6 | - <image class="image" mode="widthFix" :src="imagePath" /> | ||
| 7 | - </view> | ||
| 8 | - <button type="primary" class="uni-button" @click="saveImage">拍摄图片并保存到本地</button> | ||
| 9 | - <view v-if="videoPath !== ''" class="media-box"> | ||
| 10 | - <video | ||
| 11 | - id="myVideo" | ||
| 12 | - :src="videoPath" | ||
| 13 | - @error="videoErrorCallback" | ||
| 14 | - enable-danmu | ||
| 15 | - danmu-btn | ||
| 16 | - controls | ||
| 17 | - ></video> | ||
| 18 | - </view> | ||
| 19 | - <button type="primary" class="uni-button" @click="saveVideo">录制视频并保存到本地</button> | ||
| 20 | - </view> | ||
| 21 | - </view> | ||
| 22 | -</template> | ||
| 23 | -<script> | ||
| 24 | -export default { | ||
| 25 | - data() { | ||
| 26 | - return { | ||
| 27 | - title: 'saveImage/saveVideo', | ||
| 28 | - imagePath: '', | ||
| 29 | - videoPath: '' | ||
| 30 | - }; | ||
| 31 | - }, | ||
| 32 | - onLoad() {}, | ||
| 33 | - methods: { | ||
| 34 | - videoErrorCallback: function() { | ||
| 35 | - uni.showModal({ | ||
| 36 | - content: '视频加载失败', | ||
| 37 | - showCancel: false | ||
| 38 | - }); | ||
| 39 | - }, | ||
| 40 | - saveImage() { | ||
| 41 | - uni.chooseImage({ | ||
| 42 | - count: 1, | ||
| 43 | - sourceType: ['camera'], | ||
| 44 | - success: res => { | ||
| 45 | - this.imagePath = res.tempFilePaths[0]; | ||
| 46 | - this.getTempFilePath(res.tempFilePaths[0], 'imageTempPath'); | ||
| 47 | - }, | ||
| 48 | - fail: (err) => { | ||
| 49 | - // #ifdef MP | ||
| 50 | - uni.getSetting({ | ||
| 51 | - success: (res) => { | ||
| 52 | - let authStatus = res.authSetting['scope.camera']; | ||
| 53 | - if (!authStatus) { | ||
| 54 | - uni.showModal({ | ||
| 55 | - title: '授权失败', | ||
| 56 | - content: 'Hello uni-app需要从您的相机获取图片，请在设置界面打开相关权限', | ||
| 57 | - success: (res) => { | ||
| 58 | - if (res.confirm) { | ||
| 59 | - uni.openSetting() | ||
| 60 | - } | ||
| 61 | - } | ||
| 62 | - }) | ||
| 63 | - } | ||
| 64 | - } | ||
| 65 | - }) | ||
| 66 | - // #endif | ||
| 67 | - } | ||
| 68 | - }); | ||
| 69 | - }, | ||
| 70 | - saveVideo() { | ||
| 71 | - let _this = this; | ||
| 72 | - uni.chooseVideo({ | ||
| 73 | - count: 1, | ||
| 74 | - sourceType: ['camera'], | ||
| 75 | - success: res => { | ||
| 76 | - console.log(res.tempFilePath) | ||
| 77 | - this.videoPath = res.tempFilePath; | ||
| 78 | - this.getTempFilePath(res.tempFilePath, 'videoTempPath'); | ||
| 79 | - }, | ||
| 80 | - fail: (err) => { | ||
| 81 | - // #ifdef MP | ||
| 82 | - uni.getSetting({ | ||
| 83 | - success: (res) => { | ||
| 84 | - let authStatus = res.authSetting['scope.camera']; | ||
| 85 | - if (!authStatus) { | ||
| 86 | - uni.showModal({ | ||
| 87 | - title: '授权失败', | ||
| 88 | - content: 'Hello uni-app需要从您的相机获取视频，请在设置界面打开相关权限', | ||
| 89 | - success: (res) => { | ||
| 90 | - if (res.confirm) { | ||
| 91 | - uni.openSetting() | ||
| 92 | - } | ||
| 93 | - } | ||
| 94 | - }) | ||
| 95 | - } | ||
| 96 | - } | ||
| 97 | - }) | ||
| 98 | - // #endif | ||
| 99 | - } | ||
| 100 | - }); | ||
| 101 | - }, | ||
| 102 | - | ||
| 103 | - getTempFilePath(url, types) { | ||
| 104 | - // 如果已经下载本地路径，那么直接储存 | ||
| 105 | - let obj = { | ||
| 106 | - filePath: url, | ||
| 107 | - success: () => { | ||
| 108 | - console.log('save success'); | ||
| 109 | - uni.showModal({ | ||
| 110 | - content: '保存成功', | ||
| 111 | - showCancel: false | ||
| 112 | - }); | ||
| 113 | - uni.hideLoading(); | ||
| 114 | - }, | ||
| 115 | - fail: e => { | ||
| 116 | - uni.hideLoading(); | ||
| 117 | - uni.showModal({ | ||
| 118 | - content: '保存失败', | ||
| 119 | - showCancel: false | ||
| 120 | - }); | ||
| 121 | - } | ||
| 122 | - }; | ||
| 123 | - uni.showLoading({ | ||
| 124 | - title: '保存中...' | ||
| 125 | - }); | ||
| 126 | - if (types === 'videoTempPath') { | ||
| 127 | - uni.saveVideoToPhotosAlbum(obj); | ||
| 128 | - } else { | ||
| 129 | - uni.saveImageToPhotosAlbum(obj); | ||
| 130 | - } | ||
| 131 | - } | ||
| 132 | - } | ||
| 133 | -}; | ||
| 134 | -</script> | ||
| 135 | - | ||
| 136 | -<style> | ||
| 137 | -.media-box { | ||
| 138 | - display: flex; | ||
| 139 | - justify-content: center; | ||
| 140 | - align-items: center; | ||
| 141 | - margin: 30rpx 0; | ||
| 142 | - width: 100%; | ||
| 143 | -} | ||
| 144 | -.image { | ||
| 145 | - height: 400rpx; | ||
| 146 | - overflow: hidden; | ||
| 147 | -} | ||
| 148 | -.image image { | ||
| 149 | - width: 100%; | ||
| 150 | - height: 100%; | ||
| 151 | -} | ||
| 152 | -video { | ||
| 153 | - width: 100%; | ||
| 154 | -} | ||
| 155 | -.uni-button { | ||
| 156 | - margin: 30rpx 0; | ||
| 157 | -} | ||
| 158 | -</style> |
pages/API/scan-code/scan-code.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-title">扫码结果：</view> | ||
| 6 | - <view class="uni-list" v-if="result"> | ||
| 7 | - <view class="uni-cell"> | ||
| 8 | - <view class="scan-result"> | ||
| 9 | - {{result}} | ||
| 10 | - </view> | ||
| 11 | - </view> | ||
| 12 | - </view> | ||
| 13 | - <view class="uni-btn-v"> | ||
| 14 | - <button type="primary" @click="scan">扫一扫</button> | ||
| 15 | - </view> | ||
| 16 | - </view> | ||
| 17 | - </view> | ||
| 18 | -</template> | ||
| 19 | -<script> | ||
| 20 | - import permision from "@/common/permission.js" | ||
| 21 | - export default { | ||
| 22 | - data() { | ||
| 23 | - return { | ||
| 24 | - title: 'scanCode', | ||
| 25 | - result: '' | ||
| 26 | - } | ||
| 27 | - }, | ||
| 28 | - methods: { | ||
| 29 | - async scan() { | ||
| 30 | - // #ifdef APP-PLUS | ||
| 31 | - let status = await this.checkPermission(); | ||
| 32 | - if (status !== 1) { | ||
| 33 | - return; | ||
| 34 | - } | ||
| 35 | - // #endif | ||
| 36 | - uni.scanCode({ | ||
| 37 | - success: (res) => { | ||
| 38 | - this.result = res.result | ||
| 39 | - }, | ||
| 40 | - fail: (err) => { | ||
| 41 | - // 需要注意的是小程序扫码不需要申请相机权限 | ||
| 42 | - } | ||
| 43 | - }); | ||
| 44 | - } | ||
| 45 | - // #ifdef APP-PLUS | ||
| 46 | - , | ||
| 47 | - async checkPermission(code) { | ||
| 48 | - let status = permision.isIOS ? await permision.requestIOS('camera') : | ||
| 49 | - await permision.requestAndroid('android.permission.CAMERA'); | ||
| 50 | - | ||
| 51 | - if (status === null || status === 1) { | ||
| 52 | - status = 1; | ||
| 53 | - } else { | ||
| 54 | - uni.showModal({ | ||
| 55 | - content: "需要相机权限", | ||
| 56 | - confirmText: "设置", | ||
| 57 | - success: function(res) { | ||
| 58 | - if (res.confirm) { | ||
| 59 | - permision.gotoAppSetting(); | ||
| 60 | - } | ||
| 61 | - } | ||
| 62 | - }) | ||
| 63 | - } | ||
| 64 | - return status; | ||
| 65 | - } | ||
| 66 | - // #endif | ||
| 67 | - } | ||
| 68 | - } | ||
| 69 | -</script> | ||
| 70 | - | ||
| 71 | -<style> | ||
| 72 | - .scan-result { | ||
| 73 | - min-height: 50rpx; | ||
| 74 | - line-height: 50rpx; | ||
| 75 | - } | ||
| 76 | -</style> |
pages/API/set-navigation-bar-title/set-navigation-bar-title.test.js deleted
| 1 | - | ||
| 2 | -describe('pages/API/set-navigation-bar-title/set-navigation-bar-title.vue', () => { | ||
| 3 | - let page | ||
| 4 | - beforeAll(async () => { | ||
| 5 | - // 重新reLaunch至首页，并获取首页page对象（其中 program 是uni-automator自动注入的全局对象） | ||
| 6 | - page = await program.reLaunch('/pages/API/set-navigation-bar-title/set-navigation-bar-title') | ||
| 7 | - | ||
| 8 | - if (process.env.UNI_PLATFORM === "mp-weixin") { | ||
| 9 | - await page.waitFor(10000) | ||
| 10 | - } else { | ||
| 11 | - await page.waitFor(5000) | ||
| 12 | - } | ||
| 13 | - | ||
| 14 | - page = await program.currentPage() | ||
| 15 | - | ||
| 16 | - }) | ||
| 17 | - | ||
| 18 | - it('set-navigation-bar-title 组件标题', async () => { | ||
| 19 | - let view = await page.$('.common-page-head-title') | ||
| 20 | - expect(await view.text()).toBe('nav-default') | ||
| 21 | - }) | ||
| 22 | -}) |
pages/API/set-navigation-bar-title/set-navigation-bar-title.vue deleted
| 1 | -<template> | ||
| 2 | - <view class="page"> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-helllo-text"> | ||
| 6 | - 本页标题栏是uni-app的默认配置，开发者可在pages.json里配置文字内容及标题颜色，也可通过api接口将其改变。 | ||
| 7 | - </view> | ||
| 8 | - <view class="uni-btn-v"> | ||
| 9 | - <button type="default" @click="setText">改变标题栏文字</button> | ||
| 10 | - <button type="primary" @click="setBg">改变标题栏颜色</button> | ||
| 11 | - </view> | ||
| 12 | - </view> | ||
| 13 | - </view> | ||
| 14 | -</template> | ||
| 15 | - | ||
| 16 | -<script> | ||
| 17 | - export default { | ||
| 18 | - data() { | ||
| 19 | - return { | ||
| 20 | - title: 'nav-default', | ||
| 21 | - hasSetText:false, | ||
| 22 | - hasSetBg:false | ||
| 23 | - } | ||
| 24 | - }, | ||
| 25 | - methods: { | ||
| 26 | - setText() { | ||
| 27 | - this.hasSetText = !this.hasSetText; | ||
| 28 | - uni.setNavigationBarTitle({ | ||
| 29 | - title: this.hasSetText ? "Hello uni-app" : "默认导航栏" | ||
| 30 | - }) | ||
| 31 | - }, | ||
| 32 | - setBg() { | ||
| 33 | - this.hasSetBg = !this.hasSetBg; | ||
| 34 | - uni.setNavigationBarColor({ | ||
| 35 | - frontColor: this.hasSetBg ? "#000000" : "#ffffff", | ||
| 36 | - backgroundColor: this.hasSetBg ? "#F8F8F8" : "#007AFF" | ||
| 37 | - }) | ||
| 38 | - } | ||
| 39 | - } | ||
| 40 | - } | ||
| 41 | -</script> | ||
| 42 | - | ||
| 43 | -<style> | ||
| 44 | -</style> |
pages/API/share/share.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-title">分享内容</view> | ||
| 6 | - <view class="uni-textarea"> | ||
| 7 | - <textarea class="textarea" v-model="shareText" /> | ||
| 8 | - </view> | ||
| 9 | - <view class="uni-title">分享图片：</view> | ||
| 10 | - <view class="uni-uploader" style="padding:15rpx; background:#FFF;"> | ||
| 11 | - <view class="uni-uploader__input-box" v-if="!image" @tap="chooseImage"></view> | ||
| 12 | - <image class="uni-uploader__img" v-if="image" :src="image"></image> | ||
| 13 | - </view> | ||
| 14 | - <!-- #ifdef APP-PLUS --> | ||
| 15 | - <view class="uni-title">分享类型：</view> | ||
| 16 | - <view> | ||
| 17 | - <radio-group @change="radioChange"> | ||
| 18 | - <label class="radio"> | ||
| 19 | - <radio value="1" checked="true"/>文字 | ||
| 20 | - </label> | ||
| 21 | - <label class="radio"> | ||
| 22 | - <radio value="2" />图片 | ||
| 23 | - </label> | ||
| 24 | - <label class="radio"> | ||
| 25 | - <radio value="0" />图文 | ||
| 26 | - </label> | ||
| 27 | - <label class="radio"> | ||
| 28 | - <radio value="5" />小程序 | ||
| 29 | - </label> | ||
| 30 | - </radio-group> | ||
| 31 | - </view> | ||
| 32 | - <view class="uni-btn-v uni-common-mt" v-if="providerList.length > 0"> | ||
| 33 | - <block v-for="(value,index) in providerList" :key="index"> | ||
| 34 | - <button type="primary" v-if="value" :disabled="isDisableButton(value)" @tap="share(value)">{{value.name}}</button> | ||
| 35 | - </block> | ||
| 36 | - </view> | ||
| 37 | - <!-- #endif --> | ||
| 38 | - <!-- #ifdef MP || QUICKAPP-WEBVIEW --> | ||
| 39 | - <view class="uni-btn-v uni-common-mt"> | ||
| 40 | - <button type="primary" open-type="share">分享</button> | ||
| 41 | - </view> | ||
| 42 | - <!-- #endif --> | ||
| 43 | - </view> | ||
| 44 | - </view> | ||
| 45 | -</template> | ||
| 46 | -<script> | ||
| 47 | - export default { | ||
| 48 | - data() { | ||
| 49 | - return { | ||
| 50 | - title: 'share', | ||
| 51 | - shareText: 'uni-app可以同时发布成原生App、小程序、H5，邀请你一起体验！', | ||
| 52 | - href:"https://uniapp.dcloud.io", | ||
| 53 | - image: '', | ||
| 54 | - shareType:1, | ||
| 55 | - providerList: [] | ||
| 56 | - } | ||
| 57 | - }, | ||
| 58 | - computed:{ | ||
| 59 | - isDisableButton() { | ||
| 60 | - return function(item) { | ||
| 61 | - if(this.shareType === 0 && item.id === 'qq'){ | ||
| 62 | - return true; | ||
| 63 | - } | ||
| 64 | - if(this.shareType === 5 && item.name !== '分享到微信好友'){ | ||
| 65 | - return true; | ||
| 66 | - } | ||
| 67 | - return false; | ||
| 68 | - } | ||
| 69 | - } | ||
| 70 | - }, | ||
| 71 | - onShareAppMessage() { | ||
| 72 | - return { | ||
| 73 | - title: this.shareText ? this.shareText : "欢迎体验uni-app", | ||
| 74 | - path: '/pages/tabBar/component/component', | ||
| 75 | - imageUrl:this.image ? this.image : 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/b6304f00-5168-11eb-bd01-97bc1429a9ff.png' | ||
| 76 | - } | ||
| 77 | - }, | ||
| 78 | - onUnload:function(){ | ||
| 79 | - this.shareText='uni-app可以同时发布成原生App、小程序、H5，邀请你一起体验！', | ||
| 80 | - this.href = 'https://uniapp.dcloud.io', | ||
| 81 | - this.image=''; | ||
| 82 | - }, | ||
| 83 | - onLoad: function () { | ||
| 84 | - uni.getProvider({ | ||
| 85 | - service: 'share', | ||
| 86 | - success: (e) => { | ||
| 87 | - console.log('success', e); | ||
| 88 | - let data = [] | ||
| 89 | - for (let i = 0; i < e.provider.length; i++) { | ||
| 90 | - switch (e.provider[i]) { | ||
| 91 | - case 'weixin': | ||
| 92 | - data.push({ | ||
| 93 | - name: '分享到微信好友', | ||
| 94 | - id: 'weixin', | ||
| 95 | - sort:0 | ||
| 96 | - }) | ||
| 97 | - data.push({ | ||
| 98 | - name: '分享到微信朋友圈', | ||
| 99 | - id: 'weixin', | ||
| 100 | - type:'WXSenceTimeline', | ||
| 101 | - sort:1 | ||
| 102 | - }) | ||
| 103 | - break; | ||
| 104 | - case 'sinaweibo': | ||
| 105 | - data.push({ | ||
| 106 | - name: '分享到新浪微博', | ||
| 107 | - id: 'sinaweibo', | ||
| 108 | - sort:2 | ||
| 109 | - }) | ||
| 110 | - break; | ||
| 111 | - case 'qq': | ||
| 112 | - data.push({ | ||
| 113 | - name: '分享到QQ', | ||
| 114 | - id: 'qq', | ||
| 115 | - sort:3 | ||
| 116 | - }) | ||
| 117 | - break; | ||
| 118 | - default: | ||
| 119 | - break; | ||
| 120 | - } | ||
| 121 | - } | ||
| 122 | - this.providerList = data.sort((x,y) => { | ||
| 123 | - return x.sort - y.sort | ||
| 124 | - }); | ||
| 125 | - }, | ||
| 126 | - fail: (e) => { | ||
| 127 | - console.log('获取分享通道失败', e); | ||
| 128 | - uni.showModal({ | ||
| 129 | - content:'获取分享通道失败', | ||
| 130 | - showCancel:false | ||
| 131 | - }) | ||
| 132 | - } | ||
| 133 | - }); | ||
| 134 | - }, | ||
| 135 | - methods: { | ||
| 136 | - async share(e) { | ||
| 137 | - console.log('分享通道:'+ e.id +'； 分享类型:' + this.shareType); | ||
| 138 | - | ||
| 139 | - if(!this.shareText && (this.shareType === 1 || this.shareType === 0)){ | ||
| 140 | - uni.showModal({ | ||
| 141 | - content:'分享内容不能为空', | ||
| 142 | - showCancel:false | ||
| 143 | - }) | ||
| 144 | - return; | ||
| 145 | - } | ||
| 146 | - | ||
| 147 | - if(!this.image && (this.shareType === 2 || this.shareType === 0)){ | ||
| 148 | - uni.showModal({ | ||
| 149 | - content:'分享图片不能为空', | ||
| 150 | - showCancel:false | ||
| 151 | - }) | ||
| 152 | - return; | ||
| 153 | - } | ||
| 154 | - | ||
| 155 | - let shareOPtions = { | ||
| 156 | - provider: e.id, | ||
| 157 | - scene: e.type && e.type === 'WXSenceTimeline' ? 'WXSenceTimeline' : 'WXSceneSession', //WXSceneSession”分享到聊天界面，“WXSenceTimeline”分享到朋友圈，“WXSceneFavorite”分享到微信收藏 | ||
| 158 | - type: this.shareType, | ||
| 159 | - success: (e) => { | ||
| 160 | - console.log('success', e); | ||
| 161 | - uni.showModal({ | ||
| 162 | - content: '已分享', | ||
| 163 | - showCancel:false | ||
| 164 | - }) | ||
| 165 | - }, | ||
| 166 | - fail: (e) => { | ||
| 167 | - console.log('fail', e) | ||
| 168 | - uni.showModal({ | ||
| 169 | - content: e.errMsg, | ||
| 170 | - showCancel:false | ||
| 171 | - }) | ||
| 172 | - }, | ||
| 173 | - complete:function(){ | ||
| 174 | - console.log('分享操作结束!') | ||
| 175 | - } | ||
| 176 | - } | ||
| 177 | - | ||
| 178 | - switch (this.shareType){ | ||
| 179 | - case 0: | ||
| 180 | - shareOPtions.summary = this.shareText; | ||
| 181 | - shareOPtions.imageUrl = this.image; | ||
| 182 | - shareOPtions.title = '欢迎体验uniapp'; | ||
| 183 | - shareOPtions.href = 'https://uniapp.dcloud.io'; | ||
| 184 | - break; | ||
| 185 | - case 1: | ||
| 186 | - shareOPtions.summary = this.shareText; | ||
| 187 | - break; | ||
| 188 | - case 2: | ||
| 189 | - shareOPtions.imageUrl = this.image; | ||
| 190 | - break; | ||
| 191 | - case 5: | ||
| 192 | - shareOPtions.imageUrl = this.image ? this.image : 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/b6304f00-5168-11eb-bd01-97bc1429a9ff.png' | ||
| 193 | - shareOPtions.title = '欢迎体验uniapp'; | ||
| 194 | - shareOPtions.miniProgram = { | ||
| 195 | - id:'gh_33446d7f7a26', | ||
| 196 | - path:'/pages/tabBar/component/component', | ||
| 197 | - webUrl:'https://uniapp.dcloud.io', | ||
| 198 | - type:0 | ||
| 199 | - }; | ||
| 200 | - break; | ||
| 201 | - default: | ||
| 202 | - break; | ||
| 203 | - } | ||
| 204 | - | ||
| 205 | - if(shareOPtions.type === 0 && plus.os.name === 'iOS'){//如果是图文分享，且是ios平台，则压缩图片 | ||
| 206 | - shareOPtions.imageUrl = await this.compress(); | ||
| 207 | - } | ||
| 208 | - if(shareOPtions.type === 1 && shareOPtions.provider === 'qq'){//如果是分享文字到qq，则必须加上href和title | ||
| 209 | - shareOPtions.href = 'https://uniapp.dcloud.io'; | ||
| 210 | - shareOPtions.title = '欢迎体验uniapp'; | ||
| 211 | - } | ||
| 212 | - uni.share(shareOPtions); | ||
| 213 | - }, | ||
| 214 | - radioChange(e){ | ||
| 215 | - console.log('type:' + e.detail.value); | ||
| 216 | - this.shareType = parseInt(e.detail.value); | ||
| 217 | - }, | ||
| 218 | - chooseImage() { | ||
| 219 | - uni.chooseImage({ | ||
| 220 | - count: 1, | ||
| 221 | - sourceType: ['album', 'camera'], | ||
| 222 | - sizeType: ['compressed', 'original'], | ||
| 223 | - success: (res) => { | ||
| 224 | - this.image = res.tempFilePaths[0]; | ||
| 225 | - }, | ||
| 226 | - fail: (err) => { | ||
| 227 | - // #ifdef MP | ||
| 228 | - uni.getSetting({ | ||
| 229 | - success: (res) => { | ||
| 230 | - let authStatus = res.authSetting['scope.album'] && res.authSetting['scope.camera']; | ||
| 231 | - if (!authStatus) { | ||
| 232 | - uni.showModal({ | ||
| 233 | - title: '授权失败', | ||
| 234 | - content: 'Hello uni-app需要从您的相机或相册获取图片，请在设置界面打开相关权限', | ||
| 235 | - success: (res) => { | ||
| 236 | - if (res.confirm) { | ||
| 237 | - uni.openSetting() | ||
| 238 | - } | ||
| 239 | - } | ||
| 240 | - }) | ||
| 241 | - } | ||
| 242 | - } | ||
| 243 | - }) | ||
| 244 | - // #endif | ||
| 245 | - } | ||
| 246 | - }) | ||
| 247 | - }, | ||
| 248 | - compress(){//压缩图片 图文分享要求分享图片大小不能超过20Kb | ||
| 249 | - console.log('开始压缩'); | ||
| 250 | - let img = this.image; | ||
| 251 | - return new Promise((res) => { | ||
| 252 | - var localPath = plus.io.convertAbsoluteFileSystem(img.replace('file://', '')); | ||
| 253 | - console.log('after' + localPath); | ||
| 254 | - // 压缩size | ||
| 255 | - plus.io.resolveLocalFileSystemURL(localPath, (entry) => { | ||
| 256 | - entry.file((file) => {// 可通过entry对象操作图片 | ||
| 257 | - console.log('getFile:' + JSON.stringify(file)); | ||
| 258 | - if(file.size > 20480) {// 压缩后size 大于20Kb | ||
| 259 | - plus.zip.compressImage({ | ||
| 260 | - src: img, | ||
| 261 | - dst: img.replace('.jpg', '2222.jpg').replace('.JPG', '2222.JPG'), | ||
| 262 | - width: '10%', | ||
| 263 | - height: '10%', | ||
| 264 | - quality: 1, | ||
| 265 | - overwrite: true | ||
| 266 | - }, (event) => { | ||
| 267 | - console.log('success zip****' + event.size); | ||
| 268 | - let newImg = img.replace('.jpg', '2222.jpg').replace('.JPG', '2222.JPG'); | ||
| 269 | - res(newImg); | ||
| 270 | - }, function(error) { | ||
| 271 | - uni.showModal({ | ||
| 272 | - content:'分享图片太大,需要请重新选择图片!', | ||
| 273 | - showCancel:false | ||
| 274 | - }) | ||
| 275 | - }); | ||
| 276 | - } | ||
| 277 | - }); | ||
| 278 | - }, (e) => { | ||
| 279 | - console.log('Resolve file URL failed: ' + e.message); | ||
| 280 | - uni.showModal({ | ||
| 281 | - content:'分享图片太大,需要请重新选择图片!', | ||
| 282 | - showCancel:false | ||
| 283 | - }) | ||
| 284 | - }); | ||
| 285 | - }) | ||
| 286 | - } | ||
| 287 | - } | ||
| 288 | - } | ||
| 289 | -</script> | ||
| 290 | - | ||
| 291 | -<style> | ||
| 292 | - | ||
| 293 | -</style> |
pages/API/show-loading/show-loading.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-btn-v"> | ||
| 6 | - <button class="btn-load" type="primary" @click="showLoading">显示 loading 提示框</button> | ||
| 7 | - <!-- #ifndef MP-ALIPAY --> | ||
| 8 | - <button @click="hideLoading">隐藏 loading 提示框</button> | ||
| 9 | - <!-- #endif --> | ||
| 10 | - </view> | ||
| 11 | - </view> | ||
| 12 | - </view> | ||
| 13 | -</template> | ||
| 14 | -<script> | ||
| 15 | - export default { | ||
| 16 | - data() { | ||
| 17 | - return { | ||
| 18 | - title: 'loading' | ||
| 19 | - } | ||
| 20 | - }, | ||
| 21 | - methods: { | ||
| 22 | - showLoading: function() { | ||
| 23 | - uni.showLoading({ | ||
| 24 | - title: 'loading' | ||
| 25 | - }); | ||
| 26 | - | ||
| 27 | - // #ifdef MP-ALIPAY | ||
| 28 | - this._showTimer && clearTimeout(this._showTimer); | ||
| 29 | - this._showTimer = setTimeout(() => { | ||
| 30 | - this.hideLoading(); | ||
| 31 | - }, 3000) | ||
| 32 | - // #endif | ||
| 33 | - }, | ||
| 34 | - hideLoading: function() { | ||
| 35 | - uni.hideLoading(); | ||
| 36 | - } | ||
| 37 | - } | ||
| 38 | - // #ifdef MP-ALIPAY | ||
| 39 | - , | ||
| 40 | - onUnload() { | ||
| 41 | - this._showTimer && clearTimeout(this._showTimer); | ||
| 42 | - } | ||
| 43 | - // #endif | ||
| 44 | - } | ||
| 45 | -</script> | ||
| 46 | - | ||
| 47 | -<style> | ||
| 48 | - | ||
| 49 | -</style> |
pages/API/soter/soter.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-btn-v"> | ||
| 6 | - <button type="primary" @click="checkIsSupportSoterAuthentication">检查支持的认证方式</button> | ||
| 7 | - <button type="primary" @click="checkIsSoterEnrolledInDeviceFingerPrint">检查是否录入指纹</button> | ||
| 8 | - <button type="primary" @click="checkIsSoterEnrolledInDeviceFaceID">检查是否录入FaceID</button> | ||
| 9 | - <button type="primary" @click="startSoterAuthenticationFingerPrint">开始指纹认证</button> | ||
| 10 | - <button type="primary" @click="startSoterAuthenticationFaceID">开始FaceID认证</button> | ||
| 11 | - </view> | ||
| 12 | - <view style="width: 100%;text-align: center;">{{ result }}</view> | ||
| 13 | - </view> | ||
| 14 | - </view> | ||
| 15 | -</template> | ||
| 16 | - | ||
| 17 | -<script> | ||
| 18 | -export default { | ||
| 19 | - data() { | ||
| 20 | - return { | ||
| 21 | - title: '生物认证', | ||
| 22 | - result: '' | ||
| 23 | - }; | ||
| 24 | - }, | ||
| 25 | - onLoad() { | ||
| 26 | - | ||
| 27 | - }, | ||
| 28 | - methods: { | ||
| 29 | - checkIsSupportSoterAuthentication() { | ||
| 30 | - uni.checkIsSupportSoterAuthentication({ | ||
| 31 | - success(res) { | ||
| 32 | - uni.showModal({ | ||
| 33 | - content: '支持的认证方式：' + res.supportMode, | ||
| 34 | - showCancel: false | ||
| 35 | - }) | ||
| 36 | - console.log(res); | ||
| 37 | - }, | ||
| 38 | - fail(err) { | ||
| 39 | - console.log(err); | ||
| 40 | - } | ||
| 41 | - }) | ||
| 42 | - }, | ||
| 43 | - checkIsSoterEnrolledInDeviceFingerPrint() { | ||
| 44 | - uni.checkIsSoterEnrolledInDevice({ | ||
| 45 | - checkAuthMode: 'fingerPrint', | ||
| 46 | - success(res) { | ||
| 47 | - if(res.isEnrolled) { | ||
| 48 | - uni.showToast({ | ||
| 49 | - icon: 'none', | ||
| 50 | - title: '已录入指纹' | ||
| 51 | - }) | ||
| 52 | - }else { | ||
| 53 | - uni.showModal({ | ||
| 54 | - content: '未录入指纹', | ||
| 55 | - showCancel: false | ||
| 56 | - }) | ||
| 57 | - } | ||
| 58 | - console.log(res); | ||
| 59 | - }, | ||
| 60 | - fail(err) { | ||
| 61 | - uni.showModal({ | ||
| 62 | - content: '未录入指纹', | ||
| 63 | - showCancel: false | ||
| 64 | - }) | ||
| 65 | - console.log(err); | ||
| 66 | - } | ||
| 67 | - }) | ||
| 68 | - }, | ||
| 69 | - checkIsSoterEnrolledInDeviceFaceID() { | ||
| 70 | - uni.checkIsSoterEnrolledInDevice({ | ||
| 71 | - checkAuthMode: 'facial', | ||
| 72 | - success(res) { | ||
| 73 | - if(res.isEnrolled) { | ||
| 74 | - uni.showToast({ | ||
| 75 | - icon: 'none', | ||
| 76 | - title: '已录入FaceID' | ||
| 77 | - }) | ||
| 78 | - }else { | ||
| 79 | - uni.showModal({ | ||
| 80 | - content: '未录入FaceID', | ||
| 81 | - showCancel: false | ||
| 82 | - }) | ||
| 83 | - } | ||
| 84 | - console.log(res); | ||
| 85 | - }, | ||
| 86 | - fail(err) { | ||
| 87 | - uni.showModal({ | ||
| 88 | - content: '未录入FaceID', | ||
| 89 | - showCancel: false | ||
| 90 | - }) | ||
| 91 | - console.log(err); | ||
| 92 | - } | ||
| 93 | - }) | ||
| 94 | - }, | ||
| 95 | - startSoterAuthenticationFingerPrint() { | ||
| 96 | - uni.startSoterAuthentication({ | ||
| 97 | - requestAuthModes: ['fingerPrint'], | ||
| 98 | - challenge: '123456', | ||
| 99 | - authContent: '请用指纹解锁', | ||
| 100 | - success(res) { | ||
| 101 | - uni.showToast({ | ||
| 102 | - icon: 'none', | ||
| 103 | - title: '指纹验证成功' | ||
| 104 | - }) | ||
| 105 | - console.log(res); | ||
| 106 | - }, | ||
| 107 | - fail(err) { | ||
| 108 | - uni.showModal({ | ||
| 109 | - content: '指纹验证失败，errCode：' + err.errCode, | ||
| 110 | - showCancel: false | ||
| 111 | - }) | ||
| 112 | - console.log(err); | ||
| 113 | - } | ||
| 114 | - }) | ||
| 115 | - }, | ||
| 116 | - startSoterAuthenticationFaceID() { | ||
| 117 | - uni.startSoterAuthentication({ | ||
| 118 | - requestAuthModes: ['facial'], | ||
| 119 | - challenge: '123456', | ||
| 120 | - authContent: '请用FaceID解锁', | ||
| 121 | - success(res) { | ||
| 122 | - uni.showToast({ | ||
| 123 | - icon: 'none', | ||
| 124 | - title: 'FaceID验证成功' | ||
| 125 | - }) | ||
| 126 | - console.log(res); | ||
| 127 | - }, | ||
| 128 | - fail(err) { | ||
| 129 | - uni.showModal({ | ||
| 130 | - content: 'FaceID验证失败，errCode：' + err.errCode, | ||
| 131 | - showCancel: false | ||
| 132 | - }) | ||
| 133 | - console.log(err); | ||
| 134 | - } | ||
| 135 | - }) | ||
| 136 | - } | ||
| 137 | - } | ||
| 138 | -}; | ||
| 139 | -</script> | ||
| 140 | - | ||
| 141 | -<style></style> |
pages/API/sqlite/sqlite.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-btn-v"><button type="primary" @click="openDB">打开数据库test.db</button></view> | ||
| 6 | - <view class="uni-btn-v"><button type="primary" @click="executeSQL">创建表database及插入数据</button></view> | ||
| 7 | - <view class="uni-btn-v"><button type="primary" @click="selectSQL">查询表database的数据</button></view> | ||
| 8 | - <view class="uni-btn-v"><button type="primary" @click="droptable">删除表database</button></view> | ||
| 9 | - <view class="uni-btn-v"><button type="primary" @click="closeDB">关闭数据库test.db</button></view> | ||
| 10 | - <view class="uni-btn-v"><button type="primary" @click="isOpenDB">查询是否打开数据库</button></view> | ||
| 11 | - | ||
| 12 | - | ||
| 13 | - | ||
| 14 | - | ||
| 15 | - </view> | ||
| 16 | - </view> | ||
| 17 | -</template> | ||
| 18 | - | ||
| 19 | -<script> | ||
| 20 | -export default { | ||
| 21 | - data() { | ||
| 22 | - return { | ||
| 23 | - title: 'SQLite' | ||
| 24 | - }; | ||
| 25 | - }, | ||
| 26 | - methods: { | ||
| 27 | - openDB: function() { | ||
| 28 | - plus.sqlite.openDatabase({ | ||
| 29 | - name: 'first', | ||
| 30 | - path: '_doc/test.db', | ||
| 31 | - success: function(e) { | ||
| 32 | - plus.nativeUI.alert('打开数据库test.db成功 '); | ||
| 33 | - }, | ||
| 34 | - fail: function(e) { | ||
| 35 | - plus.nativeUI.alert('打开数据库test.db失败: ' + JSON.stringify(e)); | ||
| 36 | - } | ||
| 37 | - }); | ||
| 38 | - }, | ||
| 39 | - // 执行SQL语句 | ||
| 40 | - executeSQL: function() { | ||
| 41 | - plus.sqlite.executeSql({ | ||
| 42 | - name: 'first', | ||
| 43 | - sql: 'create table if not exists database("name" CHAR(110),"sex" CHAR(10),"age" INT(11))', | ||
| 44 | - success: function(e) { | ||
| 45 | - plus.sqlite.executeSql({ | ||
| 46 | - name: 'first', | ||
| 47 | - sql: "insert into database values('彦','女','7000')", | ||
| 48 | - success: function(e) { | ||
| 49 | - plus.nativeUI.alert('创建表table和插入数据成功'); | ||
| 50 | - }, | ||
| 51 | - fail: function(e) { | ||
| 52 | - plus.nativeUI.alert('创建表table成功但插入数据失败: ' + JSON.stringify(e)); | ||
| 53 | - } | ||
| 54 | - }); | ||
| 55 | - }, | ||
| 56 | - fail: function(e) { | ||
| 57 | - plus.nativeUI.alert('创建表table失败: ' + JSON.stringify(e)); | ||
| 58 | - } | ||
| 59 | - }); | ||
| 60 | - }, | ||
| 61 | - // 查询SQL语句 | ||
| 62 | - selectSQL: function() { | ||
| 63 | - plus.sqlite.selectSql({ | ||
| 64 | - name: 'first', | ||
| 65 | - sql: 'select * from database', | ||
| 66 | - success: function(e) { | ||
| 67 | - plus.nativeUI.alert('查询SQL语句成功: ' + JSON.stringify(e)); | ||
| 68 | - }, | ||
| 69 | - fail: function(e) { | ||
| 70 | - plus.nativeUI.alert('查询SQL语句失败: ' + JSON.stringify(e)); | ||
| 71 | - } | ||
| 72 | - }); | ||
| 73 | - }, | ||
| 74 | - // 删除表 | ||
| 75 | - droptable: function() { | ||
| 76 | - plus.sqlite.executeSql({ | ||
| 77 | - name: 'first', | ||
| 78 | - sql: 'drop table database', | ||
| 79 | - success: function(e) { | ||
| 80 | - plus.nativeUI.alert('删除表database成功'); | ||
| 81 | - }, | ||
| 82 | - fail: function(e) { | ||
| 83 | - plus.nativeUI.alert('删除表database失败: ' + JSON.stringify(e)); | ||
| 84 | - } | ||
| 85 | - }); | ||
| 86 | - }, | ||
| 87 | - // 关闭数据库 | ||
| 88 | - closeDB: function() { | ||
| 89 | - plus.sqlite.closeDatabase({ | ||
| 90 | - name: 'first', | ||
| 91 | - success: function(e) { | ||
| 92 | - plus.nativeUI.alert('关闭数据库成功'); | ||
| 93 | - }, | ||
| 94 | - fail: function(e) { | ||
| 95 | - plus.nativeUI.alert('关闭数据库失败: ' + JSON.stringify(e)); | ||
| 96 | - } | ||
| 97 | - }); | ||
| 98 | - }, | ||
| 99 | - isOpenDB: function() { | ||
| 100 | - if ( | ||
| 101 | - plus.sqlite.isOpenDatabase({ | ||
| 102 | - name: 'first', | ||
| 103 | - path: '_doc/test.db' | ||
| 104 | - }) | ||
| 105 | - ) { | ||
| 106 | - plus.nativeUI.alert('Opened!'); | ||
| 107 | - } else { | ||
| 108 | - plus.nativeUI.alert('Unopened!'); | ||
| 109 | - } | ||
| 110 | - } | ||
| 111 | - } | ||
| 112 | -}; | ||
| 113 | -</script> | ||
| 114 | - | ||
| 115 | -<style> | ||
| 116 | - .uni-btn-v { | ||
| 117 | - margin: 20rpx 0; | ||
| 118 | - padding: 0; | ||
| 119 | - } | ||
| 120 | -</style> |
pages/API/storage/storage.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-common-mt"> | ||
| 5 | - <view class="uni-list"> | ||
| 6 | - <view class="uni-list-cell"> | ||
| 7 | - <view class="uni-list-cell-left"> | ||
| 8 | - <view class="uni-label">key</view> | ||
| 9 | - </view> | ||
| 10 | - <view class="uni-list-cell-db"> | ||
| 11 | - <input class="uni-input" type="text" placeholder="请输入key" name="key" :value="key" @input="keyChange"/> | ||
| 12 | - </view> | ||
| 13 | - </view> | ||
| 14 | - <view class="uni-list-cell"> | ||
| 15 | - <view class="uni-list-cell-left"> | ||
| 16 | - <view class="uni-label">value</view> | ||
| 17 | - </view> | ||
| 18 | - <view class="uni-list-cell-db"> | ||
| 19 | - <input class="uni-input" type="text" placeholder="请输入value" name="data" :value="data" @input="dataChange"/> | ||
| 20 | - </view> | ||
| 21 | - </view> | ||
| 22 | - </view> | ||
| 23 | - <view class="uni-padding-wrap"> | ||
| 24 | - <view class="uni-btn-v"> | ||
| 25 | - <button type="primary" class="btn-setstorage" @tap="setStorage">存储数据</button> | ||
| 26 | - <button @tap="getStorage">读取数据</button> | ||
| 27 | - <button @tap="clearStorage">清理数据</button> | ||
| 28 | - </view> | ||
| 29 | - </view> | ||
| 30 | - </view> | ||
| 31 | - </view> | ||
| 32 | -</template> | ||
| 33 | -<script> | ||
| 34 | - export default { | ||
| 35 | - data() { | ||
| 36 | - return { | ||
| 37 | - title: 'get/set/clearStorage', | ||
| 38 | - key: '', | ||
| 39 | - data: '' | ||
| 40 | - } | ||
| 41 | - }, | ||
| 42 | - methods: { | ||
| 43 | - keyChange: function (e) { | ||
| 44 | - this.key = e.detail.value | ||
| 45 | - }, | ||
| 46 | - dataChange: function (e) { | ||
| 47 | - this.data = e.detail.value | ||
| 48 | - }, | ||
| 49 | - getStorage: function () { | ||
| 50 | - var key = this.key, | ||
| 51 | - data = this.data; | ||
| 52 | - if (key.length === 0) { | ||
| 53 | - uni.showModal({ | ||
| 54 | - title: '读取数据失败', | ||
| 55 | - content: "key 不能为空", | ||
| 56 | - showCancel:false | ||
| 57 | - }) | ||
| 58 | - } else { | ||
| 59 | - uni.getStorage({ | ||
| 60 | - key: key, | ||
| 61 | - success: (res) => { | ||
| 62 | - uni.showModal({ | ||
| 63 | - title: '读取数据成功', | ||
| 64 | - content: "data: '" + res.data + "'", | ||
| 65 | - showCancel:false | ||
| 66 | - }) | ||
| 67 | - }, | ||
| 68 | - fail: () => { | ||
| 69 | - uni.showModal({ | ||
| 70 | - title: '读取数据失败', | ||
| 71 | - content: "找不到 key 对应的数据", | ||
| 72 | - showCancel:false | ||
| 73 | - }) | ||
| 74 | - } | ||
| 75 | - }) | ||
| 76 | - } | ||
| 77 | - }, | ||
| 78 | - setStorage: function () { | ||
| 79 | - var key = this.key | ||
| 80 | - var data = this.data | ||
| 81 | - if (key.length === 0) { | ||
| 82 | - uni.showModal({ | ||
| 83 | - title: '保存数据失败', | ||
| 84 | - content: 'key 不能为空', | ||
| 85 | - showCancel:false | ||
| 86 | - }) | ||
| 87 | - } else { | ||
| 88 | - uni.setStorage({ | ||
| 89 | - key: key, | ||
| 90 | - data: data, | ||
| 91 | - success: (res) => { | ||
| 92 | - uni.showModal({ | ||
| 93 | - title: '存储数据成功', | ||
| 94 | - // #ifndef MP-ALIPAY | ||
| 95 | - content: JSON.stringify(res.errMsg), | ||
| 96 | - // #endif | ||
| 97 | - // #ifdef MP-ALIPAY | ||
| 98 | - content: data, | ||
| 99 | - // #endif | ||
| 100 | - showCancel:false | ||
| 101 | - }) | ||
| 102 | - }, | ||
| 103 | - fail: () => { | ||
| 104 | - uni.showModal({ | ||
| 105 | - title: '储存数据失败!', | ||
| 106 | - showCancel:false | ||
| 107 | - }) | ||
| 108 | - } | ||
| 109 | - }) | ||
| 110 | - } | ||
| 111 | - }, | ||
| 112 | - clearStorage: function () { | ||
| 113 | - uni.clearStorageSync() | ||
| 114 | - this.key = '', | ||
| 115 | - this.data = '' | ||
| 116 | - uni.showModal({ | ||
| 117 | - title: '清除数据成功', | ||
| 118 | - content: ' ', | ||
| 119 | - showCancel:false | ||
| 120 | - }) | ||
| 121 | - } | ||
| 122 | - } | ||
| 123 | - } | ||
| 124 | -</script> | ||
| 125 | - | ||
| 126 | -<style> | ||
| 127 | - .btn-setstorage { | ||
| 128 | - background-color: #007aff; | ||
| 129 | - color: #ffffff; | ||
| 130 | - } | ||
| 131 | -</style> |
pages/API/subnvue/subnvue.vue deleted
| 1 | -<template> | ||
| 2 | - <view class="content"> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="example"> | ||
| 5 | - <view class="example-title">从左侧滑出</view> | ||
| 6 | - <button @click="showDrawer">显示抽屉</button> | ||
| 7 | - </view> | ||
| 8 | - <view class="example"> | ||
| 9 | - <view class="example-title">从上侧竖向滑出</view> | ||
| 10 | - <button @click="showPopup">显示 弹出层</button> | ||
| 11 | - </view> | ||
| 12 | - <view style="width: 100%;"> | ||
| 13 | - <video v-if="showVideo" id="video" | ||
| 14 | - @play="playVideo" | ||
| 15 | - @pause="closeMask" | ||
| 16 | - :controls="false" | ||
| 17 | - src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20181126-lite.m4v" | ||
| 18 | - @error="videoErrorCallback" poster="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/b1476d40-4e5f-11eb-b997-9918a5dda011.png"></video> | ||
| 19 | - </view> | ||
| 20 | - </view> | ||
| 21 | -</template> | ||
| 22 | - | ||
| 23 | -<script> | ||
| 24 | - export default { | ||
| 25 | - data() { | ||
| 26 | - return { | ||
| 27 | - title: 'SubNvue', | ||
| 28 | - showVideo: false | ||
| 29 | - }; | ||
| 30 | - }, | ||
| 31 | - onLoad() { | ||
| 32 | - this.closeMask(); | ||
| 33 | - | ||
| 34 | - // 接收 popup 的消息 | ||
| 35 | - uni.$on('popup-page', (data) => { | ||
| 36 | - switch(data.type){ | ||
| 37 | - case 'interactive': | ||
| 38 | - uni.showModal({ | ||
| 39 | - title: '来自Popup的消息', | ||
| 40 | - content: data.info | ||
| 41 | - }) | ||
| 42 | - break; | ||
| 43 | - default: | ||
| 44 | - uni.showToast({ | ||
| 45 | - title: data.title, | ||
| 46 | - }) | ||
| 47 | - break; | ||
| 48 | - } | ||
| 49 | - }) | ||
| 50 | - // 监听 drawer 消息 | ||
| 51 | - uni.$on('drawer-page', (data) => { | ||
| 52 | - uni.showToast({ | ||
| 53 | - title: '点击了第' + data + '项', | ||
| 54 | - icon:"none" | ||
| 55 | - }); | ||
| 56 | - }) | ||
| 57 | - }, | ||
| 58 | - onUnload() { | ||
| 59 | - uni.$off('popup-page') | ||
| 60 | - uni.$off('drawer-page') | ||
| 61 | - }, | ||
| 62 | - onReady() { | ||
| 63 | - this.showVideo = true | ||
| 64 | - }, | ||
| 65 | - methods: { | ||
| 66 | - showDrawer() { | ||
| 67 | - uni.getSubNVueById('drawer').show('slide-in-left', 200); | ||
| 68 | - }, | ||
| 69 | - showPopup() { | ||
| 70 | - // 向 popup 传递消息 | ||
| 71 | - uni.$emit('page-popup', { | ||
| 72 | - title: '请阅读软件内容', | ||
| 73 | - content: 'uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架，开发者编写一套代码，可编译到iOS、Android、H5、小程序等多个平台。' | ||
| 74 | - }); | ||
| 75 | - const subNVue = uni.getSubNVueById('popup') | ||
| 76 | - subNVue.show('slide-in-top', 250) | ||
| 77 | - }, | ||
| 78 | - videoErrorCallback: function() { | ||
| 79 | - uni.showModal({ | ||
| 80 | - content: '视频加载失败', | ||
| 81 | - showCancel: false | ||
| 82 | - }) | ||
| 83 | - }, | ||
| 84 | - playVideo() { | ||
| 85 | - let subNVue = uni.getSubNVueById('video_mask') | ||
| 86 | - subNVue.show('fade-in', 200, () => { | ||
| 87 | - uni.$emit('play-video', { | ||
| 88 | - status: 'open', | ||
| 89 | - }) | ||
| 90 | - }) | ||
| 91 | - }, | ||
| 92 | - closeMask() { | ||
| 93 | - let subNVue = uni.getSubNVueById('video_mask') | ||
| 94 | - uni.$emit('close-video', { | ||
| 95 | - status: 'close', | ||
| 96 | - }) | ||
| 97 | - subNVue.hide('fade-out', 200) | ||
| 98 | - }, | ||
| 99 | - } | ||
| 100 | - } | ||
| 101 | -</script> | ||
| 102 | - | ||
| 103 | -<style> | ||
| 104 | - .content { | ||
| 105 | - align-content: center; | ||
| 106 | - height: 100%; | ||
| 107 | - background-color: #F4F5F6; | ||
| 108 | - } | ||
| 109 | - .example { | ||
| 110 | - padding: 0 10px 10px | ||
| 111 | - } | ||
| 112 | - .example-title { | ||
| 113 | - font-size: 14px; | ||
| 114 | - line-height: 14px; | ||
| 115 | - color: #777; | ||
| 116 | - margin: 40px 2rpx; | ||
| 117 | - position: relative | ||
| 118 | - } | ||
| 119 | - video { | ||
| 120 | - position: absolute; | ||
| 121 | - bottom: 30px; | ||
| 122 | - left: 0; | ||
| 123 | - width: 100%; | ||
| 124 | - height: 200px; | ||
| 125 | - } | ||
| 126 | - .example .example-title { | ||
| 127 | - margin: 40rpx 0 | ||
| 128 | - } | ||
| 129 | - button { | ||
| 130 | - background-color: #f8f8f8; | ||
| 131 | - } | ||
| 132 | - .title { | ||
| 133 | - font-size: 20px; | ||
| 134 | - text-align: center; | ||
| 135 | - color: #8f8f94; | ||
| 136 | - } | ||
| 137 | -</style> |
pages/API/subnvue/subnvue/drawer.nvue deleted
| 1 | -<template> | ||
| 2 | - <div class="wrapper"> | ||
| 3 | - <text class="nav-text">左侧列表</text> | ||
| 4 | - <list class="list-wrapper"> | ||
| 5 | - <cell v-for="item in lists" :key="item.id"> | ||
| 6 | - <div class="text-wrapper" @click="clickitem(item.id)"> | ||
| 7 | - <text style="font-size: 30rpx; ">{{item.name}}</text> | ||
| 8 | - <text class="icon"></text> | ||
| 9 | - </div> | ||
| 10 | - </cell> | ||
| 11 | - </list> | ||
| 12 | - <div style="flex: 1; text-align: center;"> | ||
| 13 | - <div class="close-drawer" @click="hideDrawer"> | ||
| 14 | - <text style="font-size: 34rpx; text-align: center;">关闭抽屉</text> | ||
| 15 | - </div> | ||
| 16 | - </div> | ||
| 17 | - </div> | ||
| 18 | -</template> | ||
| 19 | - | ||
| 20 | -<script> | ||
| 21 | - export default { | ||
| 22 | - data() { | ||
| 23 | - return { | ||
| 24 | - lists: [], | ||
| 25 | - } | ||
| 26 | - }, | ||
| 27 | - beforeCreate() { | ||
| 28 | - const domModule = weex.requireModule('dom') | ||
| 29 | - domModule.addRule('fontFace', { | ||
| 30 | - fontFamily: "unibtn", | ||
| 31 | - 'src': "url('../../../../static/uni.ttf')" | ||
| 32 | - }); | ||
| 33 | - }, | ||
| 34 | - created() { | ||
| 35 | - for(let i = 0; i < 5; i++){ | ||
| 36 | - this.lists.push({ | ||
| 37 | - id: i, | ||
| 38 | - name: 'Item' + i, | ||
| 39 | - }); | ||
| 40 | - } | ||
| 41 | - }, | ||
| 42 | - methods: { | ||
| 43 | - hideDrawer() { | ||
| 44 | - uni.getCurrentSubNVue().hide('auto') | ||
| 45 | - }, | ||
| 46 | - clickitem(e) { | ||
| 47 | - uni.$emit('drawer-page', e); | ||
| 48 | - } | ||
| 49 | - } | ||
| 50 | - } | ||
| 51 | -</script> | ||
| 52 | - | ||
| 53 | -<style> | ||
| 54 | - .wrapper { | ||
| 55 | - flex-direction: column; | ||
| 56 | - flex: 1; | ||
| 57 | - text-align: center; | ||
| 58 | - padding: 60rpx 0rpx 0rpx 20rpx; | ||
| 59 | - background-color: #F4F5F6; | ||
| 60 | - } | ||
| 61 | - .nav-text { | ||
| 62 | - color: #8f8f94; | ||
| 63 | - /* #ifndef APP-PLUS-NVUE */ | ||
| 64 | - margin-bottom: 40px; | ||
| 65 | - /* #endif */ | ||
| 66 | - /* #ifdef APP-PLUS-NVUE */ | ||
| 67 | - margin-bottom: 40rpx; | ||
| 68 | - /* #endif */ | ||
| 69 | - } | ||
| 70 | - .list-wrapper { | ||
| 71 | - /* #ifdef APP-PLUS-NVUE */ | ||
| 72 | - height: 450rpx; | ||
| 73 | - /* #endif */ | ||
| 74 | - /* #ifndef APP-PLUS-NVUE */ | ||
| 75 | - height: 450px; | ||
| 76 | - /* #endif */ | ||
| 77 | - } | ||
| 78 | - .text-wrapper { | ||
| 79 | - justify-content: center; | ||
| 80 | - border-bottom-style: solid; | ||
| 81 | - border-bottom-width: 1rpx; | ||
| 82 | - border-bottom-color: rgba(0,0,0,.2); | ||
| 83 | - margin-bottom: 35rpx; | ||
| 84 | - padding-bottom: 15rpx; | ||
| 85 | - } | ||
| 86 | - .close-drawer { | ||
| 87 | - background-color: #f8f8f8; | ||
| 88 | - width: 300rpx; | ||
| 89 | - padding: 15rpx; | ||
| 90 | - border-radius: 20rpx; | ||
| 91 | - border-style: solid; | ||
| 92 | - border-width: 1rpx; | ||
| 93 | - border-color: rgba(0,0,0,.2); | ||
| 94 | - } | ||
| 95 | - .icon { | ||
| 96 | - position: absolute; | ||
| 97 | - right: 10rpx; | ||
| 98 | - color: #000000; | ||
| 99 | - font-family: unibtn; | ||
| 100 | - font-size: 30rpx; | ||
| 101 | - font-weight: 400; | ||
| 102 | - } | ||
| 103 | -</style> |
pages/API/subnvue/subnvue/popup.nvue deleted
| 1 | -<template> | ||
| 2 | - <div class="wrapper"> | ||
| 3 | - <text class="title">{{title}}</text> | ||
| 4 | - <scroller class="scroller"> | ||
| 5 | - <div> | ||
| 6 | - <text class="content">{{content}}</text> | ||
| 7 | - </div> | ||
| 8 | - <div> | ||
| 9 | - <text style="color: red; font-size: 30rpx;">以下为 Popup 内部滚动示例：</text> | ||
| 10 | - </div> | ||
| 11 | - <div class="cell" v-for="(item, index) in lists" @click="handle(item)" :key="index"> | ||
| 12 | - <text class="text">{{item}}</text> | ||
| 13 | - </div> | ||
| 14 | - </scroller> | ||
| 15 | - <div class="message-wrapper"> | ||
| 16 | - <text class="send-message" @click="sendMessage">向页面发送消息</text> | ||
| 17 | - </div> | ||
| 18 | - </div> | ||
| 19 | -</template> | ||
| 20 | - | ||
| 21 | -<script> | ||
| 22 | - export default { | ||
| 23 | - data() { | ||
| 24 | - return { | ||
| 25 | - title: '', | ||
| 26 | - content: '', | ||
| 27 | - lists: [], | ||
| 28 | - } | ||
| 29 | - }, | ||
| 30 | - created() { | ||
| 31 | - const vm = this; | ||
| 32 | - for (let i = 1; i < 20; i++) { | ||
| 33 | - this.lists.push('item' + i); | ||
| 34 | - } | ||
| 35 | - uni.$on('page-popup', (data) => { | ||
| 36 | - vm.title = data.title; | ||
| 37 | - vm.content = data.content; | ||
| 38 | - }) | ||
| 39 | - }, | ||
| 40 | - beforeDestroy() { | ||
| 41 | - uni.$off('drawer-page') | ||
| 42 | - }, | ||
| 43 | - methods: { | ||
| 44 | - sendMessage() { | ||
| 45 | - const subNVue = uni.getCurrentSubNVue() | ||
| 46 | - uni.$emit('popup-page', { | ||
| 47 | - title: '已读完!', | ||
| 48 | - }) | ||
| 49 | - }, | ||
| 50 | - handle(item, index) { | ||
| 51 | - const subNVue = uni.getCurrentSubNVue() | ||
| 52 | - uni.$emit('popup-page', { | ||
| 53 | - type: 'interactive', | ||
| 54 | - info: item + ' 该元素被点击了!', | ||
| 55 | - }) | ||
| 56 | - } | ||
| 57 | - } | ||
| 58 | - } | ||
| 59 | -</script> | ||
| 60 | - | ||
| 61 | -<style> | ||
| 62 | - .wrapper { | ||
| 63 | - flex-direction: column; | ||
| 64 | - justify-content: space-between; | ||
| 65 | - padding: 10rpx 15rpx; | ||
| 66 | - background-color: #F4F5F6; | ||
| 67 | - border-radius: 4rpx; | ||
| 68 | - } | ||
| 69 | - | ||
| 70 | - .title { | ||
| 71 | - height: 100rpx; | ||
| 72 | - line-height: 100rpx; | ||
| 73 | - border-bottom-style: solid; | ||
| 74 | - border-bottom-width: 1rpx; | ||
| 75 | - border-bottom-color: #CBCBCB; | ||
| 76 | - flex: 0; | ||
| 77 | - font-size: 30rpx; | ||
| 78 | - } | ||
| 79 | - | ||
| 80 | - .scroller { | ||
| 81 | - height: 400rpx; | ||
| 82 | - padding: 8rpx 15rpx; | ||
| 83 | - } | ||
| 84 | - | ||
| 85 | - .content { | ||
| 86 | - color: #555555; | ||
| 87 | - font-size: 32rpx; | ||
| 88 | - } | ||
| 89 | - | ||
| 90 | - .message-wrapper { | ||
| 91 | - flex: 0; | ||
| 92 | - border-top-style: solid; | ||
| 93 | - border-top-width: 1rpx; | ||
| 94 | - border-top-color: #CBCBCB; | ||
| 95 | - height: 80rpx; | ||
| 96 | - align-items: flex-end; | ||
| 97 | - } | ||
| 98 | - | ||
| 99 | - .send-message { | ||
| 100 | - font-size: 30rpx; | ||
| 101 | - line-height: 80rpx; | ||
| 102 | - color: #00CE47; | ||
| 103 | - margin-left: 20rpx; | ||
| 104 | - } | ||
| 105 | - | ||
| 106 | - .cell { | ||
| 107 | - margin: 10rpx; | ||
| 108 | - padding: 20rpx 0; | ||
| 109 | - top: 10rpx; | ||
| 110 | - align-items: center; | ||
| 111 | - justify-content: center; | ||
| 112 | - border-radius: 10rpx; | ||
| 113 | - background-color: #5989B9; | ||
| 114 | - } | ||
| 115 | - | ||
| 116 | - .text { | ||
| 117 | - font-size: 30rpx; | ||
| 118 | - text-align: center; | ||
| 119 | - color: white; | ||
| 120 | - } | ||
| 121 | -</style> |
pages/API/subnvue/subnvue/video-mask.nvue deleted
| 1 | -<template> | ||
| 2 | - <div class="wrapper"> | ||
| 3 | - <list class="list"> | ||
| 4 | - <cell v-for="(item, index) in lists" :key="index" :ref="'item' + index" class="cell"> | ||
| 5 | - <text class="name">{{item.name}}:</text> | ||
| 6 | - <text class="content">{{item.content}}</text> | ||
| 7 | - </cell> | ||
| 8 | - </list> | ||
| 9 | - </div> | ||
| 10 | -</template> | ||
| 11 | - | ||
| 12 | -<script> | ||
| 13 | - export default { | ||
| 14 | - data() { | ||
| 15 | - return { | ||
| 16 | - lists: [], | ||
| 17 | - interval: null, | ||
| 18 | - yourTexts: [ | ||
| 19 | - { | ||
| 20 | - name: '学员A', | ||
| 21 | - content: '老师讲的真好', | ||
| 22 | - }, { | ||
| 23 | - name: '学员B', | ||
| 24 | - content: 'uni-app值得学习', | ||
| 25 | - }, { | ||
| 26 | - name: '学员C', | ||
| 27 | - content: '老师，还有实战例子吗？', | ||
| 28 | - }, { | ||
| 29 | - name: '学员D', | ||
| 30 | - content: '老师，请问是不是要先学会vue才能学uni-app？', | ||
| 31 | - }, { | ||
| 32 | - name: '学员E', | ||
| 33 | - content: '受教了，uni-app太牛了', | ||
| 34 | - } | ||
| 35 | - ], | ||
| 36 | - } | ||
| 37 | - }, | ||
| 38 | - created() { | ||
| 39 | - const vm = this; | ||
| 40 | - uni.$on('play-video', (data) => { | ||
| 41 | - if(data.status === 'open'){ | ||
| 42 | - this.addItem(); | ||
| 43 | - }else{ | ||
| 44 | - this.closeItem(); | ||
| 45 | - } | ||
| 46 | - }) | ||
| 47 | - }, | ||
| 48 | - beforeDestroy(){ | ||
| 49 | - uni.$off('play-video') | ||
| 50 | - this.closeItem() | ||
| 51 | - }, | ||
| 52 | - methods: { | ||
| 53 | - addItem() { | ||
| 54 | - const vm = this; | ||
| 55 | - vm.lists = [{ | ||
| 56 | - name: '学员E', | ||
| 57 | - content: '受教了，uni-app太牛了', | ||
| 58 | - }]; | ||
| 59 | - const dom = weex.requireModule('dom') | ||
| 60 | - vm.interval = setInterval(() => { | ||
| 61 | - if(vm.lists.length > 15) { | ||
| 62 | - vm.lists.unshift(); | ||
| 63 | - } | ||
| 64 | - vm.lists.push({ | ||
| 65 | - name: vm.yourTexts[vm.lists.length%4].name, | ||
| 66 | - content: vm.yourTexts[vm.lists.length%4].content | ||
| 67 | - }); | ||
| 68 | - if(vm.lists.length > 5) { | ||
| 69 | - vm.$nextTick(() => { | ||
| 70 | - if(vm.$refs['item' + (vm.lists.length - 1)]){ | ||
| 71 | - dom.scrollToElement(vm.$refs['item' + (vm.lists.length - 1)][0]); | ||
| 72 | - } | ||
| 73 | - }); | ||
| 74 | - } | ||
| 75 | - }, 3500); | ||
| 76 | - }, | ||
| 77 | - closeItem() { | ||
| 78 | - if(this.interval) clearInterval(this.interval); | ||
| 79 | - } | ||
| 80 | - } | ||
| 81 | - } | ||
| 82 | -</script> | ||
| 83 | - | ||
| 84 | -<style> | ||
| 85 | - .wrapper { | ||
| 86 | - position: relative; | ||
| 87 | - flex: 1; | ||
| 88 | - background-color: transparent; | ||
| 89 | - } | ||
| 90 | - .list { | ||
| 91 | - position: absolute; | ||
| 92 | - top: 0; | ||
| 93 | - left: 0; | ||
| 94 | - right: 0; | ||
| 95 | - bottom: 0; | ||
| 96 | - background-color: rgba(0, 0, 0, 0.7); | ||
| 97 | - } | ||
| 98 | - .cell { | ||
| 99 | - padding: 10rpx 0; | ||
| 100 | - flex-direction: row; | ||
| 101 | - flex-wrap: nowrap; | ||
| 102 | - } | ||
| 103 | - .name { | ||
| 104 | - flex: 0; | ||
| 105 | - font-size: 20rpx; | ||
| 106 | - margin-right: 20rpx; | ||
| 107 | - color: #FF5A5F; | ||
| 108 | - } | ||
| 109 | - .content { | ||
| 110 | - flex: 1; | ||
| 111 | - font-size: 20rpx; | ||
| 112 | - color: #F4F5F6; | ||
| 113 | - } | ||
| 114 | -</style> |
pages/API/toast/toast.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-btn-v"> | ||
| 6 | - <button type="default" @tap="toast1Tap">点击弹出默认toast</button> | ||
| 7 | - <button type="default" @tap="toast2Tap">点击弹出设置duration的toast</button> | ||
| 8 | - <button type="default" @tap="toast3Tap">点击弹出显示loading的toast</button> | ||
| 9 | - <!-- #ifndef MP-ALIPAY --> | ||
| 10 | - <button type="default" @tap="toast4Tap">点击弹出显示自定义图片的toast</button> | ||
| 11 | - <!-- #endif --> | ||
| 12 | - <!-- #ifdef APP-PLUS --> | ||
| 13 | - <button type="default" @tap="toast5Tap">点击显示无图标的居底toast</button> | ||
| 14 | - <!-- #endif --> | ||
| 15 | - <button type="default" @tap="hideToast">点击隐藏toast</button> | ||
| 16 | - </view> | ||
| 17 | - </view> | ||
| 18 | - </view> | ||
| 19 | -</template> | ||
| 20 | -<script> | ||
| 21 | - export default { | ||
| 22 | - data() { | ||
| 23 | - return { | ||
| 24 | - title: 'toast' | ||
| 25 | - } | ||
| 26 | - }, | ||
| 27 | - // #ifdef MP-ALIPAY | ||
| 28 | - onUnload() { | ||
| 29 | - this._showTimer && clearTimeout(this._showTimer); | ||
| 30 | - }, | ||
| 31 | - // #endif | ||
| 32 | - methods: { | ||
| 33 | - toast1Tap: function () { | ||
| 34 | - uni.showToast({ | ||
| 35 | - title: "默认" | ||
| 36 | - }) | ||
| 37 | - }, | ||
| 38 | - toast2Tap: function () { | ||
| 39 | - uni.showToast({ | ||
| 40 | - title: "duration 3000", | ||
| 41 | - duration: 3000 | ||
| 42 | - }) | ||
| 43 | - }, | ||
| 44 | - toast3Tap: function () { | ||
| 45 | - uni.showToast({ | ||
| 46 | - title: "loading", | ||
| 47 | - icon: "loading", | ||
| 48 | - duration: 5000 | ||
| 49 | - }) | ||
| 50 | - // #ifdef MP-ALIPAY | ||
| 51 | - this._showTimer = setTimeout(() => { | ||
| 52 | - // icon 是 loading 时，showToast 实际执行的是 showLoading | ||
| 53 | - my.hideLoading() | ||
| 54 | - // 执行完所有代码再清除定时器 | ||
| 55 | - clearTimeout(this._showTimer); | ||
| 56 | - }, 3000) | ||
| 57 | - // #endif | ||
| 58 | - | ||
| 59 | - }, | ||
| 60 | - toast4Tap: function () { | ||
| 61 | - uni.showToast({ | ||
| 62 | - title: "logo", | ||
| 63 | - image: "../../../static/uni.png" | ||
| 64 | - }) | ||
| 65 | - }, | ||
| 66 | - // #ifdef APP-PLUS | ||
| 67 | - toast5Tap: function () { | ||
| 68 | - uni.showToast({ | ||
| 69 | - title: "显示一段轻提示", | ||
| 70 | - position:'bottom' | ||
| 71 | - }) | ||
| 72 | - }, | ||
| 73 | - // #endif | ||
| 74 | - hideToast: function () { | ||
| 75 | - uni.hideToast() | ||
| 76 | - } | ||
| 77 | - } | ||
| 78 | - } | ||
| 79 | -</script> |
pages/API/upload-file/upload-file.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="demo"> | ||
| 6 | - <block v-if="imageSrc"> | ||
| 7 | - <image :src="imageSrc" class="image" mode="widthFix"></image> | ||
| 8 | - </block> | ||
| 9 | - <block v-else> | ||
| 10 | - <view class="uni-hello-addfile" @click="chooseImage">+ 选择图片</view> | ||
| 11 | - </block> | ||
| 12 | - </view> | ||
| 13 | - </view> | ||
| 14 | - </view> | ||
| 15 | -</template> | ||
| 16 | -<script> | ||
| 17 | - export default { | ||
| 18 | - data() { | ||
| 19 | - return { | ||
| 20 | - title: 'uploadFile', | ||
| 21 | - imageSrc: '' | ||
| 22 | - } | ||
| 23 | - }, | ||
| 24 | - onUnload() { | ||
| 25 | - this.imageSrc = ''; | ||
| 26 | - }, | ||
| 27 | - methods: { | ||
| 28 | - chooseImage: function() { | ||
| 29 | - uni.chooseImage({ | ||
| 30 | - count: 1, | ||
| 31 | - sizeType: ['compressed'], | ||
| 32 | - sourceType: ['album'], | ||
| 33 | - success: (res) => { | ||
| 34 | - console.log('chooseImage success, temp path is', res.tempFilePaths[0]) | ||
| 35 | - var imageSrc = res.tempFilePaths[0] | ||
| 36 | - uni.uploadFile({ | ||
| 37 | - url: 'https://unidemo.dcloud.net.cn/upload', | ||
| 38 | - filePath: imageSrc, | ||
| 39 | - fileType: 'image', | ||
| 40 | - name: 'data', | ||
| 41 | - success: (res) => { | ||
| 42 | - console.log('uploadImage success, res is:', res) | ||
| 43 | - uni.showToast({ | ||
| 44 | - title: '上传成功', | ||
| 45 | - icon: 'success', | ||
| 46 | - duration: 1000 | ||
| 47 | - }) | ||
| 48 | - this.imageSrc = imageSrc | ||
| 49 | - }, | ||
| 50 | - fail: (err) => { | ||
| 51 | - console.log('uploadImage fail', err); | ||
| 52 | - uni.showModal({ | ||
| 53 | - content: err.errMsg, | ||
| 54 | - showCancel: false | ||
| 55 | - }); | ||
| 56 | - } | ||
| 57 | - }); | ||
| 58 | - }, | ||
| 59 | - fail: (err) => { | ||
| 60 | - console.log('chooseImage fail', err) | ||
| 61 | - // #ifdef MP | ||
| 62 | - uni.getSetting({ | ||
| 63 | - success: (res) => { | ||
| 64 | - let authStatus = res.authSetting['scope.album']; | ||
| 65 | - if (!authStatus) { | ||
| 66 | - uni.showModal({ | ||
| 67 | - title: '授权失败', | ||
| 68 | - content: 'Hello uni-app需要从您的相册获取图片，请在设置界面打开相关权限', | ||
| 69 | - success: (res) => { | ||
| 70 | - if (res.confirm) { | ||
| 71 | - uni.openSetting() | ||
| 72 | - } | ||
| 73 | - } | ||
| 74 | - }) | ||
| 75 | - } | ||
| 76 | - } | ||
| 77 | - }) | ||
| 78 | - // #endif | ||
| 79 | - } | ||
| 80 | - }) | ||
| 81 | - } | ||
| 82 | - } | ||
| 83 | - } | ||
| 84 | -</script> | ||
| 85 | - | ||
| 86 | -<style> | ||
| 87 | - .image { | ||
| 88 | - width: 100%; | ||
| 89 | - } | ||
| 90 | - | ||
| 91 | - .demo { | ||
| 92 | - background: #FFF; | ||
| 93 | - padding: 50rpx; | ||
| 94 | - } | ||
| 95 | -</style> |
pages/API/vibrate/vibrate.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <button class="uni-button" type="primary" @click="longshock">长震动</button> | ||
| 6 | - <button class="uni-button" @click="shortshock">短震动</button> | ||
| 7 | - | ||
| 8 | - <view class="uni-tips"> | ||
| 9 | - <view>Tips</view> | ||
| 10 | - <view class="uni-tips-text">iOS上只有长震动，没有短震动</view> | ||
| 11 | - <view class="uni-tips-text">iOS上需要手机设置“打开响铃时震动”或“静音时震动”，否则无法震动</view> | ||
| 12 | - </view> | ||
| 13 | - </view> | ||
| 14 | - </view> | ||
| 15 | -</template> | ||
| 16 | -<script> | ||
| 17 | -export default { | ||
| 18 | - data() { | ||
| 19 | - return { | ||
| 20 | - title: 'vibrateLong/vibrateShort' | ||
| 21 | - }; | ||
| 22 | - }, | ||
| 23 | - onLoad() {}, | ||
| 24 | - methods: { | ||
| 25 | - longshock() { | ||
| 26 | - uni.vibrateLong({ | ||
| 27 | - success: function() { | ||
| 28 | - console.log('success'); | ||
| 29 | - } | ||
| 30 | - }); | ||
| 31 | - }, | ||
| 32 | - shortshock() { | ||
| 33 | - uni.vibrateShort({ | ||
| 34 | - success: function() { | ||
| 35 | - console.log('success'); | ||
| 36 | - } | ||
| 37 | - }); | ||
| 38 | - } | ||
| 39 | - } | ||
| 40 | -}; | ||
| 41 | -</script> | ||
| 42 | - | ||
| 43 | -<style> | ||
| 44 | -.uni-padding-wrap { | ||
| 45 | - margin-top: 50rpx 0; | ||
| 46 | -} | ||
| 47 | -.uni-button { | ||
| 48 | - margin: 30rpx 0; | ||
| 49 | -} | ||
| 50 | -.uni-tips { | ||
| 51 | - color: #666; | ||
| 52 | - font-size: 30rpx; | ||
| 53 | -} | ||
| 54 | -.uni-tips-text { | ||
| 55 | - margin-top: 15rpx; | ||
| 56 | - line-height: 1.2; | ||
| 57 | - font-size: 24rpx; | ||
| 58 | -} | ||
| 59 | -</style> |
pages/API/video/video.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-common-mt"> | ||
| 5 | - <view class="uni-list"> | ||
| 6 | - <view class="uni-list-cell"> | ||
| 7 | - <view class="uni-list-cell-left"> | ||
| 8 | - <view class="uni-label">视频来源</view> | ||
| 9 | - </view> | ||
| 10 | - <view class="uni-list-cell-right"> | ||
| 11 | - <picker :range="sourceType" @change="sourceTypeChange" :value="sourceTypeIndex"> | ||
| 12 | - <view class="uni-input">{{sourceType[sourceTypeIndex]}}</view> | ||
| 13 | - </picker> | ||
| 14 | - </view> | ||
| 15 | - </view> | ||
| 16 | - </view> | ||
| 17 | - </view> | ||
| 18 | - <!-- #ifdef APP-PLUS || MP-WEIXIN --> | ||
| 19 | - <view class="uni-title uni-common-mt uni-common-pl">摄像头位置</view> | ||
| 20 | - <view class="uni-hello-text camera-tips">注意：部分 Android 手机下由于系统 ROM 不支持无法生效，打开拍摄界面后可操作切换</view> | ||
| 21 | - <view class="uni-list"> | ||
| 22 | - <radio-group @change="radioChange"> | ||
| 23 | - <label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in cameraList" :key="item.value"> | ||
| 24 | - <radio :value="item.value" :checked="index === cameraIndex">{{item.name}}</radio> | ||
| 25 | - </label> | ||
| 26 | - </radio-group> | ||
| 27 | - </view> | ||
| 28 | - <!-- #endif --> | ||
| 29 | - <template v-if="!src"> | ||
| 30 | - <view class="uni-hello-addfile" @tap="chooseVideo">+ 添加视频</view> | ||
| 31 | - </template> | ||
| 32 | - <template v-else> | ||
| 33 | - <video :src="src" class="video"></video> | ||
| 34 | - </template> | ||
| 35 | - </view> | ||
| 36 | -</template> | ||
| 37 | -<script> | ||
| 38 | - var sourceType = [ | ||
| 39 | - ['camera'], | ||
| 40 | - ['album'], | ||
| 41 | - ['camera', 'album'] | ||
| 42 | - ] | ||
| 43 | - export default { | ||
| 44 | - data() { | ||
| 45 | - return { | ||
| 46 | - title: 'chooseVideo', | ||
| 47 | - sourceTypeIndex: 2, | ||
| 48 | - sourceType: ['拍摄', '相册', '拍摄或相册'], | ||
| 49 | - src: '', | ||
| 50 | - cameraList: [{ | ||
| 51 | - value: 'back', | ||
| 52 | - name: '后置摄像头', | ||
| 53 | - checked: 'true' | ||
| 54 | - }, | ||
| 55 | - { | ||
| 56 | - value: 'front', | ||
| 57 | - name: '前置摄像头' | ||
| 58 | - }, | ||
| 59 | - ], | ||
| 60 | - cameraIndex: 0 | ||
| 61 | - } | ||
| 62 | - }, | ||
| 63 | - onUnload() { | ||
| 64 | - this.src = '', | ||
| 65 | - this.sourceTypeIndex = 2, | ||
| 66 | - this.sourceType = ['拍摄', '相册', '拍摄或相册']; | ||
| 67 | - }, | ||
| 68 | - methods: { | ||
| 69 | - radioChange(evt) { | ||
| 70 | - for (let i = 0; i < this.cameraList.length; i++) { | ||
| 71 | - if (this.cameraList[i].value === evt.detail.value) { | ||
| 72 | - this.cameraIndex = i; | ||
| 73 | - break; | ||
| 74 | - } | ||
| 75 | - } | ||
| 76 | - }, | ||
| 77 | - sourceTypeChange: function(e) { | ||
| 78 | - this.sourceTypeIndex = parseInt(e.detail.value) | ||
| 79 | - }, | ||
| 80 | - chooseVideo: function() { | ||
| 81 | - uni.chooseVideo({ | ||
| 82 | - camera: this.cameraList[this.cameraIndex].value, | ||
| 83 | - sourceType: sourceType[this.sourceTypeIndex], | ||
| 84 | - success: (res) => { | ||
| 85 | - this.src = res.tempFilePath | ||
| 86 | - }, | ||
| 87 | - fail: (err) => { | ||
| 88 | - // #ifdef MP | ||
| 89 | - uni.getSetting({ | ||
| 90 | - success: (res) => { | ||
| 91 | - let authStatus = false; | ||
| 92 | - switch (this.sourceTypeIndex) { | ||
| 93 | - case 0: | ||
| 94 | - authStatus = res.authSetting['scope.camera']; | ||
| 95 | - break; | ||
| 96 | - case 1: | ||
| 97 | - authStatus = res.authSetting['scope.album']; | ||
| 98 | - break; | ||
| 99 | - case 2: | ||
| 100 | - authStatus = res.authSetting['scope.album'] && res.authSetting['scope.camera']; | ||
| 101 | - break; | ||
| 102 | - default: | ||
| 103 | - break; | ||
| 104 | - } | ||
| 105 | - if (!authStatus) { | ||
| 106 | - uni.showModal({ | ||
| 107 | - title: '授权失败', | ||
| 108 | - content: 'Hello uni-app需要从您的相机或相册获取视频，请在设置界面打开相关权限', | ||
| 109 | - success: (res) => { | ||
| 110 | - if (res.confirm) { | ||
| 111 | - uni.openSetting() | ||
| 112 | - } | ||
| 113 | - } | ||
| 114 | - }) | ||
| 115 | - } | ||
| 116 | - } | ||
| 117 | - }) | ||
| 118 | - // #endif | ||
| 119 | - } | ||
| 120 | - }) | ||
| 121 | - } | ||
| 122 | - } | ||
| 123 | - } | ||
| 124 | -</script> | ||
| 125 | - | ||
| 126 | -<style> | ||
| 127 | - .video { | ||
| 128 | - width: 100%; | ||
| 129 | - } | ||
| 130 | - | ||
| 131 | - .camera-tips { | ||
| 132 | - padding: 10rpx 30rpx; | ||
| 133 | - } | ||
| 134 | -</style> |
pages/API/voice/voice.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <block v-if="!recording && !playing && !hasRecord"> | ||
| 6 | - <view class="page-body-time"> | ||
| 7 | - <text class="time-big">{{formatedRecordTime}}</text> | ||
| 8 | - </view> | ||
| 9 | - <view class="page-body-buttons"> | ||
| 10 | - <view class="page-body-button"></view> | ||
| 11 | - <view class="page-body-button" @click="startRecord"> | ||
| 12 | - <image src="../../../static/record.png"></image> | ||
| 13 | - </view> | ||
| 14 | - <view class="page-body-button"></view> | ||
| 15 | - </view> | ||
| 16 | - </block> | ||
| 17 | - <block v-if="recording === true"> | ||
| 18 | - <view class="page-body-time"> | ||
| 19 | - <text class="time-big">{{formatedRecordTime}}</text> | ||
| 20 | - </view> | ||
| 21 | - <view class="page-body-buttons"> | ||
| 22 | - <view class="page-body-button"></view> | ||
| 23 | - <view class="page-body-button" @click="stopRecord"> | ||
| 24 | - <view class="button-stop-record"></view> | ||
| 25 | - </view> | ||
| 26 | - <view class="page-body-button"></view> | ||
| 27 | - </view> | ||
| 28 | - </block> | ||
| 29 | - <block v-if="hasRecord === true && playing === false"> | ||
| 30 | - <view class="page-body-time"> | ||
| 31 | - <text class="time-big">{{formatedPlayTime}}</text> | ||
| 32 | - <text class="time-small">{{formatedRecordTime}}</text> | ||
| 33 | - </view> | ||
| 34 | - <view class="page-body-buttons"> | ||
| 35 | - <view class="page-body-button" @click="playVoice"> | ||
| 36 | - <image src="../../../static/play.png"></image> | ||
| 37 | - </view> | ||
| 38 | - <view class="page-body-button" @click="clear"> | ||
| 39 | - <image src="../../../static/trash.png"></image> | ||
| 40 | - </view> | ||
| 41 | - </view> | ||
| 42 | - </block> | ||
| 43 | - <block v-if="hasRecord === true && playing === true"> | ||
| 44 | - <view class="page-body-time"> | ||
| 45 | - <text class="time-big">{{formatedPlayTime}}</text> | ||
| 46 | - <text class="time-small">{{formatedRecordTime}}</text> | ||
| 47 | - </view> | ||
| 48 | - <view class="page-body-buttons"> | ||
| 49 | - <view class="page-body-button" @click="stopVoice"> | ||
| 50 | - <image src="../../../static/stop.png"></image> | ||
| 51 | - </view> | ||
| 52 | - <view class="page-body-button" @click="clear"> | ||
| 53 | - <image src="../../../static/trash.png"></image> | ||
| 54 | - </view> | ||
| 55 | - </view> | ||
| 56 | - </block> | ||
| 57 | - </view> | ||
| 58 | - </view> | ||
| 59 | -</template> | ||
| 60 | -<script> | ||
| 61 | - // #ifdef APP-PLUS | ||
| 62 | - import permision from "@/common/permission.js" | ||
| 63 | - // #endif | ||
| 64 | - import * as util from '../../../common/util.js' | ||
| 65 | - var playTimeInterval = null; | ||
| 66 | - var recordTimeInterval = null; | ||
| 67 | - var recorderManager = null; | ||
| 68 | - var music = null; | ||
| 69 | - export default { | ||
| 70 | - data() { | ||
| 71 | - return { | ||
| 72 | - title: 'start/stopRecord、play/stopVoice', | ||
| 73 | - recording: false, //录音中 | ||
| 74 | - playing: false, //播放中 | ||
| 75 | - hasRecord: false, //是否有了一个 | ||
| 76 | - tempFilePath: '', | ||
| 77 | - recordTime: 0, | ||
| 78 | - playTime: 0, | ||
| 79 | - formatedRecordTime: '00:00:00', //录音的总时间 | ||
| 80 | - formatedPlayTime: '00:00:00' //播放录音的当前时间 | ||
| 81 | - } | ||
| 82 | - }, | ||
| 83 | - onUnload: function() { | ||
| 84 | - this.end(); | ||
| 85 | - }, | ||
| 86 | - onLoad: function() { | ||
| 87 | - music = uni.createInnerAudioContext(); | ||
| 88 | - music.onEnded(() => { | ||
| 89 | - clearInterval(playTimeInterval) | ||
| 90 | - var playTime = 0 | ||
| 91 | - console.log('play voice finished') | ||
| 92 | - this.playing = false; | ||
| 93 | - this.formatedPlayTime = util.formatTime(playTime); | ||
| 94 | - this.playTime = playTime; | ||
| 95 | - }); | ||
| 96 | - recorderManager = uni.getRecorderManager(); | ||
| 97 | - recorderManager.onStart(() => { | ||
| 98 | - console.log('recorder start'); | ||
| 99 | - | ||
| 100 | - this.recording = true; | ||
| 101 | - recordTimeInterval = setInterval(() => { | ||
| 102 | - this.recordTime += 1; | ||
| 103 | - this.formatedRecordTime = util.formatTime(this.recordTime); | ||
| 104 | - }, 1000) | ||
| 105 | - }); | ||
| 106 | - recorderManager.onStop((res) => { | ||
| 107 | - console.log('on stop'); | ||
| 108 | - music.src = res.tempFilePath; | ||
| 109 | - | ||
| 110 | - this.hasRecord = true; | ||
| 111 | - this.recording = false; | ||
| 112 | - }); | ||
| 113 | - recorderManager.onError(() => { | ||
| 114 | - console.log('recorder onError'); | ||
| 115 | - }); | ||
| 116 | - }, | ||
| 117 | - methods: { | ||
| 118 | - async startRecord() { //开始录音 | ||
| 119 | - // #ifdef APP-PLUS | ||
| 120 | - let status = await this.checkPermission(); | ||
| 121 | - if (status !== 1) { | ||
| 122 | - return; | ||
| 123 | - } | ||
| 124 | - // #endif | ||
| 125 | - | ||
| 126 | - // TODO ios 在没有请求过权限之前无法得知是否有相关权限，这种状态下需要直接调用录音，但没有状态或回调判断用户拒绝 | ||
| 127 | - recorderManager.start({ | ||
| 128 | - format: 'mp3' | ||
| 129 | - }); | ||
| 130 | - }, | ||
| 131 | - stopRecord() { //停止录音 | ||
| 132 | - recorderManager.stop(); | ||
| 133 | - clearInterval(recordTimeInterval); | ||
| 134 | - }, | ||
| 135 | - playVoice() { | ||
| 136 | - console.log('play voice'); | ||
| 137 | - this.playing = true; | ||
| 138 | - playTimeInterval = setInterval(() => { | ||
| 139 | - this.playTime += 1; | ||
| 140 | - this.formatedPlayTime = util.formatTime(this.playTime); | ||
| 141 | - }, 1000) | ||
| 142 | - music.play(); | ||
| 143 | - }, | ||
| 144 | - stopVoice() { | ||
| 145 | - clearInterval(playTimeInterval) | ||
| 146 | - this.playing = false; | ||
| 147 | - this.formatedPlayTime = util.formatTime(0); | ||
| 148 | - this.playTime = 0; | ||
| 149 | - music.stop(); | ||
| 150 | - }, | ||
| 151 | - end() { | ||
| 152 | - music.stop(); | ||
| 153 | - recorderManager.stop(); | ||
| 154 | - clearInterval(recordTimeInterval) | ||
| 155 | - clearInterval(playTimeInterval); | ||
| 156 | - this.recording = false, this.playing = false, this.hasRecord = false; | ||
| 157 | - this.playTime = 0, this.recordTime = 0; | ||
| 158 | - this.formatedRecordTime = "00:00:00", this.formatedRecordTime = "00:00:00"; | ||
| 159 | - }, | ||
| 160 | - clear() { | ||
| 161 | - this.end(); | ||
| 162 | - } | ||
| 163 | - // #ifdef APP-PLUS | ||
| 164 | - , | ||
| 165 | - async checkPermission() { | ||
| 166 | - let status = permision.isIOS ? await permision.requestIOS('record') : | ||
| 167 | - await permision.requestAndroid('android.permission.RECORD_AUDIO'); | ||
| 168 | - | ||
| 169 | - if (status === null || status === 1) { | ||
| 170 | - status = 1; | ||
| 171 | - } else if (status === 2) { | ||
| 172 | - uni.showModal({ | ||
| 173 | - content: "系统麦克风已关闭", | ||
| 174 | - confirmText: "确定", | ||
| 175 | - showCancel: false, | ||
| 176 | - success: function(res) { | ||
| 177 | - } | ||
| 178 | - }) | ||
| 179 | - } else { | ||
| 180 | - uni.showModal({ | ||
| 181 | - content: "需要麦克风权限", | ||
| 182 | - confirmText: "设置", | ||
| 183 | - success: function(res) { | ||
| 184 | - if (res.confirm) { | ||
| 185 | - permision.gotoAppSetting(); | ||
| 186 | - } | ||
| 187 | - } | ||
| 188 | - }) | ||
| 189 | - } | ||
| 190 | - return status; | ||
| 191 | - } | ||
| 192 | - // #endif | ||
| 193 | - } | ||
| 194 | - } | ||
| 195 | -</script> | ||
| 196 | - | ||
| 197 | -<style> | ||
| 198 | - image { | ||
| 199 | - width: 150rpx; | ||
| 200 | - height: 150rpx; | ||
| 201 | - } | ||
| 202 | - | ||
| 203 | - .page-body-wrapper { | ||
| 204 | - justify-content: space-between; | ||
| 205 | - flex-grow: 1; | ||
| 206 | - margin-bottom: 300rpx; | ||
| 207 | - } | ||
| 208 | - | ||
| 209 | - .page-body-time { | ||
| 210 | - display: flex; | ||
| 211 | - flex-direction: column; | ||
| 212 | - align-items: center; | ||
| 213 | - } | ||
| 214 | - | ||
| 215 | - .time-big { | ||
| 216 | - font-size: 60rpx; | ||
| 217 | - margin: 20rpx; | ||
| 218 | - } | ||
| 219 | - | ||
| 220 | - .time-small { | ||
| 221 | - font-size: 30rpx; | ||
| 222 | - } | ||
| 223 | - | ||
| 224 | - .page-body-buttons { | ||
| 225 | - margin-top: 60rpx; | ||
| 226 | - display: flex; | ||
| 227 | - justify-content: space-around; | ||
| 228 | - } | ||
| 229 | - | ||
| 230 | - .page-body-button { | ||
| 231 | - width: 250rpx; | ||
| 232 | - text-align: center; | ||
| 233 | - } | ||
| 234 | - | ||
| 235 | - .button-stop-record { | ||
| 236 | - width: 110rpx; | ||
| 237 | - height: 110rpx; | ||
| 238 | - border: 20rpx solid #fff; | ||
| 239 | - background-color: #f55c23; | ||
| 240 | - border-radius: 130rpx; | ||
| 241 | - margin: 0 auto; | ||
| 242 | - } | ||
| 243 | -</style> |
pages/API/websocket-global/websocket-global.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head title="websocket通讯示例"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-btn-v"> | ||
| 6 | - <view class="websocket-msg">{{showMsg}}</view> | ||
| 7 | - <button type="primary" @click="connect">连接websocket服务</button> | ||
| 8 | - <button v-show="connected" type="primary" @click="send">发送一条消息</button> | ||
| 9 | - <button type="primary" @click="close">断开websocket服务</button> | ||
| 10 | - <view class="websocket-tips">发送消息后会收到一条服务器返回的消息（与发送的消息内容一致）</view> | ||
| 11 | - </view> | ||
| 12 | - </view> | ||
| 13 | - </view> | ||
| 14 | -</template> | ||
| 15 | - | ||
| 16 | -<script> | ||
| 17 | - let platform = uni.getSystemInfoSync().platform | ||
| 18 | - export default { | ||
| 19 | - data() { | ||
| 20 | - return { | ||
| 21 | - connected: false, | ||
| 22 | - connecting: false, | ||
| 23 | - msg: false, | ||
| 24 | - roomId: '' | ||
| 25 | - } | ||
| 26 | - }, | ||
| 27 | - computed: { | ||
| 28 | - showMsg() { | ||
| 29 | - if (this.connected) { | ||
| 30 | - if (this.msg) { | ||
| 31 | - return '收到消息：' + this.msg | ||
| 32 | - } else { | ||
| 33 | - return '等待接收消息' | ||
| 34 | - } | ||
| 35 | - } else { | ||
| 36 | - return '尚未连接' | ||
| 37 | - } | ||
| 38 | - } | ||
| 39 | - }, | ||
| 40 | - onUnload() { | ||
| 41 | - uni.closeSocket() | ||
| 42 | - uni.hideLoading() | ||
| 43 | - }, | ||
| 44 | - methods: { | ||
| 45 | - connect() { | ||
| 46 | - if (this.connected || this.connecting) { | ||
| 47 | - uni.showModal({ | ||
| 48 | - content: '正在连接或者已经连接，请勿重复连接', | ||
| 49 | - showCancel: false | ||
| 50 | - }) | ||
| 51 | - return false | ||
| 52 | - } | ||
| 53 | - this.connecting = true | ||
| 54 | - uni.showLoading({ | ||
| 55 | - title: '连接中...' | ||
| 56 | - }) | ||
| 57 | - uni.connectSocket({ | ||
| 58 | - url: 'wss://echo.websocket.org', | ||
| 59 | - data() { | ||
| 60 | - return { | ||
| 61 | - msg: 'Hello' | ||
| 62 | - } | ||
| 63 | - }, | ||
| 64 | - // #ifdef MP | ||
| 65 | - header: { | ||
| 66 | - 'content-type': 'application/json' | ||
| 67 | - }, | ||
| 68 | - // #endif | ||
| 69 | - // #ifdef MP-WEIXIN | ||
| 70 | - method: 'GET', | ||
| 71 | - // #endif | ||
| 72 | - success(res) { | ||
| 73 | - // 这里是接口调用成功的回调，不是连接成功的回调，请注意 | ||
| 74 | - }, | ||
| 75 | - fail(err) { | ||
| 76 | - // 这里是接口调用失败的回调，不是连接失败的回调，请注意 | ||
| 77 | - } | ||
| 78 | - }) | ||
| 79 | - uni.onSocketOpen((res) => { | ||
| 80 | - this.connecting = false | ||
| 81 | - this.connected = true | ||
| 82 | - uni.hideLoading() | ||
| 83 | - uni.showToast({ | ||
| 84 | - icon: 'none', | ||
| 85 | - title: '连接成功' | ||
| 86 | - }) | ||
| 87 | - console.log('onOpen', res); | ||
| 88 | - }) | ||
| 89 | - uni.onSocketError((err) => { | ||
| 90 | - this.connecting = false | ||
| 91 | - this.connected = false | ||
| 92 | - uni.hideLoading() | ||
| 93 | - uni.showModal({ | ||
| 94 | - content: '连接失败，可能是websocket服务不可用，请稍后再试', | ||
| 95 | - showCancel: false | ||
| 96 | - }) | ||
| 97 | - console.log('onError', err); | ||
| 98 | - }) | ||
| 99 | - uni.onSocketMessage((res) => { | ||
| 100 | - this.msg = res.data | ||
| 101 | - console.log('onMessage', res) | ||
| 102 | - }) | ||
| 103 | - uni.onSocketClose((res) => { | ||
| 104 | - this.connected = false | ||
| 105 | - this.startRecive = false | ||
| 106 | - this.msg = false | ||
| 107 | - console.log('onClose', res) | ||
| 108 | - }) | ||
| 109 | - }, | ||
| 110 | - send() { | ||
| 111 | - uni.sendSocketMessage({ | ||
| 112 | - data: 'from ' + platform + ' : ' + parseInt(Math.random() * 10000).toString(), | ||
| 113 | - success(res) { | ||
| 114 | - console.log(res); | ||
| 115 | - }, | ||
| 116 | - fail(err) { | ||
| 117 | - console.log(err); | ||
| 118 | - } | ||
| 119 | - }) | ||
| 120 | - }, | ||
| 121 | - close() { | ||
| 122 | - uni.closeSocket() | ||
| 123 | - } | ||
| 124 | - } | ||
| 125 | - } | ||
| 126 | -</script> | ||
| 127 | - | ||
| 128 | -<style> | ||
| 129 | - .uni-btn-v { | ||
| 130 | - padding: 10rpx 0; | ||
| 131 | - } | ||
| 132 | - | ||
| 133 | - .uni-btn-v button { | ||
| 134 | - margin: 20rpx 0; | ||
| 135 | - } | ||
| 136 | - | ||
| 137 | - .websocket-room { | ||
| 138 | - height: 40px; | ||
| 139 | - line-height: 40px; | ||
| 140 | - text-align: center; | ||
| 141 | - border-bottom: solid 1px #DDDDDD; | ||
| 142 | - margin-bottom: 20px; | ||
| 143 | - } | ||
| 144 | - | ||
| 145 | - .websocket-msg { | ||
| 146 | - padding: 40px 0px; | ||
| 147 | - text-align: center; | ||
| 148 | - font-size: 14px; | ||
| 149 | - line-height: 40px; | ||
| 150 | - color: #666666; | ||
| 151 | - } | ||
| 152 | - | ||
| 153 | - .websocket-tips{ | ||
| 154 | - padding: 40px 0px; | ||
| 155 | - text-align: center; | ||
| 156 | - font-size: 14px; | ||
| 157 | - line-height: 24px; | ||
| 158 | - color: #666666; | ||
| 159 | - } | ||
| 160 | -</style> |
pages/API/websocket-socketTask/websocket-socketTask.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head title="websocket通讯示例"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-btn-v"> | ||
| 6 | - <view class="websocket-msg">{{showMsg}}</view> | ||
| 7 | - <button type="primary" @click="connect">连接websocket服务</button> | ||
| 8 | - <button v-show="connected" type="primary" @click="send">发送一条消息</button> | ||
| 9 | - <button type="primary" @click="close">断开websocket服务</button> | ||
| 10 | - <view class="websocket-tips">发送消息后会收到一条服务器返回的消息（与发送的消息内容一致）</view> | ||
| 11 | - </view> | ||
| 12 | - </view> | ||
| 13 | - </view> | ||
| 14 | -</template> | ||
| 15 | - | ||
| 16 | -<script> | ||
| 17 | - let platform = uni.getSystemInfoSync().platform | ||
| 18 | - export default { | ||
| 19 | - data() { | ||
| 20 | - return { | ||
| 21 | - connected: false, | ||
| 22 | - connecting: false, | ||
| 23 | - socketTask: false, | ||
| 24 | - msg: false, | ||
| 25 | - } | ||
| 26 | - }, | ||
| 27 | - computed: { | ||
| 28 | - showMsg() { | ||
| 29 | - if (this.connected) { | ||
| 30 | - if (this.msg) { | ||
| 31 | - return '收到消息：' + this.msg | ||
| 32 | - } else { | ||
| 33 | - return '等待接收消息' | ||
| 34 | - } | ||
| 35 | - } else { | ||
| 36 | - return '尚未连接' | ||
| 37 | - } | ||
| 38 | - } | ||
| 39 | - }, | ||
| 40 | - onUnload() { | ||
| 41 | - uni.hideLoading() | ||
| 42 | - if (this.socketTask && this.socketTask.close) { | ||
| 43 | - this.socketTask.close() | ||
| 44 | - } | ||
| 45 | - }, | ||
| 46 | - methods: { | ||
| 47 | - connect() { | ||
| 48 | - if (this.connected || this.connecting) { | ||
| 49 | - uni.showModal({ | ||
| 50 | - content: '正在连接或者已经连接，请勿重复连接', | ||
| 51 | - showCancel: false | ||
| 52 | - }) | ||
| 53 | - return false | ||
| 54 | - } | ||
| 55 | - this.connecting = true | ||
| 56 | - uni.showLoading({ | ||
| 57 | - title: '连接中...' | ||
| 58 | - }) | ||
| 59 | - this.socketTask = uni.connectSocket({ | ||
| 60 | - url: 'wss://echo.websocket.org', | ||
| 61 | - data() { | ||
| 62 | - return { | ||
| 63 | - msg: 'Hello' | ||
| 64 | - } | ||
| 65 | - }, | ||
| 66 | - // #ifdef MP | ||
| 67 | - header: { | ||
| 68 | - 'content-type': 'application/json' | ||
| 69 | - }, | ||
| 70 | - // #endif | ||
| 71 | - // #ifdef MP-WEIXIN | ||
| 72 | - method: 'GET', | ||
| 73 | - // #endif | ||
| 74 | - success(res) { | ||
| 75 | - // 这里是接口调用成功的回调，不是连接成功的回调，请注意 | ||
| 76 | - }, | ||
| 77 | - fail(err) { | ||
| 78 | - // 这里是接口调用失败的回调，不是连接失败的回调，请注意 | ||
| 79 | - } | ||
| 80 | - }) | ||
| 81 | - console.log(this.socketTask); | ||
| 82 | - this.socketTask.onOpen((res) => { | ||
| 83 | - this.connecting = false | ||
| 84 | - this.connected = true | ||
| 85 | - uni.hideLoading() | ||
| 86 | - uni.showToast({ | ||
| 87 | - icon: 'none', | ||
| 88 | - title: '连接成功' | ||
| 89 | - }) | ||
| 90 | - console.log('onOpen', res); | ||
| 91 | - }) | ||
| 92 | - this.socketTask.onError((err) => { | ||
| 93 | - this.connecting = false | ||
| 94 | - this.connected = false | ||
| 95 | - uni.hideLoading() | ||
| 96 | - uni.showModal({ | ||
| 97 | - content: '连接失败，可能是websocket服务不可用，请稍后再试', | ||
| 98 | - showCancel: false | ||
| 99 | - }) | ||
| 100 | - console.log('onError', err); | ||
| 101 | - }) | ||
| 102 | - this.socketTask.onMessage((res) => { | ||
| 103 | - this.msg = res.data | ||
| 104 | - console.log('onMessage', res) | ||
| 105 | - }) | ||
| 106 | - this.socketTask.onClose((res) => { | ||
| 107 | - this.connected = false | ||
| 108 | - this.startRecive = false | ||
| 109 | - this.socketTask = false | ||
| 110 | - this.msg = false | ||
| 111 | - console.log('onClose', res) | ||
| 112 | - }) | ||
| 113 | - console.log('task', this.socketTask) | ||
| 114 | - }, | ||
| 115 | - send() { | ||
| 116 | - this.socketTask.send({ | ||
| 117 | - data: 'from ' + platform + ' : ' + parseInt(Math.random() * 10000).toString(), | ||
| 118 | - success(res) { | ||
| 119 | - console.log(res); | ||
| 120 | - }, | ||
| 121 | - fail(err) { | ||
| 122 | - console.log(err); | ||
| 123 | - } | ||
| 124 | - }) | ||
| 125 | - }, | ||
| 126 | - close() { | ||
| 127 | - if (this.socketTask && this.socketTask.close) { | ||
| 128 | - this.socketTask.close() | ||
| 129 | - } | ||
| 130 | - } | ||
| 131 | - } | ||
| 132 | - } | ||
| 133 | -</script> | ||
| 134 | - | ||
| 135 | -<style> | ||
| 136 | - | ||
| 137 | - .uni-btn-v { | ||
| 138 | - padding: 10rpx 0; | ||
| 139 | - } | ||
| 140 | - | ||
| 141 | - .uni-btn-v button { | ||
| 142 | - margin: 20rpx 0; | ||
| 143 | - } | ||
| 144 | - | ||
| 145 | - .websocket-msg { | ||
| 146 | - padding: 40px 0px; | ||
| 147 | - text-align: center; | ||
| 148 | - font-size: 14px; | ||
| 149 | - line-height: 40px; | ||
| 150 | - color: #666666; | ||
| 151 | - } | ||
| 152 | - | ||
| 153 | - .websocket-tips{ | ||
| 154 | - padding: 40px 0px; | ||
| 155 | - text-align: center; | ||
| 156 | - font-size: 14px; | ||
| 157 | - line-height: 24px; | ||
| 158 | - color: #666666; | ||
| 159 | - } | ||
| 160 | -</style> |
pages/component/ad/ad.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="ad-view"> | ||
| 5 | - <ad adpid="1111111111" :unit-id="unitId" type="feed" @load="adload" @error="aderror"/> | ||
| 6 | - <!-- #ifdef APP-PLUS --> | ||
| 7 | - <view class="ad-tips" v-if="!isLoad"> | ||
| 8 | - <text>{{adMessage}}</text> | ||
| 9 | - </view> | ||
| 10 | - <!-- #endif --> | ||
| 11 | - <!-- #ifndef APP-PLUS --> | ||
| 12 | - <view class="ad-tips"> | ||
| 13 | - <text>小程序端的广告ID由小程序平台提供</text> | ||
| 14 | - </view> | ||
| 15 | - <!-- #endif --> | ||
| 16 | - </view> | ||
| 17 | - <view class="tips"> | ||
| 18 | - <text class="tips-text">本示例页面仅演示ad组件。另点此可体验</text><text class="tips-hl" @click="gotoapi">激励视频API</text><text class="tips-text">。</text> | ||
| 19 | - </view> | ||
| 20 | - </view> | ||
| 21 | -</template> | ||
| 22 | - | ||
| 23 | -<script> | ||
| 24 | - export default { | ||
| 25 | - data() { | ||
| 26 | - return { | ||
| 27 | - title: 'AD组件', | ||
| 28 | - unitId: '', | ||
| 29 | - isLoad: false, | ||
| 30 | - adMessage: "广告加载中..." | ||
| 31 | - } | ||
| 32 | - }, | ||
| 33 | - onLoad() { | ||
| 34 | - // #ifdef MP-WEIXIN | ||
| 35 | - this.unitId = ''; | ||
| 36 | - // #endif | ||
| 37 | - // #ifdef MP-TOUTIAO | ||
| 38 | - this.unitId = '' | ||
| 39 | - // #endif | ||
| 40 | - // #ifdef MP-QQ | ||
| 41 | - this.unitId = '' | ||
| 42 | - // #endif | ||
| 43 | - }, | ||
| 44 | - methods: { | ||
| 45 | - adload() { | ||
| 46 | - this.isLoad = true; | ||
| 47 | - }, | ||
| 48 | - aderror(e) { | ||
| 49 | - this.adMessage = e.detail.errMsg; | ||
| 50 | - }, | ||
| 51 | - gotoapi() { | ||
| 52 | - uni.navigateTo({ | ||
| 53 | - url: "/pages/API/rewarded-video-ad/rewarded-video-ad" | ||
| 54 | - }) | ||
| 55 | - } | ||
| 56 | - } | ||
| 57 | - } | ||
| 58 | -</script> | ||
| 59 | - | ||
| 60 | -<style> | ||
| 61 | - .content { | ||
| 62 | - background-color: #DBDBDB; | ||
| 63 | - padding: 10px; | ||
| 64 | - } | ||
| 65 | - | ||
| 66 | - .ad-view { | ||
| 67 | - background-color: #FFFFFF; | ||
| 68 | - margin-bottom: 10px; | ||
| 69 | - } | ||
| 70 | - | ||
| 71 | - .ad-tips { | ||
| 72 | - color: #999; | ||
| 73 | - padding: 30px 0; | ||
| 74 | - text-align: center; | ||
| 75 | - } | ||
| 76 | - | ||
| 77 | - .tips { | ||
| 78 | - margin-top: 30px; | ||
| 79 | - text-align: center; | ||
| 80 | - line-height: 42px; | ||
| 81 | - } | ||
| 82 | - | ||
| 83 | - .tips-text { | ||
| 84 | - color: #444; | ||
| 85 | - } | ||
| 86 | - | ||
| 87 | - .tips-hl { | ||
| 88 | - color: #007AFF; | ||
| 89 | - margin-left: 1px; | ||
| 90 | - } | ||
| 91 | -</style> |
pages/component/audio/audio.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head title="audio"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-center"> | ||
| 6 | - <audio style="text-align: left" :src="current.src" :poster="current.poster" :name="current.name" :author="current.author" | ||
| 7 | - :action="audioAction" controls></audio> | ||
| 8 | - <view class="">audio组件不再维护，建议使用能力更强的uni.createInnerAudioContext()</view> | ||
| 9 | - </view> | ||
| 10 | - </view> | ||
| 11 | - </view> | ||
| 12 | -</template> | ||
| 13 | -<script> | ||
| 14 | - export default { | ||
| 15 | - data() { | ||
| 16 | - return { | ||
| 17 | - current: { | ||
| 18 | - poster: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/c517b410-5184-11eb-b997-9918a5dda011.jpeg', | ||
| 19 | - name: '致爱丽丝', | ||
| 20 | - author: '暂无', | ||
| 21 | - src: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3', | ||
| 22 | - }, | ||
| 23 | - audioAction: { | ||
| 24 | - method: 'pause' | ||
| 25 | - } | ||
| 26 | - } | ||
| 27 | - } | ||
| 28 | - } | ||
| 29 | -</script> | ||
| 30 | \ No newline at end of file | 0 | \ No newline at end of file |
pages/component/button/button.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <button type="primary">页面主操作 Normal</button> | ||
| 6 | - <button type="primary" :loading="loading">页面主操作 Loading</button> | ||
| 7 | - <button type="primary" disabled="true">页面主操作 Disabled</button> | ||
| 8 | - | ||
| 9 | - <button type="default">页面次要操作 Normal</button> | ||
| 10 | - <button type="default" disabled="true">页面次要操作 Disabled</button> | ||
| 11 | - | ||
| 12 | - <button type="warn">警告类操作 Normal</button> | ||
| 13 | - <button type="warn" disabled="true">警告类操作 Disabled</button> | ||
| 14 | - | ||
| 15 | - <view class="button-sp-area"> | ||
| 16 | - <button type="primary" plain="true">按钮</button> | ||
| 17 | - <button type="primary" disabled="true" plain="true">不可点击的按钮</button> | ||
| 18 | - | ||
| 19 | - <button type="default" plain="true">按钮</button> | ||
| 20 | - <button type="default" disabled="true" plain="true">按钮</button> | ||
| 21 | - | ||
| 22 | - <button class="mini-btn" type="primary" size="mini">按钮</button> | ||
| 23 | - <button class="mini-btn" type="default" size="mini">按钮</button> | ||
| 24 | - <button class="mini-btn" type="warn" size="mini">按钮</button> | ||
| 25 | - </view> | ||
| 26 | - <!-- #ifdef MP-WEIXIN || MP-QQ || MP-JD --> | ||
| 27 | - <button open-type="launchApp" app-parameter="uni-app" @error="openTypeError">打开APP</button> | ||
| 28 | - <button open-type="feedback">意见反馈</button> | ||
| 29 | - <!-- #endif --> | ||
| 30 | - </view> | ||
| 31 | - </view> | ||
| 32 | -</template> | ||
| 33 | -<script> | ||
| 34 | - export default { | ||
| 35 | - data() { | ||
| 36 | - return { | ||
| 37 | - title: 'button', | ||
| 38 | - loading: false | ||
| 39 | - } | ||
| 40 | - }, | ||
| 41 | - onLoad() { | ||
| 42 | - this._timer = null; | ||
| 43 | - }, | ||
| 44 | - onShow() { | ||
| 45 | - this.clearTimer(); | ||
| 46 | - this._timer = setTimeout(() => { | ||
| 47 | - this.loading = true; | ||
| 48 | - }, 300) | ||
| 49 | - }, | ||
| 50 | - onUnload() { | ||
| 51 | - this.clearTimer(); | ||
| 52 | - this.loading = false; | ||
| 53 | - }, | ||
| 54 | - methods: { | ||
| 55 | - openTypeError(error) { | ||
| 56 | - console.error('open-type error:', error); | ||
| 57 | - }, | ||
| 58 | - clearTimer() { | ||
| 59 | - if (this._timer != null) { | ||
| 60 | - clearTimeout(this._timer); | ||
| 61 | - } | ||
| 62 | - } | ||
| 63 | - } | ||
| 64 | - } | ||
| 65 | -</script> | ||
| 66 | - | ||
| 67 | -<style> | ||
| 68 | - button { | ||
| 69 | - margin-top: 30rpx; | ||
| 70 | - margin-bottom: 30rpx; | ||
| 71 | - } | ||
| 72 | - | ||
| 73 | - .button-sp-area { | ||
| 74 | - margin: 0 auto; | ||
| 75 | - width: 60%; | ||
| 76 | - } | ||
| 77 | - | ||
| 78 | - .mini-btn { | ||
| 79 | - margin-right: 10rpx; | ||
| 80 | - } | ||
| 81 | -</style> |
pages/component/canvas/canvas.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="page-body"> | ||
| 5 | - <view class="page-body-wrapper"> | ||
| 6 | - <!-- #ifdef APP-PLUS || H5 --> | ||
| 7 | - <canvas canvas-id="canvas" class="canvas" :start="startStatus" :change:start="animate.start" | ||
| 8 | - :data-width="canvasWidth" :data-height="canvasWidth"></canvas> | ||
| 9 | - <!-- #endif --> | ||
| 10 | - <!-- #ifndef APP-PLUS || H5 --> | ||
| 11 | - <canvas canvas-id="canvas" id="canvas" class="canvas"></canvas> | ||
| 12 | - <!-- #endif --> | ||
| 13 | - </view> | ||
| 14 | - </view> | ||
| 15 | - </view> | ||
| 16 | -</template> | ||
| 17 | - | ||
| 18 | -<script module="animate" lang="renderjs"> | ||
| 19 | - function Ball({ | ||
| 20 | - x, | ||
| 21 | - y, | ||
| 22 | - vx, | ||
| 23 | - vy, | ||
| 24 | - canvasWidth, | ||
| 25 | - canvasHeight, | ||
| 26 | - ctx | ||
| 27 | - }) { | ||
| 28 | - this.canvasWidth = canvasWidth | ||
| 29 | - this.canvasHeight = canvasHeight | ||
| 30 | - this.ctx = ctx | ||
| 31 | - this.x = x | ||
| 32 | - this.y = y | ||
| 33 | - this.vx = vx | ||
| 34 | - this.vy = vy | ||
| 35 | - this.radius = 5 | ||
| 36 | - } | ||
| 37 | - | ||
| 38 | - Ball.prototype.draw = function() { | ||
| 39 | - this.ctx.beginPath() | ||
| 40 | - this.ctx.fillStyle = '#007AFF' | ||
| 41 | - this.ctx.arc(this.x, this.y, this.radius, 0, 2 * Math.PI) | ||
| 42 | - this.ctx.closePath() | ||
| 43 | - this.ctx.fill() | ||
| 44 | - } | ||
| 45 | - | ||
| 46 | - Ball.prototype.move = function() { | ||
| 47 | - this.x += this.vx | ||
| 48 | - this.y += this.vy | ||
| 49 | - // 回到中心 | ||
| 50 | - // if (getDistance(this.x - this.canvasWidth / 2, this.y - this.canvasHeight / 2) > | ||
| 51 | - // getDistance(this.canvasWidth / 2, this.canvasHeight / 2) + this.radius) { | ||
| 52 | - // this.x = this.canvasWidth / 2 | ||
| 53 | - // this.y = this.canvasHeight / 2 | ||
| 54 | - // } | ||
| 55 | - | ||
| 56 | - // 边框反弹 | ||
| 57 | - if (this.x < this.radius) { | ||
| 58 | - this.vx = Math.abs(this.vx) | ||
| 59 | - return | ||
| 60 | - } | ||
| 61 | - if (this.x > this.canvasWidth - this.radius) { | ||
| 62 | - this.vx = -Math.abs(this.vx) | ||
| 63 | - } | ||
| 64 | - if (this.y < this.radius) { | ||
| 65 | - this.vy = Math.abs(this.vy) | ||
| 66 | - return | ||
| 67 | - } | ||
| 68 | - if (this.y > this.canvasWidth - this.radius) { | ||
| 69 | - this.vy = -Math.abs(this.vy) | ||
| 70 | - } | ||
| 71 | - } | ||
| 72 | - | ||
| 73 | - function getDistance(x, y) { | ||
| 74 | - return Math.pow(Math.pow(x, 2) + Math.pow(y, 2), 0.5) | ||
| 75 | - } | ||
| 76 | - | ||
| 77 | - export default { | ||
| 78 | - methods: { | ||
| 79 | - start(newVal, oldVal, owner, ins) { | ||
| 80 | - let canvasWidth = ins.getDataset().width, | ||
| 81 | - canvasHeight = ins.getDataset().height, | ||
| 82 | - canvasEle = document.querySelectorAll('.canvas>canvas')[0], | ||
| 83 | - ctx = canvasEle.getContext('2d'), | ||
| 84 | - speed = 3, | ||
| 85 | - ballList = [], | ||
| 86 | - layer = 3, | ||
| 87 | - ballInlayer = 20 | ||
| 88 | - for (let i = 0; i < layer; i++) { | ||
| 89 | - let radius = getDistance(canvasWidth / 2, canvasHeight / 2) / layer * i | ||
| 90 | - for (let j = 0; j < ballInlayer; j++) { | ||
| 91 | - let deg = j * 2 * Math.PI / ballInlayer, | ||
| 92 | - sin = Math.sin(deg), | ||
| 93 | - cos = Math.cos(deg), | ||
| 94 | - x = radius * cos + canvasWidth / 2, | ||
| 95 | - y = radius * sin + canvasHeight / 2, | ||
| 96 | - vx = speed * cos, | ||
| 97 | - vy = speed * sin | ||
| 98 | - ballList.push(new Ball({ | ||
| 99 | - x, | ||
| 100 | - y, | ||
| 101 | - vx, | ||
| 102 | - vy, | ||
| 103 | - canvasWidth, | ||
| 104 | - canvasHeight, | ||
| 105 | - ctx, | ||
| 106 | - radius: 5 | ||
| 107 | - })) | ||
| 108 | - } | ||
| 109 | - } | ||
| 110 | - | ||
| 111 | - function animate(ballList) { | ||
| 112 | - ctx.clearRect(0, 0, canvasEle.width, canvasEle.height) | ||
| 113 | - ballList.forEach(function(item) { | ||
| 114 | - item.move() | ||
| 115 | - item.draw() | ||
| 116 | - }) | ||
| 117 | - requestAnimationFrame(function() { | ||
| 118 | - animate(ballList) | ||
| 119 | - }) | ||
| 120 | - } | ||
| 121 | - animate(ballList) | ||
| 122 | - } | ||
| 123 | - } | ||
| 124 | - } | ||
| 125 | -</script> | ||
| 126 | - | ||
| 127 | -<script> | ||
| 128 | - // #ifndef APP-PLUS || H5 | ||
| 129 | - | ||
| 130 | - let ctx = null, | ||
| 131 | - interval = null; | ||
| 132 | - | ||
| 133 | - function Ball(x, y, vx, vy, canvasWidth, canvasHeight, ctx) { | ||
| 134 | - this.canvasWidth = canvasWidth | ||
| 135 | - this.canvasHeight = canvasHeight | ||
| 136 | - this.ctx = ctx | ||
| 137 | - this.x = x | ||
| 138 | - this.y = y | ||
| 139 | - this.vx = vx | ||
| 140 | - this.vy = vy | ||
| 141 | - this.radius = 5 | ||
| 142 | - } | ||
| 143 | - | ||
| 144 | - Ball.prototype.draw = function() { | ||
| 145 | - this.ctx.setFillStyle('#007AFF') | ||
| 146 | - this.ctx.beginPath() | ||
| 147 | - this.ctx.arc(this.x, this.y, this.radius, 0, 2 * Math.PI) | ||
| 148 | - this.ctx.closePath() | ||
| 149 | - this.ctx.fill() | ||
| 150 | - } | ||
| 151 | - | ||
| 152 | - Ball.prototype.move = function() { | ||
| 153 | - this.x += this.vx | ||
| 154 | - this.y += this.vy | ||
| 155 | - // 回到中心 | ||
| 156 | - // if (getDistance(this.x - this.canvasWidth / 2, this.y - this.canvasHeight / 2) > | ||
| 157 | - // getDistance(this.canvasWidth / 2, this.canvasHeight / 2) + this.radius) { | ||
| 158 | - // this.x = this.canvasWidth / 2 | ||
| 159 | - // this.y = this.canvasHeight / 2 | ||
| 160 | - // } | ||
| 161 | - | ||
| 162 | - // 边框反弹 | ||
| 163 | - if (this.x < this.radius) { | ||
| 164 | - this.vx = Math.abs(this.vx) | ||
| 165 | - return | ||
| 166 | - } | ||
| 167 | - if (this.x > this.canvasWidth - this.radius) { | ||
| 168 | - this.vx = -Math.abs(this.vx) | ||
| 169 | - } | ||
| 170 | - if (this.y < this.radius) { | ||
| 171 | - this.vy = Math.abs(this.vy) | ||
| 172 | - return | ||
| 173 | - } | ||
| 174 | - if (this.y > this.canvasWidth - this.radius) { | ||
| 175 | - this.vy = -Math.abs(this.vy) | ||
| 176 | - } | ||
| 177 | - } | ||
| 178 | - | ||
| 179 | - function getDistance(x, y) { | ||
| 180 | - return Math.pow(Math.pow(x, 2) + Math.pow(y, 2), 0.5) | ||
| 181 | - } | ||
| 182 | - | ||
| 183 | - // #endif | ||
| 184 | - | ||
| 185 | - export default { | ||
| 186 | - data() { | ||
| 187 | - return { | ||
| 188 | - title: 'canvas', | ||
| 189 | - canvasWidth: 0, | ||
| 190 | - startStatus: false, | ||
| 191 | - ballList: [] | ||
| 192 | - } | ||
| 193 | - }, | ||
| 194 | - onReady: function() { | ||
| 195 | - this.$nextTick(() => { | ||
| 196 | - uni.createSelectorQuery().select(".canvas").boundingClientRect(data => { | ||
| 197 | - this.canvasWidth = data.width | ||
| 198 | - // #ifdef APP-PLUS || H5 | ||
| 199 | - this.startStatus = true | ||
| 200 | - // #endif | ||
| 201 | - // #ifndef APP-PLUS || H5 | ||
| 202 | - ctx = uni.createCanvasContext('canvas') | ||
| 203 | - this.drawBall() | ||
| 204 | - // #endif | ||
| 205 | - }).exec() | ||
| 206 | - }) | ||
| 207 | - }, | ||
| 208 | - // #ifndef APP-PLUS || H5 | ||
| 209 | - onUnload: function() { | ||
| 210 | - clearInterval(interval); | ||
| 211 | - }, | ||
| 212 | - methods: { | ||
| 213 | - drawBall: function() { | ||
| 214 | - let canvasWidth = this.canvasWidth, | ||
| 215 | - canvasHeight = this.canvasWidth, | ||
| 216 | - speed = 3, | ||
| 217 | - ballList = [], | ||
| 218 | - layer = 3, | ||
| 219 | - ballInlayer = 20 | ||
| 220 | - for (let i = 0; i < layer; i++) { | ||
| 221 | - let radius = getDistance(canvasWidth / 2, canvasHeight / 2) / layer * i | ||
| 222 | - for (let j = 0; j < ballInlayer; j++) { | ||
| 223 | - let deg = j * 2 * Math.PI / ballInlayer, | ||
| 224 | - sin = Math.sin(deg), | ||
| 225 | - cos = Math.cos(deg), | ||
| 226 | - x = radius * cos + canvasWidth / 2, | ||
| 227 | - y = radius * sin + canvasHeight / 2, | ||
| 228 | - vx = speed * cos, | ||
| 229 | - vy = speed * sin | ||
| 230 | - ballList.push(new Ball(x, y, vx, vy, canvasWidth, canvasHeight, ctx)) | ||
| 231 | - } | ||
| 232 | - } | ||
| 233 | - | ||
| 234 | - function animate(ballList) { | ||
| 235 | - // ctx.clearRect(0, 0, canvasWidth, canvasHeight) | ||
| 236 | - ballList.forEach(function(item) { | ||
| 237 | - item.move() | ||
| 238 | - item.draw() | ||
| 239 | - }) | ||
| 240 | - ctx.draw() | ||
| 241 | - } | ||
| 242 | - | ||
| 243 | - interval = setInterval(function() { | ||
| 244 | - animate(ballList) | ||
| 245 | - }, 17) | ||
| 246 | - } | ||
| 247 | - } | ||
| 248 | - // #endif | ||
| 249 | - } | ||
| 250 | -</script> | ||
| 251 | - | ||
| 252 | -<style> | ||
| 253 | - .page-body-wrapper { | ||
| 254 | - text-align: center; | ||
| 255 | - } | ||
| 256 | - | ||
| 257 | - .canvas { | ||
| 258 | - width: 610rpx; | ||
| 259 | - height: 610rpx; | ||
| 260 | - margin: auto; | ||
| 261 | - background-color: #fff; | ||
| 262 | - } | ||
| 263 | -</style> |
pages/component/checkbox/checkbox.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-title uni-common-mt">默认样式</view> | ||
| 6 | - <view> | ||
| 7 | - <checkbox-group> | ||
| 8 | - <label> | ||
| 9 | - <checkbox value="cb1" checked="true" />选中 | ||
| 10 | - </label> | ||
| 11 | - <label> | ||
| 12 | - <checkbox value="cb" />未选中 | ||
| 13 | - </label> | ||
| 14 | - </checkbox-group> | ||
| 15 | - </view> | ||
| 16 | - <view class="uni-title uni-common-mt">不同颜色和尺寸的checkbox</view> | ||
| 17 | - <view> | ||
| 18 | - <checkbox-group> | ||
| 19 | - <label> | ||
| 20 | - <checkbox value="cb1" checked="true" color="#FFCC33" style="transform:scale(0.7)" />选中 | ||
| 21 | - </label> | ||
| 22 | - <label> | ||
| 23 | - <checkbox value="cb" color="#FFCC33" style="transform:scale(0.7)" />未选中 | ||
| 24 | - </label> | ||
| 25 | - </checkbox-group> | ||
| 26 | - </view> | ||
| 27 | - </view> | ||
| 28 | - | ||
| 29 | - <view class="uni-padding-wrap"> | ||
| 30 | - <view class="uni-title uni-common-mt"> | ||
| 31 | - 推荐展示样式 | ||
| 32 | - <text>\n使用 uni-list 布局</text> | ||
| 33 | - </view> | ||
| 34 | - </view> | ||
| 35 | - <view class="uni-list"> | ||
| 36 | - <checkbox-group @change="checkboxChange"> | ||
| 37 | - <label class="uni-list-cell uni-list-cell-pd" v-for="item in items" :key="item.value"> | ||
| 38 | - <view> | ||
| 39 | - <checkbox :value="item.value" :checked="item.checked" /> | ||
| 40 | - </view> | ||
| 41 | - <view>{{item.name}}</view> | ||
| 42 | - </label> | ||
| 43 | - </checkbox-group> | ||
| 44 | - </view> | ||
| 45 | - </view> | ||
| 46 | -</template> | ||
| 47 | -<script> | ||
| 48 | - export default { | ||
| 49 | - data() { | ||
| 50 | - return { | ||
| 51 | - title: 'checkbox 复选框', | ||
| 52 | - items: [{ | ||
| 53 | - value: 'USA', | ||
| 54 | - name: '美国' | ||
| 55 | - }, | ||
| 56 | - { | ||
| 57 | - value: 'CHN', | ||
| 58 | - name: '中国', | ||
| 59 | - checked: 'true' | ||
| 60 | - }, | ||
| 61 | - { | ||
| 62 | - value: 'BRA', | ||
| 63 | - name: '巴西' | ||
| 64 | - }, | ||
| 65 | - { | ||
| 66 | - value: 'JPN', | ||
| 67 | - name: '日本' | ||
| 68 | - }, | ||
| 69 | - { | ||
| 70 | - value: 'ENG', | ||
| 71 | - name: '英国' | ||
| 72 | - }, | ||
| 73 | - { | ||
| 74 | - value: 'FRA', | ||
| 75 | - name: '法国' | ||
| 76 | - } | ||
| 77 | - ] | ||
| 78 | - } | ||
| 79 | - }, | ||
| 80 | - methods: { | ||
| 81 | - checkboxChange: function (e) { | ||
| 82 | - var items = this.items, | ||
| 83 | - values = e.detail.value; | ||
| 84 | - for (var i = 0, lenI = items.length; i < lenI; ++i) { | ||
| 85 | - const item = items[i] | ||
| 86 | - if(values.indexOf(item.value) >= 0){ | ||
| 87 | - this.$set(item,'checked',true) | ||
| 88 | - }else{ | ||
| 89 | - this.$set(item,'checked',false) | ||
| 90 | - } | ||
| 91 | - } | ||
| 92 | - } | ||
| 93 | - } | ||
| 94 | - } | ||
| 95 | -</script> | ||
| 96 | - | ||
| 97 | -<style> | ||
| 98 | -.uni-list-cell { | ||
| 99 | - justify-content: flex-start | ||
| 100 | -} | ||
| 101 | -</style> |
pages/component/cover-view/cover-view.nvue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <video ref="video" id="myVideo" class="video" :src="src" controls="true"> | ||
| 4 | - <cover-view class="coverview" style="overflow-y: scroll;"> | ||
| 5 | - <text class="text">{{ '\uEA06\uEA0E\uEA0C\uEA0A 我是可以滚动的cover-view 我是可以滚动的cover-view 我是可以滚动的cover-view 我是可以滚动的cover-view 我是可以滚动的cover-view 我是可以滚动的cover-view 我是可以滚动的cover-view 我是可以滚动的cover-view 我是可以滚动的cover-view' }}</text> | ||
| 6 | - </cover-view> | ||
| 7 | - </video> | ||
| 8 | - </view> | ||
| 9 | -</template> | ||
| 10 | - | ||
| 11 | -<script> | ||
| 12 | - export default { | ||
| 13 | - data() { | ||
| 14 | - return { | ||
| 15 | - title: 'cover-view', | ||
| 16 | - src: "https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20181126-lite.m4v" | ||
| 17 | - } | ||
| 18 | - }, | ||
| 19 | - onLoad() { | ||
| 20 | - }, | ||
| 21 | - methods: { | ||
| 22 | - } | ||
| 23 | - } | ||
| 24 | -</script> | ||
| 25 | - | ||
| 26 | -<style> | ||
| 27 | - .content { | ||
| 28 | - text-align: center; | ||
| 29 | - height: 400rpx; | ||
| 30 | - } | ||
| 31 | - | ||
| 32 | - .logo { | ||
| 33 | - height: 200rpx; | ||
| 34 | - width: 200rpx; | ||
| 35 | - margin-top: 200rpx; | ||
| 36 | - } | ||
| 37 | - | ||
| 38 | - .title { | ||
| 39 | - font-size: 36rpx; | ||
| 40 | - color: #8f8f94; | ||
| 41 | - } | ||
| 42 | - | ||
| 43 | - .text { | ||
| 44 | - color: #4CD964; | ||
| 45 | - font-family: unincomponents; | ||
| 46 | - } | ||
| 47 | - | ||
| 48 | - .video { | ||
| 49 | - width: 750rpx; | ||
| 50 | - height: 400rpx; | ||
| 51 | - background-color: #808080; | ||
| 52 | - } | ||
| 53 | - | ||
| 54 | - .coverview { | ||
| 55 | - position: absolute; | ||
| 56 | - left: 0; | ||
| 57 | - right: 0; | ||
| 58 | - top: 0rpx; | ||
| 59 | - height: 150rpx; | ||
| 60 | - border-width: 10rpx; | ||
| 61 | - border-color: #4CD964; | ||
| 62 | - } | ||
| 63 | -</style> |
pages/component/cover-view/cover-view.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head title="cover-view用于覆盖map、video等原生组件"></page-head> | ||
| 4 | - <view class="cover-content" v-if="showMap"> | ||
| 5 | - <!-- TODO暂时条件编译解决支付宝小程序不能正常显示 cover-x --> | ||
| 6 | - <!-- #ifdef APP-PLUS --> | ||
| 7 | - <map> | ||
| 8 | - <cover-view class="cover-view">简单的cover-view</cover-view> | ||
| 9 | - <cover-image class="cover-image" src="/static/uni.png"></cover-image> | ||
| 10 | - </map> | ||
| 11 | - <!-- #endif --> | ||
| 12 | - | ||
| 13 | - <!-- #ifndef APP-PLUS --> | ||
| 14 | - <!-- #ifndef MP-QQ --> | ||
| 15 | - <map></map> | ||
| 16 | - <!-- #endif --> | ||
| 17 | - | ||
| 18 | - <!-- TODO QQ暂不支持地图组件 --> | ||
| 19 | - <!-- #ifdef MP-QQ --> | ||
| 20 | - <video class="video" src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20181126-lite.m4v"></video> | ||
| 21 | - <!-- #endif --> | ||
| 22 | - | ||
| 23 | - <cover-view class="cover-view">简单的cover-view</cover-view> | ||
| 24 | - <!-- #ifndef MP-QQ --> | ||
| 25 | - <cover-image class="cover-image" src="/static/uni.png"></cover-image> | ||
| 26 | - <!-- #endif --> | ||
| 27 | - <!-- #endif --> | ||
| 28 | - </view> | ||
| 29 | - </view> | ||
| 30 | -</template> | ||
| 31 | - | ||
| 32 | -<script> | ||
| 33 | - export default { | ||
| 34 | - data() { | ||
| 35 | - return { | ||
| 36 | - showMap: false | ||
| 37 | - }; | ||
| 38 | - }, | ||
| 39 | - onLoad() { | ||
| 40 | - // #ifdef APP-PLUS || MP-BAIDU | ||
| 41 | - setTimeout(()=>{ | ||
| 42 | - this.showMap = true | ||
| 43 | - },350) | ||
| 44 | - // #endif | ||
| 45 | - // #ifndef APP-PLUS || MP-BAIDU | ||
| 46 | - this.showMap = true | ||
| 47 | - // #endif | ||
| 48 | - } | ||
| 49 | - } | ||
| 50 | -</script> | ||
| 51 | - | ||
| 52 | -<style> | ||
| 53 | - map { | ||
| 54 | - width: 750rpx; | ||
| 55 | - width: 100%; | ||
| 56 | - height: 600px; | ||
| 57 | - } | ||
| 58 | - | ||
| 59 | - .video { | ||
| 60 | - width: 100%; | ||
| 61 | - } | ||
| 62 | - | ||
| 63 | - .cover-content { | ||
| 64 | - position: relative; | ||
| 65 | - } | ||
| 66 | - | ||
| 67 | - .cover-view { | ||
| 68 | - position: absolute; | ||
| 69 | - left: 5px; | ||
| 70 | - top: 5px; | ||
| 71 | - width: 375rpx; | ||
| 72 | - text-align: center; | ||
| 73 | - background-color: #DDDDDD; | ||
| 74 | - } | ||
| 75 | - | ||
| 76 | - .cover-image { | ||
| 77 | - position: absolute; | ||
| 78 | - left: 0; | ||
| 79 | - top: 0; | ||
| 80 | - right: 0; | ||
| 81 | - bottom: 0; | ||
| 82 | - margin: auto; | ||
| 83 | - width: 96px; | ||
| 84 | - height: 96px; | ||
| 85 | - } | ||
| 86 | -</style> |
pages/component/editor/editor-icon.css deleted
| 1 | -@font-face { | ||
| 2 | - font-family: 'iconfont'; | ||
| 3 | - src: url('data:font/truetype;charset=utf-8;base64,AAEAAAANAIAAAwBQRkZUTYZt980AACuYAAAAHEdERUYAKQBBAAAreAAAAB5PUy8yPJdOmAAAAVgAAABWY21hcLyvuFAAAAJMAAACGmdhc3D//wADAAArcAAAAAhnbHlm1+PZcgAABOAAACD0aGVhZBRVFL8AAADcAAAANmhoZWEISgQAAAABFAAAACRobXR4TS8LYAAAAbAAAACcbG9jYQhHD/wAAARoAAAAeG1heHABTgChAAABOAAAACBuYW1lKeYRVQAAJdQAAAKIcG9zdLoCe30AAChcAAADEgABAAAAAQAAUo9exF8PPPUACwQAAAAAANhk6GIAAAAA2GToYgAA/34EbAOAAAAACAACAAAAAAAAAAEAAAOA/4AAXARsAAAAAARsAAEAAAAAAAAAAAAAAAAAAAATAAEAAAA7AJUACQAAAAAAAgAAAAoACgAAAP8AAAAAAAAAAQQBAZAABQAAAokCzAAAAI8CiQLMAAAB6wAyAQgAAAIABQMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAUGZFZABA5ifspQOA/4AAXAOAAIIAAAABAAAAAAAABAAAAAAAAAABVQAABAAALwQAAJ0EAAAeBAAAQARsAAAEAAACBAAANwQAADcEAACVBAAAmgQAAJoEAAA+BAAAQAQAACUEAQAABAAAQAAnAIAAgABgAIAAgACAAIAAeAAAAFAAMABgAEAAYAAgAEAAOQAgAGAAYACAAD8AYAAgAEAA1wBeACEAwACAAOAAogBgABoAIQBgADIAiwBAAAAAAwAAAAMAAAAcAAEAAAAAARQAAwABAAAAHAAEAPgAAAA6ACAABAAa5ifmK+Yx5jPmPuZN5mDmZOZu5njmfuaE5ujm/ecs513n+Ohg6GXpZOso7AnsE+x87JTsnuyg7KX//wAA5ifmK+Yx5jPmPuZN5l/mZOZt5njmfuaE5ujm/ecs51zn+Ohg6GPpZOso7AnsE+x67H/snuyg7KX//xncGdkZ1BnTGckZuxmqGacZnxmWGZEZjBkpGRUY5xi4GB4Xtxe1FrcU9BQUFAsTpROjE5oTmROVAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABBgAAAQAAAAAAAAABAgAAAAIAAAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGgB8ANIA7AGaAiwCugNGBCAEgATiBRgFfgXyBl4GfAbGBwAHOAeWB7wH5ggoCGgI5AlSCaIKIgqmCxILPAtKC64L+gw8DIQMpgzKDQYNKA1GDaAN4g4MDlIObA6gDs4O6g8MD2APpA/GD+gQHhB6AAEAL/+AA8ADgAAJAAABNQkBNQQCFyYSAkABgP6A/r1YYdeEAoj4/oD+gP4G/rCo+QIEAAACAJ0ACANqAtQAKwA9AAAlIS4BJxE+ATchHgEXFQ4BIiY9AS4BJyEOAQcRHgEzITI2NzU0NjIWFxUOASUiLwEmNDYyHwEBNjIWFAcBBgL2/hsxQQICQTEB6y4+AgESGxIBGhP+FRYdAQEdFgHlFh0BEhsSAQJB/qoNCqMKFBkKjQFgChkUCv6KCggBQTEB5jBCAQE+Lx4NEhINHhQZAQEdFf4aFh0dFvkOEhIO+TFBnwqjChoTCY0BYAoUGQr+iQkAAAAABAAeAEoD4gJoAA8AGwAnADAAAAEGBAcmJC8BNzYkNxYEHwElDgEHHgEXPgE3LgEDLgEnPgE3HgEXDgEnDgEUFjI2NCYD0Ar+/sTE/v4LERELAQLExAECChL+Ho3WKirWjY3WKirWjTpNAQFNOjpNAQFNOh8qKj4qKgFEFtUPD9UWFRUX1Q4O1RcVzgeVMjKUCAiUMjKV/qwCTzw8UAEBUDw8T9cBK0ArK0ArAAEAQP+AA9EDgAAJAAAFNgIlFQkBFQQSAvphWP69/oABgAGNhICoAVAG/gGAAYD4C/38AAAIAAD/gARsA4AAHwArAEAATABVAGIAaAB1AAAFIikBLgEnET4BNzMVIyIGHQEhNS4BKwE1Mx4BFxEOARMiKQERFBYzITI2NwEwDwEGDwEjNzEuASc+ATceARcUBycOARQWMj8BNjcuAQUGDwE1NzMRIwEuASc1PgEyFh0BFAYlMjMhFSEHLgE9ATQ2MhYdARQGBAA5/m/+Ni49AQE9LlFRFx8EAAEeF1FRLj0BAT0IQP5A/gAfFwOUFx4B/uUCAgUGhTpiM0UBAUUzNEQBDmscJiY5FAkJAQEm/q0FIylTNDYCAAsPAQEPFw8P/aMi7AEN/eU1DA8PFw8PgAE9LgLXLj0BNh8Xa2sXHzYBPS79KS49AqH9yhcfHxcBIAMDCQjSoAJMOTlMAgJMOSIcjwEuRC4YEBIWIi4VBCAkQ1D+UgKGAQ8LogsQEAuiCw+GNlEBDwuiCxAQC6ILDwADAAL/fgPvA3AAKwBNAGcAAAEjNS4BJyMOAQcVIw4BBxUUFhcDHgE3ITUzFjI3MxYyNzMWNjcRPgE9AS4BAyM1NCYiBh0BIzU0JiIGBxUjNS4BIgYdASMiJicRIREUBhMUBiMhIiYnNT4BMyE1PgE3Mx4BFxUhMhYVA3/fAS8kpyQvAeAvPwEeGgEKYAYBMxUEBwO2AwcEhQZgCRoeAT+DVBAYEIwQGA8BiwEPGBBUJC8BAw4vZyAY/PIXIAEBIBcBGAEvIzgkLwEBFxggAnSoIzABATAjqAE/MDcgMg/+hlEjBAEBAQEBBCNQAXoPMiA3MD/9SN4MEBAM3t4MEBAM398MEBAM3ywoAU/+sScsAhIYICAYNxggqCMwAQEwI6ggGAAABQA3/8ED2gNPABEAIAAzAEQAXwAAASIjISYnJj4BMyEyFxYOASMGAzI7AR4BBwYHIS4BNzYzBSIjJSInJjY3NjMlIR4BFAYHIxUyOwEWFxYGBwYjBS4BNDYzATQmIg8BNTQmIgYdAScmIgYUFzEXFjI/ATE2ApxL0v7jHQgEBxgOAwQhCAQGGBBnZzlQiRcWBwke/LkXFwYIIAIjRs3+7RwJBAYKDQ8BcAFvFBYWFLwuJVQcCQQGCgwP/TcTFhYSAjQVHwotFB8ULQogFAlrCiEKawkB0AEZDBcOGgwXDgEBgAEeFBgBARwUG+YBGQwWBwkBARUiFAHoARgMFwcIAQEUIhX+2g8UCzKpDxQUD6kyCxQdCnYMDHYKAAAFADf/wQPaA00AEQAgADMARABeAAAlIiMhJicmPgE3ITIXFg4BIwYDMjsBHgEHBiMhIiY3NjcFIiMhJicmNjc2NykBMhYUBisBFTIzFxYXFgYHBgchIiY0NjMBMScmIg8BMQYUFjI/ARUUFjI2PQEXFjI2NAKcS9L+4x0IBAcYDgMEIQgEBhgQZ2c5UIkXFgcJHvy5FxcGCCACI0bN/u0cCQQGCg0PAXABbxQWFhS8LiVUHAkEBgoMD/03ExYWEgIrawohCmsJFCAKLRQfFC0KHxVbARkNFw0BGg0WDgEBgAEeFRgdFBoB5gEYDBcHCAEVIhXoAQEYCxcHCAEVIRUCv3cLC3cKHRQMMagPFBQPqDEMFB0AAAAACQCV/4EDawN+AB8ALwA9AE4AWgBrAHcAiACUAAABIzUuAScjLgEiBgcjDgEHFSMiBhURFBYXIT4BNRE0JiUzMjY3PgEyFhceATsBFSEBIREzFR4BMyEyNjc1MwUHJyYiBhQfARYyPwE2NCYiFyIGFBYzITI2NCYjBQcnJiIGFB8BFjI/ATY0JiIFIQ4BFBYzITI2NCYFBycmIgYUHwEWMj8BNjQmIgUhIgYUFhchPgE0JgNZVQEKB4IJPVQ9CYIHCgFVCAoKCAKyCAoK/b9/BwoBAyxALAMBCgd//kACJ/1yQwEKBwHkBwoBQ/4zSiEFDwoFLQYOBlYFCw5WBwoKBwEpBwoKB/58SiEFDwoFLQYOBlYFCw4Bf/7XBwoKBwEpBwoK/nVKIQUPCgUtBg4GVgULDgF//tcHCgoHASkHCgoC4TEHCgEoMjIoAQoHMQoI/MQHCgEBCgcDPAgKHwkIICkpIAgJbf0SAxg8CAoKCDzCSiEFCg8FLgUFVwUOCysKDwsLDwqlSSEFCw4GLQUFVgYOCysBCg8KCg8KpEohBgsPBS4FBVcFDgsrCg8KAQEKDwoAAAMAmv+AAzMDTQAXADQAPQAAJScmIgYUHwEhDgEUFhchBwYUFjI/ATY0ESEOAQceARczFRQWMjY1ETMRHgEyNjcRMzI2NCYBIy4BJz4BNzMDEmYIFBAIOv4kCg8PCgHcOggPFQhmCP5MV3MCAnNXNA4WD5kBDhYOAYAKDw/+djRBVwEBV0E0EmcHEBQIOgEOFg4BOggVDwhmCBQDQwJ0V1d0AuYLDw8LAk39swsPDwsCTQ4WD/6ZAldBQVcCAAAAAAMAmv+AAzMDTQAcACUAPQAAASEOAQceARczFRQWMjY1ETMRHgEyNjcRMzI2NCYBIy4BJz4BNzMBITc2LgEiDwEGFB8BFjI2NC8BIT4BNCYDGv5MV3MCAnNXNA4WD5kBDhYOAYAKDw/+djRBVwEBV0E0AUz+JToIAQ8UCGYICGYIFQ8IOgHbCw8PA00CdFdXdALmCw4OCwJN/bMLDg4LAk0OFg/+mQJXQUFXAv0AOggUEAdnCBQIZggPFQg6AQ4WDgAAAAADAD7/vgPCA0IADwAXABsAAAEhDgEHER4BFyE+ATcRLgEDJyMHIxMzEwEDMwMDUv1cL0ABAUAvAqQvQAEBQM82+DZn4m7i/uZevl0DQgFAL/1cL0ABAUAvAqQvQPzuqKgCav2WAfr+5wEZAAADAEAAAAPAAsAAFgAjAD8AAAEzPgE0JichDgEUFhczBwMGHgE2NxM2AT4BNyEeARQGByEuASUnJiIGFB8BBwYUFjI/ARcWMjY0LwE3NjQmIgcBtMwbJCQb/gAbJCQbuQEtBB02KgUtAv6IASQbAYAbJCQb/oAbJAK/VxMxJRJXVxIlMRNXVxMxJRJXVxIlMRMCQAEkNiQBASQ2JAEH/tgfMQsiHwEoEf4QGyQBASQ2JAEBJPJXEiUxE1dXEzElEldXEiUxE1dXEzElEgACACX/yQPbAzcABwBLAAABAxcWMzI3JgE3PgQ3GwEzFhcTHgEXHgEXFhceARcWHQEiJiMiBiM0PwI2PwE+ATU0Ji8BJQ4BFB4CHwEWFRQHIiYjIgYjBgHDYU47IAsWMv4rAQ0mGx0WB4egSQUCdRNTFwkxEQsJC04JAySRJSufFgJbCAYDBgQCIxcY/v4OOhAiFRYXAQEhhSIEFQIuAkH+/gEBAZH9+i0EBwULFhIBYAGeCAT+7i3NNhR+IRoHCBEDFgsPCQgYFBQCAgIFAgcFCVw3OgEhnhoSCgYCAgsWBQsMBQgAAAAABQAAABIEAAM3AA0AHQAtAD0ATQAAExEUBiIvASY0PwE2MhYBFRQGIyEiJj0BNDYzITIWNRUUBiMhIiY9ATQ2MyEyFjUVFAYjISImPQE0NjMhMhY1FRQGIyEiJj0BNDYzITIW2woQBaUFBaUFEAoDJQsH/CQHCwsHA9wHCwsH/ZIHCwsHAm4HCwsH/ZIHCwsHAm4HCwsH/CQHCwsHA9wHCwJJ/rcHCwWkBhAFpAUK/kFtCAsLCG0ICwvUbgcLCwduBwsL1G4HCwsHbggKCtRuCAoKCG4HCwsAAgBA/4ADwAMAAAcADwAAEyEVIxEjESMBIxEjESM1IUABgICAgAOA/Ij8AoABgID+gAGAAYD9AAMAgAAAAwAn/88D2QMxABgAHAAsAAA3MzI2PwEhFx4BOwE+AScDJicjIgYHAwYWATMXIwEhIgYHFR4BMyEyNjc1LgHNUQkPAz8BCEUDDwlRCwsE7AcTjAkPA9kECwEqElWyAhj8igwRAQERDAN2DBEBARG7DQmvrwkNAQ8KAkkSAQoJ/bcKDwH/xf5PEQ07DBERDDsNEQAAAAIAgACAA4AC1QALACQAABMzETMRMxEjESMRIykBIiY0PwE2NCYiBhUjPgE3HgEXFAYPASGAVatVVatVAwD/ACMyF88ZMkYyVQFhSElgAhsXzgEAAtX/AAEA/asBAP8AMkYX4BhHMjIjSGEBAWFIJD0Y3QAAAgCAAIADgALVAAsAJwAAEzMRMxEzESMRIxEjATMyFhURFAYrASImPQEzFTM1IzUzNSMVIzU0NoBVq1VVq1UCAKsjMjIjqyMyVaurq6tVMgLV/wABAP2rAQD/AAJVMiP+VSMyMiMrK6tVqysrIzIAAAIAYAAgA6EC4AAjAD0AAAEhBgcVFhczNjc1MxEjBgcVFhchNjc1JicjETMVFhczNjc1JgEjETMyNi8BJg8BBhY7AREjIgYfARY/ATYmAoj94AcBAQc4BwGoXAcBAQcBCAcBAQdcqAEHOAcBAQEKQUEEBAJlBgZkAwQEQUEEBANkBgZkAwQC4AEHgAcBAQdA/dABBzgHAQEHOAcBAjBABwEBB4AH/d8BhAgEfwYGfwQI/nwIBH8GBn8ECAAAAgCAAIADVQLVAAsAFgAAEzMRMxEzESMRIxEjITUzEQc1NzMRMxWAVatVVatVAdVWa2tVVQLV/wABAP2rAQD/AFUBnj5jPf4AVQAAAAMAgACAA4AC1QALABYAGQAAEzMRMxEzESMRIxEjITUjNRMzETMVIxUDNQeAVatVVatVAoDV1VUrK1VtAtX/AAEA/asBAP8A1VYBKv7WVtUBK5iYAAIAgACAA4AC1QALACsAABMzETMRMxEjESMRIwEzFSMVMx4BFw4BByMuASc1MxUzPgE0JicjLgEnNT4BgFWrVVWrVQIA1dVVSWACAmBJVSQwAVVVJDExJFUkMAEBMALV/wABAP2rAQD/AAJVVasBYUhJYAIBMCQrKwExSDABATAkqyQwAAMAgACAA4AC1QALACQAKAAAEzMRMxEzESMRIxEjATMeARcVIzUjFTMeARcVDgEHIy4BJxE+ARMVMzWAVatVVatVAgCrJDABVaurJDABATAkqyQwAQEwJKsC1f8AAQD9qwEA/wACVQEwJCsrqwEwJKskMAEBMCQBqyQw/qyrqwAAAgB4/6IDiQNeAC8AVgAAJSY1Ji8BJiIGFB8BITc2NCYiDwEOAR0BFBYfARYyPgEvASEHBhQWMj8CPgE1NyYBPgE9ASERIyIGFBY7ATI2NCYrAREhFRQWMjY9ATQmIyEiBh0BFBYDiAEBA2YFDgoFSf1jSQUKDgVmAgICAmYFDQoBBUkCnUkFCg4FZwEBAgEB/UUHCgERMwgJCQiICAkJCDMBEQoOCgoH/ZoHCgoeAQEDA2YFCg4FSUkFDgoFZwIFAwMCBQJoBAoNBUpKBQ4KBWYCAgQDAgIC2wEJCDP9MwoOCgoOCgLNMwgJCQhEBwoKB0QICQAAAAAFAAAAEgQAAzcADgAeAC4APgBOAAATFA8BBiImNRE0NjIfARYBFRQGIyEiJj0BNDYzITIWNRUUBiMhIiY9ATQ2MyEyFjUVFAYjISImPQE0NjMhMhY1FRQGIyEiJj0BNDYzITIWyQWlBQ8LCw8FpQUDNwsH/CQHCwsHA9wHCwsH/ZIHCwsHAm4HCwsH/ZIHCwsHAm4HCwsH/CQHCwsHA9wHCwGlCAakBQsHAUkICgWkBf7lbQgLCwhtCAsL1G4HCwsHbgcLC9RuBwsLB24ICgrUbggKCghuBwsLAAAABABQ/9ADsAMwABEAFQAZADIAAAkBJiMhDgEHER4BFyE+ATcRNCUzFSMBITUhFyM1NCYjISIGHQEjETMVFBYzITI2PQEzAQOd/v4TGv4iGyQBASQbAuAbJAH9cMDAAcD+QAHAkFASDv4ADhJQUBIOAQAOEk4BAgIbAQITASQb/SAbJAEBJBsB3hrocP2QkJCwDhISDrAC4JAOEhIOkP7+AAYAMP+wA9ADUAAQACEAMgBEAFQAWAAAASMiBh0BFBYyNj0BMzI2NCYhIyIGFBY7ARUUFjI2PQE0JgEjNTQmIgYdARQWOwEyNjQmJSIGHQEjIgYUFjsBMjY9ATQmEyEOAQcRHgEXIT4BNxEuAQERIREBcZEOEhIcEnENExMBk5EOEhIOcRIbExP+U3ESHBISDpENExMBkw4ScQ4SEg6RDRMTcvzgGyQBASQbAyAbJAEBJPzFAyACwBIOig0TEw1qEhwSEhwSag0TEw2KDhL9tmoOEhIOig4SEhwSihIOahIcEhIOig4SAlABJBv84BskAQEkGwMgGyT8oQMg/OAAAAAGAGD/wAOgA0AADwAfADMAPwBLAFcAAAEhDgEHER4BFyE+ATcRLgEDFAYjISImNRE0NjMhMhYVNyEiBhQWMyEyFhURFBYyNjURLgEBISIGFBYzITI2NCYHISIGFBYzITI2NCYHIyIGFBYXMz4BNCYC0P3gIi0BAS0iAiAiLQEBLRIJB/3gBwkJBwIgBwlw/eAOEhIOAiAHCRIcEgEt/u7+wA4SEg4BQA4SEg7+wA4SEg4BQA4SEo7ADhISDsAOEhICwAEtIv2gIi0BAS0iAmAiLf1RBwkJBwJgBwkJB9ASHBIJB/2gDhISDgJgIi3+2RIcEhIcEqASHBISHBKfEhsSAQESGxIAAAAFAED/oAPAA2AAHwAjAC0AOgBHAAABIzU0JiMhIgYdASMiBhQWOwETHgEXIT4BNxMzMjY0JiUhFSEBDgEjISImJwMhAzI2NRE0JiIGFREUFiMyNjURNCYiBhURFBYDoMASDv6ADhLADhISDiJOBDUmAaImNQROIg4SEv2yAUD+wAGRAhEN/l4NEQJNAnzeDhISHBISog4SEhwSEgLwUA4SEg5QEhwS/UUlLwEBLyUCuxIcEjAw/QwMEBAMArT9mxIOAdYNExMN/ioOEhIOAdYNExMN/ioOEgADAGD/wAOmAzcABAAPABMAAAEnAQc3AScjLgEPARc3NjQBIRUhAwib/jQnvwJpgwEEDQWDm4EF/LoDQPzAAfet/lm8DQJMlwUBBXitdwQN/WtAAAABACABQAPgAbAAAwAAEyEVISADwPxAAbBwAAAAAwBA/9UDwgMyAB4AJwA/AAABITY1LgEHDgEdAQ4BByMiBhURHgEzITI2NxM2LgIBETQ7AREjIiYBAw4BIyERPgE3NTY3NhYXFAcGFjMhMhYDWf73EwJUNi4sAUo5dhsoASYcAo0lOAdKBAseKf0QA01NAQIC/0kDFQ7+AE1fAQEiFiwBHAUSEQE0EhcCJ0I0PlcFB0QzOzpTBycc/nsdJi4lAYUXLCQT/fEBhQP+dQIBov57DhEBjhBzTjs5BgExIThUDxscAAADADn/uwPXAycAEwAlACkAAAEuAQ8BFzc2FhcWBg8BFzc+AiYBBiYnJjY/AScHDgEXHgE/AScTFwEnA45U82dlM2RNsz47E0lsMmwwOQ0i/k9Msz86E0lvMm9jGk9V82dpMzcz/qkzAqpjGk9SPlI6E0lMsz9XPlcnanp0/c06E0lMsz9aPlpU82djGk9VPwGBPv7iPQAAAAUAIAAAA+ADAAASABMAHAAgACQAAAE0LwEmDwEGIi8BLgEPAQYVESEDIx4BMjY0JiIGJREhEQMhESEDgAisDAlNBQ0E/QUMBbwFAwBgQAEkNiQkNiT9PwPAQPzAA0ABDQkFaQYJXgUF/AQBBaoFB/73AeAbJCQ2JCSl/QADAP1AAoAAAAkAYAARA6AC7wADAAcACwAMABUAFgAfACAAKQAAASEVIRUhFSEVIRUhAyMeATI2NCYiBhMjHgEyNjQmIgYTIx4BMjY0JiIGASACgP2AAoD9gAKA/YCAQAEkNiQkNiQ/QAEkNiQkNiQ/QAEkNiQkNiQC4GDQYNBgApAbJCQ2JCT+tRskJDYkJP61GyQkNiQkAAQAYAAAA6ADAAADAAcACwAPAAATIRUhESEVIRMhFSERIRUhYANA/MADQPzAgAJA/cACQP3AAwBg/qBgAUBg/qBgAAAABACAAFIDdQLAAAMABwALAA8AABMhESEREzMDKQERIRETMwOAAVX+q5BukAEyAVX+q5BukAGn/qsBVQEZ/uf+qwFVARn+5wAABgA//+ADoAMpAAUADwAbAB8AIwAnAAATMzUjFTMDMwcVMzUjNzUjETMVIxUzFSMVMzUjEyEVIRUhFSEVIRUhYzdbJCNAQIBAQIBJKipJgIDgAoD9gAKA/YACgP2AAmDJN/7AWzc3Wzf+iRI3EjfJAjdg0GDQYAAABABgAAADoAMAAAMABwALAA8AABMhFSERIRUhASEVIREhFSFgA0D8wANA/MABAAJA/cACQP3AAwBg/qBgAUBg/qBgAAACACAARAPUAqAABQALAAAJAjcnNyUHFwcXAQEs/vQBDEjU1AFUSNTUSAEMAqD+0v7SQO7uQEDu7kABLgAHAED/wAPAA0AACwAXABgAIQAiACsAMgAAAQ4BBx4BFz4BNy4BAy4BJz4BNx4BFw4BASMeATI2NCYiBgUjHgEyNjQmIgYFHgEXPgE3AgC+/QUF/b6+/QUF/b6j2QQE2aOj2QQE2f6dQAEkNiQkNiQBv0ABJDYkJDYk/l8Do3p6owMDQAX9vr79BQX9vr79/MUE2aOj2QQE2aOj2QH8GyQkNiQkGxskJDYkJJt6owMDo3oAAAADANf/7QMgAwYAEwAdACYAAAEmJzU+ATc2JzQmJyERITI3Njc0ATMWFxYUBwYrAQEGByM1Mx4BFAMBIUEiLw0YAXZ1/q4BbV0/PwH+OMNCHyAgH0LDATEfQ8/PQz4BQTMRAhAoFS0xX3QB/Oc+PGc+AY8BHyFgICL+yyMC7wFFYQAAAAADAF7/4AOdAyAACwATABcAAAEhIgYUFhchPgE0JiUzNSE1IRUhETMRIwN9/QANEhINAwAOEhL+NXABIP1QASBwcAGKEhsSAQESGxI28HBw/lD+4AAEACEAAAPgA2AABwALAA4AJwAACQEzNyEXMwEDEzMTBQchAw4BFSE1IzY3PgE1NCYjIgcXNjMyFhUUBgE7/uZ8PAEmPHv+56JwAnABc5ABINorOwEgnwkqOylHPXQaXwkhEBUhAwf8+a2tAwf+DgFT/q014AKHIlsxUBAhLzomNkFnDyYVERYqAAAAAAEAwP/AA0ADIAALAAABESERIxEzESERMxEC4P5AYGABwGADIP6AAYD8oAGg/mADYAAAAAACAID/ygOAAyYAEQAdAAAlPgE3ESMRDgEHLgEnESMRHgEFISIGFBYXIT4BNCYCAIWwA3ACcVVVcQJwA7AB5f1ADhISDgLADhISVQOwhQGZ/mdVcQICcVUBmf5nhbBOEhsSAQESGxIAAAEA4P/qAyADKgAbAAABISIGFBYXMwMjIgYUFhchPgE0JisBEzM+ATQmAwD+4A4SEg5g5loOEhIOASAOEhIOXudXDhISAyoSGxIB/UASGxIBARIbEgLAARIbEgAAAgCi/+YDgAMSAAcACgAABTcBIwEzNyElGwEDGWf+vVr+v2ZDAYr+nJ+fGgIDKvzWqGABjv5yAAAEAGAAAAOgAwAAAwAHAAsADwAAEyEVIREhFSERIRUhESEVIWADQPzAA0D8wAJA/cACQP3AAwBg/qBgAUBg/qBgAAAAAAQAGgAvA+4CvwALABcAIwAvAAABAiADDgEXFiA3NiYHBiAnJjQ3NiAXHgEBDgEHHgEXPgE3LgEHIi4BND4BMx4BFAYD0uP+K+QbARvPAgDPGwFLvv5AvgsM0gGW0wsB/lJffwICf19ffwICf58RHhERHhEbJCQBugEF/vsgUCH6+iFQSOTkDiIO8fEOIgEAAn9fX38CAn9fX3/eER4iHhEBJDYkAAAAAAQAIf+5A+ADJwACAAoADgAmAAABIRclATM3IRczAQMTMxMBNjc+ATU0JiMiBxc2MzIWFRQOAhUhNQPA/uCQ/gv+5nw8ASY8e/7nonACcAFkCSo7KUc9dBpfCSEQFSFYOwEgAyDg5/z5ra0DB/4OAVP+rf7UECEvOiY2QWcPJhURFipFWzFQAAAEAGAAAAOgAwAAAwAHAAsADwAAEyEVIREhFSERIRUhESEVIWADQPzAA0D8wANA/MADQPzAAwBg/qBgAUBg/qBgAAAAAAEAMgBGA+ICrwAPAAABNjIWFAcBDgEnASY+ARcBA6sKGhMJ/eYJGQr+rQ4HIg8BPAKlChMaCv3YCQEIASQMJAwM/vEAAQCLABsDZQL1ABoAAAkBNjQmIgcJASYiBhQXCQEGHgE3CQEWMjY0JwInATQKExoK/sz+ywoZFAoBNP7MDQojDQE1ATQKGhMKAYoBNAoaEwn+ywE1CRMaCv7M/ssOIwkMATX+ywkTGgoAAAAAAwBAABgDwALNABEAJgA5AAABNzYWFxEOAS8BIyImNRE0NjMBBiImNDc+ATU0JicmPgEXHgEVFAYXBi4BNz4BNCYnJj4BMhceARQGAQTNDyQBASQP0p8OEhIOAj8KGRMJHyEcHAwLJA0jJStwDSQJDDo9OzcJARMaCUBERwIbpAwRFP2eFBEMqBIOAQgOEv6VCRMaCh5PLChKHg4jCA4nYDQ5ZrMNCSMOO5ellDoKGhIKRKq/rQAAAAAAEgDeAAEAAAAAAAAAFQAsAAEAAAAAAAEACABUAAEAAAAAAAIABwBtAAEAAAAAAAMACACHAAEAAAAAAAQACACiAAEAAAAAAAUACwDDAAEAAAAAAAYACADhAAEAAAAAAAoAKwFCAAEAAAAAAAsAEwGWAAMAAQQJAAAAKgAAAAMAAQQJAAEAEABCAAMAAQQJAAIADgBdAAMAAQQJAAMAEAB1AAMAAQQJAAQAEACQAAMAAQQJAAUAFgCrAAMAAQQJAAYAEADPAAMAAQQJAAoAVgDqAAMAAQQJAAsAJgFuAAoAQwByAGUAYQB0AGUAZAAgAGIAeQAgAGkAYwBvAG4AZgBvAG4AdAAKAAAKQ3JlYXRlZCBieSBpY29uZm9udAoAAGkAYwBvAG4AZgBvAG4AdAAAaWNvbmZvbnQAAFIAZQBnAHUAbABhAHIAAFJlZ3VsYXIAAGkAYwBvAG4AZgBvAG4AdAAAaWNvbmZvbnQAAGkAYwBvAG4AZgBvAG4AdAAAaWNvbmZvbnQAAFYAZQByAHMAaQBvAG4AIAAxAC4AMAAAVmVyc2lvbiAxLjAAAGkAYwBvAG4AZgBvAG4AdAAAaWNvbmZvbnQAAEcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAAcwB2AGcAMgB0AHQAZgAgAGYAcgBvAG0AIABGAG8AbgB0AGUAbABsAG8AIABwAHIAbwBqAGUAYwB0AC4AAEdlbmVyYXRlZCBieSBzdmcydHRmIGZyb20gRm9udGVsbG8gcHJvamVjdC4AAGgAdAB0AHAAOgAvAC8AZgBvAG4AdABlAGwAbABvAC4AYwBvAG0AAGh0dHA6Ly9mb250ZWxsby5jb20AAAIAAAAAAAAACgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAOwAAAAEAAgECAQMBBAEFAQYBBwEIAQkBCgELAQwBDQEOAQ8BEAERARIBEwEUARUBFgEXARgBGQEaARsBHAEdAR4BHwEgASEBIgEjASQBJQEmAScBKAEpASoBKwEsAS0BLgEvATABMQEyATMBNAE1ATYBNwE4ATkEcmVkbwlzZWxlY3RhbGwHcHJldmlldwR1bmRvBGRhdGUHY2xlYXJ1cBU3MjNiaWFuamlxaV9kdWFuaG91anUWNzIyYmlhbmppcWlfZHVhbnFpYW5qdQotY2hlY2tsaXN0DWRpcmVjdGlvbi1sdHINZGlyZWN0aW9uLXJ0bAtmb250Ymdjb2xvcg1jbGVhcmVkZm9ybWF0BGZvbnQHb3V0ZGVudAhmb250c2l6ZQp0ZXh0X2NvbG9yD2Zvcm1hdC1oZWFkZXItMg9mb3JtYXQtaGVhZGVyLTMLbGluZS1oZWlnaHQPZm9ybWF0LWhlYWRlci0xD2Zvcm1hdC1oZWFkZXItNA9mb3JtYXQtaGVhZGVyLTUPZm9ybWF0LWhlYWRlci02EUNoYXJhY3Rlci1TcGFjaW5nBmluZGVudAZiYW9jdW4IcXVhbnBpbmcFZnV6aGkHc2hhbmNodQxiaWFuamlzZWt1YWkJZmVuZ2V4aWFuB2RpYW56YW4MY2hhcnVsaWFuamllC2NoYXJ1dHVwaWFuCnd1eHVwYWlsaWUManV6aG9uZ2R1aXFpB3lpbnlvbmcLeW91eHVwYWlsaWUIeW91ZHVpcWkJeml0aWRhaW1hCHhpYW9saWFuCXppdGlqaWFjdQ96aXRpc2hhbmNodXhpYW4Neml0aXNoYW5nYmlhbwp6aXRpYmlhb3RpDnppdGl4aWFodWF4aWFuCXppdGl4aWV0aQl6aXRpeWFuc2UIenVvZHVpcWkJeml0aXl1bGFuC3ppdGl4aWFiaWFvC3p1b3lvdWR1aXFpB2R1aWdvdXgGZ3VhbmJpDnNoZW5neWluX3NoaXRpAAAAAAAB//8AAgABAAAADAAAABYAAAACAAEAAwA6AAEABAAAAAIAAAAAAAAAAQAAAADVpCcIAAAAANhk6GIAAAAA2GToYg==') format('truetype'); | ||
| 4 | - font-weight: normal; | ||
| 5 | - font-style: normal; | ||
| 6 | - font-display: swap; | ||
| 7 | -} | ||
| 8 | -.iconfont { | ||
| 9 | - font-family: "iconfont" !important; | ||
| 10 | - font-size: 16px; | ||
| 11 | - font-style: normal; | ||
| 12 | - -webkit-font-smoothing: antialiased; | ||
| 13 | - -moz-osx-font-smoothing: grayscale; | ||
| 14 | -} | ||
| 15 | - | ||
| 16 | -.icon-redo:before { | ||
| 17 | - content: "\e627"; | ||
| 18 | -} | ||
| 19 | - | ||
| 20 | -.icon-undo:before { | ||
| 21 | - content: "\e633"; | ||
| 22 | -} | ||
| 23 | - | ||
| 24 | -.icon-indent:before { | ||
| 25 | - content: "\eb28"; | ||
| 26 | -} | ||
| 27 | - | ||
| 28 | -.icon-outdent:before { | ||
| 29 | - content: "\e6e8"; | ||
| 30 | -} | ||
| 31 | - | ||
| 32 | -.icon-fontsize:before { | ||
| 33 | - content: "\e6fd"; | ||
| 34 | -} | ||
| 35 | - | ||
| 36 | -.icon-format-header-1:before { | ||
| 37 | - content: "\e860"; | ||
| 38 | -} | ||
| 39 | - | ||
| 40 | -.icon-format-header-4:before { | ||
| 41 | - content: "\e863"; | ||
| 42 | -} | ||
| 43 | - | ||
| 44 | -.icon-format-header-5:before { | ||
| 45 | - content: "\e864"; | ||
| 46 | -} | ||
| 47 | - | ||
| 48 | -.icon-format-header-6:before { | ||
| 49 | - content: "\e865"; | ||
| 50 | -} | ||
| 51 | - | ||
| 52 | -.icon-clearup:before { | ||
| 53 | - content: "\e64d"; | ||
| 54 | -} | ||
| 55 | - | ||
| 56 | -.icon-preview:before { | ||
| 57 | - content: "\e631"; | ||
| 58 | -} | ||
| 59 | - | ||
| 60 | -.icon-date:before { | ||
| 61 | - content: "\e63e"; | ||
| 62 | -} | ||
| 63 | - | ||
| 64 | -.icon-fontbgcolor:before { | ||
| 65 | - content: "\e678"; | ||
| 66 | -} | ||
| 67 | - | ||
| 68 | -.icon-clearedformat:before { | ||
| 69 | - content: "\e67e"; | ||
| 70 | -} | ||
| 71 | - | ||
| 72 | -.icon-font:before { | ||
| 73 | - content: "\e684"; | ||
| 74 | -} | ||
| 75 | - | ||
| 76 | -.icon-723bianjiqi_duanhouju:before { | ||
| 77 | - content: "\e65f"; | ||
| 78 | -} | ||
| 79 | - | ||
| 80 | -.icon-722bianjiqi_duanqianju:before { | ||
| 81 | - content: "\e660"; | ||
| 82 | -} | ||
| 83 | - | ||
| 84 | -.icon-text_color:before { | ||
| 85 | - content: "\e72c"; | ||
| 86 | -} | ||
| 87 | - | ||
| 88 | -.icon-format-header-2:before { | ||
| 89 | - content: "\e75c"; | ||
| 90 | -} | ||
| 91 | - | ||
| 92 | -.icon-format-header-3:before { | ||
| 93 | - content: "\e75d"; | ||
| 94 | -} | ||
| 95 | - | ||
| 96 | -.icon--checklist:before { | ||
| 97 | - content: "\e664"; | ||
| 98 | -} | ||
| 99 | - | ||
| 100 | -.icon-baocun:before { | ||
| 101 | - content: "\ec09"; | ||
| 102 | -} | ||
| 103 | - | ||
| 104 | -.icon-line-height:before { | ||
| 105 | - content: "\e7f8"; | ||
| 106 | -} | ||
| 107 | - | ||
| 108 | -.icon-quanping:before { | ||
| 109 | - content: "\ec13"; | ||
| 110 | -} | ||
| 111 | - | ||
| 112 | -.icon-direction-rtl:before { | ||
| 113 | - content: "\e66e"; | ||
| 114 | -} | ||
| 115 | - | ||
| 116 | -.icon-direction-ltr:before { | ||
| 117 | - content: "\e66d"; | ||
| 118 | -} | ||
| 119 | - | ||
| 120 | -.icon-selectall:before { | ||
| 121 | - content: "\e62b"; | ||
| 122 | -} | ||
| 123 | - | ||
| 124 | -.icon-fuzhi:before { | ||
| 125 | - content: "\ec7a"; | ||
| 126 | -} | ||
| 127 | - | ||
| 128 | -.icon-shanchu:before { | ||
| 129 | - content: "\ec7b"; | ||
| 130 | -} | ||
| 131 | - | ||
| 132 | -.icon-bianjisekuai:before { | ||
| 133 | - content: "\ec7c"; | ||
| 134 | -} | ||
| 135 | - | ||
| 136 | -.icon-fengexian:before { | ||
| 137 | - content: "\ec7f"; | ||
| 138 | -} | ||
| 139 | - | ||
| 140 | -.icon-dianzan:before { | ||
| 141 | - content: "\ec80"; | ||
| 142 | -} | ||
| 143 | - | ||
| 144 | -.icon-charulianjie:before { | ||
| 145 | - content: "\ec81"; | ||
| 146 | -} | ||
| 147 | - | ||
| 148 | -.icon-charutupian:before { | ||
| 149 | - content: "\ec82"; | ||
| 150 | -} | ||
| 151 | - | ||
| 152 | -.icon-wuxupailie:before { | ||
| 153 | - content: "\ec83"; | ||
| 154 | -} | ||
| 155 | - | ||
| 156 | -.icon-juzhongduiqi:before { | ||
| 157 | - content: "\ec84"; | ||
| 158 | -} | ||
| 159 | - | ||
| 160 | -.icon-yinyong:before { | ||
| 161 | - content: "\ec85"; | ||
| 162 | -} | ||
| 163 | - | ||
| 164 | -.icon-youxupailie:before { | ||
| 165 | - content: "\ec86"; | ||
| 166 | -} | ||
| 167 | - | ||
| 168 | -.icon-youduiqi:before { | ||
| 169 | - content: "\ec87"; | ||
| 170 | -} | ||
| 171 | - | ||
| 172 | -.icon-zitidaima:before { | ||
| 173 | - content: "\ec88"; | ||
| 174 | -} | ||
| 175 | - | ||
| 176 | -.icon-xiaolian:before { | ||
| 177 | - content: "\ec89"; | ||
| 178 | -} | ||
| 179 | - | ||
| 180 | -.icon-zitijiacu:before { | ||
| 181 | - content: "\ec8a"; | ||
| 182 | -} | ||
| 183 | - | ||
| 184 | -.icon-zitishanchuxian:before { | ||
| 185 | - content: "\ec8b"; | ||
| 186 | -} | ||
| 187 | - | ||
| 188 | -.icon-zitishangbiao:before { | ||
| 189 | - content: "\ec8c"; | ||
| 190 | -} | ||
| 191 | - | ||
| 192 | -.icon-zitibiaoti:before { | ||
| 193 | - content: "\ec8d"; | ||
| 194 | -} | ||
| 195 | - | ||
| 196 | -.icon-zitixiahuaxian:before { | ||
| 197 | - content: "\ec8e"; | ||
| 198 | -} | ||
| 199 | - | ||
| 200 | -.icon-zitixieti:before { | ||
| 201 | - content: "\ec8f"; | ||
| 202 | -} | ||
| 203 | - | ||
| 204 | -.icon-zitiyanse:before { | ||
| 205 | - content: "\ec90"; | ||
| 206 | -} | ||
| 207 | - | ||
| 208 | -.icon-zuoduiqi:before { | ||
| 209 | - content: "\ec91"; | ||
| 210 | -} | ||
| 211 | - | ||
| 212 | -.icon-zitiyulan:before { | ||
| 213 | - content: "\ec92"; | ||
| 214 | -} | ||
| 215 | - | ||
| 216 | -.icon-zitixiabiao:before { | ||
| 217 | - content: "\ec93"; | ||
| 218 | -} | ||
| 219 | - | ||
| 220 | -.icon-zuoyouduiqi:before { | ||
| 221 | - content: "\ec94"; | ||
| 222 | -} | ||
| 223 | - | ||
| 224 | -.icon-duigoux:before { | ||
| 225 | - content: "\ec9e"; | ||
| 226 | -} | ||
| 227 | - | ||
| 228 | -.icon-guanbi:before { | ||
| 229 | - content: "\eca0"; | ||
| 230 | -} | ||
| 231 | - | ||
| 232 | -.icon-shengyin_shiti:before { | ||
| 233 | - content: "\eca5"; | ||
| 234 | -} | ||
| 235 | - | ||
| 236 | -.icon-Character-Spacing:before { | ||
| 237 | - content: "\e964"; | ||
| 238 | -} |
pages/component/editor/editor.vue deleted
| 1 | -<template> | ||
| 2 | - <view class="container"> | ||
| 3 | - <view class="page-body"> | ||
| 4 | - <view class='wrapper'> | ||
| 5 | - <view class='toolbar' @tap="format" style="height: 120px;overflow-y: auto;"> | ||
| 6 | - <view :class="formats.bold ? 'ql-active' : ''" class="iconfont icon-zitijiacu" data-name="bold"></view> | ||
| 7 | - <view :class="formats.italic ? 'ql-active' : ''" class="iconfont icon-zitixieti" data-name="italic"></view> | ||
| 8 | - <view :class="formats.underline ? 'ql-active' : ''" class="iconfont icon-zitixiahuaxian" data-name="underline"></view> | ||
| 9 | - <view :class="formats.strike ? 'ql-active' : ''" class="iconfont icon-zitishanchuxian" data-name="strike"></view> | ||
| 10 | - <view :class="formats.align === 'left' ? 'ql-active' : ''" class="iconfont icon-zuoduiqi" data-name="align" | ||
| 11 | - data-value="left"></view> | ||
| 12 | - <view :class="formats.align === 'center' ? 'ql-active' : ''" class="iconfont icon-juzhongduiqi" data-name="align" | ||
| 13 | - data-value="center"></view> | ||
| 14 | - <view :class="formats.align === 'right' ? 'ql-active' : ''" class="iconfont icon-youduiqi" data-name="align" | ||
| 15 | - data-value="right"></view> | ||
| 16 | - <view :class="formats.align === 'justify' ? 'ql-active' : ''" class="iconfont icon-zuoyouduiqi" data-name="align" | ||
| 17 | - data-value="justify"></view> | ||
| 18 | - <view :class="formats.lineHeight ? 'ql-active' : ''" class="iconfont icon-line-height" data-name="lineHeight" | ||
| 19 | - data-value="2"></view> | ||
| 20 | - <view :class="formats.letterSpacing ? 'ql-active' : ''" class="iconfont icon-Character-Spacing" data-name="letterSpacing" | ||
| 21 | - data-value="2em"></view> | ||
| 22 | - <view :class="formats.marginTop ? 'ql-active' : ''" class="iconfont icon-722bianjiqi_duanqianju" data-name="marginTop" | ||
| 23 | - data-value="20px"></view> | ||
| 24 | - <view :class="formats.previewarginBottom ? 'ql-active' : ''" class="iconfont icon-723bianjiqi_duanhouju" data-name="marginBottom" | ||
| 25 | - data-value="20px"></view> | ||
| 26 | - <view class="iconfont icon-clearedformat" @tap="removeFormat"></view> | ||
| 27 | - <view :class="formats.fontFamily ? 'ql-active' : ''" class="iconfont icon-font" data-name="fontFamily" data-value="Pacifico"></view> | ||
| 28 | - <view :class="formats.fontSize === '24px' ? 'ql-active' : ''" class="iconfont icon-fontsize" data-name="fontSize" | ||
| 29 | - data-value="24px"></view> | ||
| 30 | - | ||
| 31 | - <view :class="formats.color === '#0000ff' ? 'ql-active' : ''" class="iconfont icon-text_color" data-name="color" | ||
| 32 | - data-value="#0000ff"></view> | ||
| 33 | - <view :class="formats.backgroundColor === '#00ff00' ? 'ql-active' : ''" class="iconfont icon-fontbgcolor" | ||
| 34 | - data-name="backgroundColor" data-value="#00ff00"></view> | ||
| 35 | - | ||
| 36 | - <view class="iconfont icon-date" @tap="insertDate"></view> | ||
| 37 | - <view class="iconfont icon--checklist" data-name="list" data-value="check"></view> | ||
| 38 | - <view :class="formats.list === 'ordered' ? 'ql-active' : ''" class="iconfont icon-youxupailie" data-name="list" | ||
| 39 | - data-value="ordered"></view> | ||
| 40 | - <view :class="formats.list === 'bullet' ? 'ql-active' : ''" class="iconfont icon-wuxupailie" data-name="list" | ||
| 41 | - data-value="bullet"></view> | ||
| 42 | - <view class="iconfont icon-undo" @tap="undo"></view> | ||
| 43 | - <view class="iconfont icon-redo" @tap="redo"></view> | ||
| 44 | - | ||
| 45 | - <view class="iconfont icon-outdent" data-name="indent" data-value="-1"></view> | ||
| 46 | - <view class="iconfont icon-indent" data-name="indent" data-value="+1"></view> | ||
| 47 | - <view class="iconfont icon-fengexian" @tap="insertDivider"></view> | ||
| 48 | - <view class="iconfont icon-charutupian" @tap="insertImage"></view> | ||
| 49 | - <view :class="formats.header === 1 ? 'ql-active' : ''" class="iconfont icon-format-header-1" data-name="header" | ||
| 50 | - :data-value="1"></view> | ||
| 51 | - <view :class="formats.script === 'sub' ? 'ql-active' : ''" class="iconfont icon-zitixiabiao" data-name="script" | ||
| 52 | - data-value="sub"></view> | ||
| 53 | - <view :class="formats.script === 'super' ? 'ql-active' : ''" class="iconfont icon-zitishangbiao" data-name="script" | ||
| 54 | - data-value="super"></view> | ||
| 55 | - <view class="iconfont icon-shanchu" @tap="clear"></view> | ||
| 56 | - <view :class="formats.direction === 'rtl' ? 'ql-active' : ''" class="iconfont icon-direction-rtl" data-name="direction" | ||
| 57 | - data-value="rtl"></view> | ||
| 58 | - | ||
| 59 | - </view> | ||
| 60 | - | ||
| 61 | - <view class="editor-wrapper"> | ||
| 62 | - <editor id="editor" class="ql-container" placeholder="开始输入..." showImgSize showImgToolbar showImgResize | ||
| 63 | - @statuschange="onStatusChange" :read-only="readOnly" @ready="onEditorReady"> | ||
| 64 | - </editor> | ||
| 65 | - </view> | ||
| 66 | - </view> | ||
| 67 | - </view> | ||
| 68 | - | ||
| 69 | - </view> | ||
| 70 | -</template> | ||
| 71 | - | ||
| 72 | -<script> | ||
| 73 | - export default { | ||
| 74 | - data() { | ||
| 75 | - return { | ||
| 76 | - readOnly: false, | ||
| 77 | - formats: {} | ||
| 78 | - } | ||
| 79 | - }, | ||
| 80 | - methods: { | ||
| 81 | - readOnlyChange() { | ||
| 82 | - this.readOnly = !this.readOnly | ||
| 83 | - }, | ||
| 84 | - onEditorReady() { | ||
| 85 | - uni.createSelectorQuery().select('#editor').context((res) => { | ||
| 86 | - this.editorCtx = res.context | ||
| 87 | - }).exec() | ||
| 88 | - }, | ||
| 89 | - undo() { | ||
| 90 | - this.editorCtx.undo() | ||
| 91 | - }, | ||
| 92 | - redo() { | ||
| 93 | - this.editorCtx.redo() | ||
| 94 | - }, | ||
| 95 | - format(e) { | ||
| 96 | - let { | ||
| 97 | - name, | ||
| 98 | - value | ||
| 99 | - } = e.target.dataset | ||
| 100 | - if (!name) return | ||
| 101 | - // console.log('format', name, value) | ||
| 102 | - this.editorCtx.format(name, value) | ||
| 103 | - | ||
| 104 | - }, | ||
| 105 | - onStatusChange(e) { | ||
| 106 | - const formats = e.detail | ||
| 107 | - this.formats = formats | ||
| 108 | - }, | ||
| 109 | - insertDivider() { | ||
| 110 | - this.editorCtx.insertDivider({ | ||
| 111 | - success: function() { | ||
| 112 | - console.log('insert divider success') | ||
| 113 | - } | ||
| 114 | - }) | ||
| 115 | - }, | ||
| 116 | - clear() { | ||
| 117 | - this.editorCtx.clear({ | ||
| 118 | - success: function(res) { | ||
| 119 | - console.log("clear success") | ||
| 120 | - } | ||
| 121 | - }) | ||
| 122 | - }, | ||
| 123 | - removeFormat() { | ||
| 124 | - this.editorCtx.removeFormat() | ||
| 125 | - }, | ||
| 126 | - insertDate() { | ||
| 127 | - const date = new Date() | ||
| 128 | - const formatDate = `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}` | ||
| 129 | - this.editorCtx.insertText({ | ||
| 130 | - text: formatDate | ||
| 131 | - }) | ||
| 132 | - }, | ||
| 133 | - insertImage() { | ||
| 134 | - uni.chooseImage({ | ||
| 135 | - count: 1, | ||
| 136 | - success: (res) => { | ||
| 137 | - this.editorCtx.insertImage({ | ||
| 138 | - src: res.tempFilePaths[0], | ||
| 139 | - alt: '图像', | ||
| 140 | - success: function() { | ||
| 141 | - console.log('insert image success') | ||
| 142 | - } | ||
| 143 | - }) | ||
| 144 | - } | ||
| 145 | - }) | ||
| 146 | - } | ||
| 147 | - }, | ||
| 148 | - onLoad() { | ||
| 149 | - uni.loadFontFace({ | ||
| 150 | - family: 'Pacifico', | ||
| 151 | - source: 'url("https://sungd.github.io/Pacifico.ttf")' | ||
| 152 | - }) | ||
| 153 | - }, | ||
| 154 | - } | ||
| 155 | -</script> | ||
| 156 | - | ||
| 157 | -<style> | ||
| 158 | - @import "./editor-icon.css"; | ||
| 159 | - | ||
| 160 | - .page-body { | ||
| 161 | - height: calc(100vh - var(--window-top) - var(--status-bar-height)); | ||
| 162 | - } | ||
| 163 | - | ||
| 164 | - .wrapper { | ||
| 165 | - height: 100%; | ||
| 166 | - } | ||
| 167 | - | ||
| 168 | - .editor-wrapper { | ||
| 169 | - height: calc(100vh - var(--window-top) - var(--status-bar-height) - 140px); | ||
| 170 | - background: #fff; | ||
| 171 | - } | ||
| 172 | - | ||
| 173 | - .iconfont { | ||
| 174 | - display: inline-block; | ||
| 175 | - padding: 8px 8px; | ||
| 176 | - width: 24px; | ||
| 177 | - height: 24px; | ||
| 178 | - cursor: pointer; | ||
| 179 | - font-size: 20px; | ||
| 180 | - } | ||
| 181 | - | ||
| 182 | - .toolbar { | ||
| 183 | - box-sizing: border-box; | ||
| 184 | - border-bottom: 0; | ||
| 185 | - font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif; | ||
| 186 | - } | ||
| 187 | - | ||
| 188 | - | ||
| 189 | - .ql-container { | ||
| 190 | - box-sizing: border-box; | ||
| 191 | - padding: 12px 15px; | ||
| 192 | - width: 100%; | ||
| 193 | - min-height: 30vh; | ||
| 194 | - height: 100%; | ||
| 195 | - margin-top: 20px; | ||
| 196 | - font-size: 16px; | ||
| 197 | - line-height: 1.5; | ||
| 198 | - } | ||
| 199 | - | ||
| 200 | - .ql-active { | ||
| 201 | - color: #06c; | ||
| 202 | - } | ||
| 203 | -</style> |
pages/component/editor/iconfont.ttf deleted
No preview for this file type
pages/component/form/form.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head title="form"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <form @submit="formSubmit" @reset="formReset"> | ||
| 6 | - <view class="uni-form-item uni-column"> | ||
| 7 | - <view class="title">姓名</view> | ||
| 8 | - <input class="uni-input" name="nickname" placeholder="请输入姓名" /> | ||
| 9 | - </view> | ||
| 10 | - <view class="uni-form-item uni-column"> | ||
| 11 | - <view class="title">性别</view> | ||
| 12 | - <radio-group name="gender"> | ||
| 13 | - <label> | ||
| 14 | - <radio value="男" /><text>男</text> | ||
| 15 | - </label> | ||
| 16 | - <label> | ||
| 17 | - <radio value="女" /><text>女</text> | ||
| 18 | - </label> | ||
| 19 | - </radio-group> | ||
| 20 | - </view> | ||
| 21 | - <view class="uni-form-item uni-column"> | ||
| 22 | - <view class="title">爱好</view> | ||
| 23 | - <checkbox-group name="loves"> | ||
| 24 | - <label> | ||
| 25 | - <checkbox value="读书" /><text>读书</text> | ||
| 26 | - </label> | ||
| 27 | - <label> | ||
| 28 | - <checkbox value="写字" /><text>写字</text> | ||
| 29 | - </label> | ||
| 30 | - </checkbox-group> | ||
| 31 | - </view> | ||
| 32 | - <view class="uni-form-item uni-column"> | ||
| 33 | - <view class="title">年龄</view> | ||
| 34 | - <slider value="20" name="age" show-value></slider> | ||
| 35 | - </view> | ||
| 36 | - <view class="uni-form-item uni-column"> | ||
| 37 | - <view class="title">保留选项</view> | ||
| 38 | - <view> | ||
| 39 | - <switch name="switch" /> | ||
| 40 | - </view> | ||
| 41 | - </view> | ||
| 42 | - <view class="uni-btn-v"> | ||
| 43 | - <button form-type="submit">Submit</button> | ||
| 44 | - <button type="default" form-type="reset">Reset</button> | ||
| 45 | - </view> | ||
| 46 | - </form> | ||
| 47 | - </view> | ||
| 48 | - </view> | ||
| 49 | -</template> | ||
| 50 | -<script> | ||
| 51 | - import graceChecker from "../../../common/graceChecker.js" | ||
| 52 | - export default { | ||
| 53 | - data() { | ||
| 54 | - return { | ||
| 55 | - } | ||
| 56 | - }, | ||
| 57 | - methods: { | ||
| 58 | - formSubmit: function(e) { | ||
| 59 | - console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value)) | ||
| 60 | - //定义表单规则 | ||
| 61 | - var rule = [ | ||
| 62 | - {name:"nickname", checkType : "string", checkRule:"1,3", errorMsg:"姓名应为1-3个字符"}, | ||
| 63 | - {name:"gender", checkType : "in", checkRule:"男,女", errorMsg:"请选择性别"}, | ||
| 64 | - {name:"loves", checkType : "notnull", checkRule:"", errorMsg:"请选择爱好"} | ||
| 65 | - ]; | ||
| 66 | - //进行表单检查 | ||
| 67 | - var formData = e.detail.value; | ||
| 68 | - var checkRes = graceChecker.check(formData, rule); | ||
| 69 | - if(checkRes){ | ||
| 70 | - uni.showToast({title:"验证通过!", icon:"none"}); | ||
| 71 | - }else{ | ||
| 72 | - uni.showToast({ title: graceChecker.error, icon: "none" }); | ||
| 73 | - } | ||
| 74 | - }, | ||
| 75 | - formReset: function(e) { | ||
| 76 | - console.log('清空数据') | ||
| 77 | - } | ||
| 78 | - } | ||
| 79 | - } | ||
| 80 | -</script> | ||
| 81 | - | ||
| 82 | -<style> | ||
| 83 | - .uni-form-item .title { | ||
| 84 | - padding: 20rpx 0; | ||
| 85 | - } | ||
| 86 | -</style> |
pages/component/image/image.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-title"> | ||
| 6 | - 示例1 <text>\n本地图片</text> | ||
| 7 | - </view> | ||
| 8 | - <view class="uni-center" style="background:#FFFFFF; font-size:0;"> | ||
| 9 | - <image class="image" mode="widthFix" src="../../../static/uni.png" /> | ||
| 10 | - </view> | ||
| 11 | - <view class="uni-title uni-common-mt"> | ||
| 12 | - 示例2 <text>\n网络图片</text> | ||
| 13 | - </view> | ||
| 14 | - <view class="uni-center" style="background:#FFFFFF; font-size:0;"> | ||
| 15 | - <image class="image" mode="widthFix" src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/ceb770c0-5164-11eb-8a36-ebb87efcf8c0.png" /> | ||
| 16 | - </view> | ||
| 17 | - </view> | ||
| 18 | - </view> | ||
| 19 | -</template> | ||
| 20 | -<script> | ||
| 21 | - export default { | ||
| 22 | - data() { | ||
| 23 | - return { | ||
| 24 | - title: 'image' | ||
| 25 | - } | ||
| 26 | - } | ||
| 27 | - } | ||
| 28 | -</script> | ||
| 29 | -<style> | ||
| 30 | - .image { | ||
| 31 | - margin:40rpx 0; | ||
| 32 | - width: 200rpx; | ||
| 33 | - } | ||
| 34 | -</style> |
pages/component/input/input.nvue deleted
| 1 | -<template> | ||
| 2 | - <view class="nvue-page-root"> | ||
| 3 | - <view class="page-title"> | ||
| 4 | - <view class="page-title__wrapper"> | ||
| 5 | - <text class="page-title__text">{{title}}</text> | ||
| 6 | - </view> | ||
| 7 | - </view> | ||
| 8 | - <view class="uni-common-mt"> | ||
| 9 | - <view class="uni-form-item uni-column"> | ||
| 10 | - <view class="title"><text class="uni-form-item__title">可自动聚焦的 input</text></view> | ||
| 11 | - <view class="uni-input-wrapper"> | ||
| 12 | - <input class="uni-input" focus placeholder="自动获得焦点" /> | ||
| 13 | - </view> | ||
| 14 | - </view> | ||
| 15 | - <!-- #ifdef APP-PLUS --> | ||
| 16 | - <view v-if="platform==='ios'&&!isNvue" class="uni-form-item uni-column"> | ||
| 17 | - <view class="title"><text class="uni-form-item__title">隐藏 iOS 软键盘上的导航条</text></view> | ||
| 18 | - <view class="uni-input-wrapper"> | ||
| 19 | - <input class="uni-input" placeholder="触摸其他地方收起键盘" @focus="onFocus" @blur="onBlur" /> | ||
| 20 | - </view> | ||
| 21 | - </view> | ||
| 22 | - <!-- #endif --> | ||
| 23 | - <view class="uni-form-item uni-column"> | ||
| 24 | - <view class="title"><text class="uni-form-item__title">键盘右下角按钮显示为搜索</text></view> | ||
| 25 | - <view class="uni-input-wrapper"> | ||
| 26 | - <input class="uni-input" confirm-type="search" placeholder="键盘右下角按钮显示为搜索" /> | ||
| 27 | - </view> | ||
| 28 | - </view> | ||
| 29 | - <!-- #ifndef H5 --> | ||
| 30 | - <view class="uni-form-item uni-column"> | ||
| 31 | - <view class="title"><text class="uni-form-item__title">键盘右下角按钮显示为发送</text></view> | ||
| 32 | - <view class="uni-input-wrapper"> | ||
| 33 | - <input class="uni-input" confirm-type="send" placeholder="键盘右下角按钮显示为发送" /> | ||
| 34 | - </view> | ||
| 35 | - </view> | ||
| 36 | - <!-- #endif --> | ||
| 37 | - <view class="uni-form-item uni-column"> | ||
| 38 | - <view class="title"><text class="uni-form-item__title">控制最大输入长度的 input</text></view> | ||
| 39 | - <view class="uni-input-wrapper"> | ||
| 40 | - <input class="uni-input" maxlength="10" placeholder="最大输入长度为10" /> | ||
| 41 | - </view> | ||
| 42 | - </view> | ||
| 43 | - <view class="uni-form-item uni-column"> | ||
| 44 | - <view class="title"><text class="uni-form-item__title">实时获取输入值：{{inputValue}}</text></view> | ||
| 45 | - <view class="uni-input-wrapper"> | ||
| 46 | - <input class="uni-input" @input="onKeyInput" placeholder="输入同步到view中" /> | ||
| 47 | - </view> | ||
| 48 | - </view> | ||
| 49 | - <view class="uni-form-item uni-column"> | ||
| 50 | - <view class="title"><text class="uni-form-item__title">控制输入的 input</text></view> | ||
| 51 | - <view class="uni-input-wrapper"> | ||
| 52 | - <input class="uni-input" @input="replaceInput" v-model="changeValue" placeholder="连续的两个1会变成2" /> | ||
| 53 | - </view> | ||
| 54 | - </view> | ||
| 55 | - <!-- #ifndef MP-BAIDU --> | ||
| 56 | - <view class="uni-form-item uni-column"> | ||
| 57 | - <view class="title"><text class="uni-form-item__title">控制键盘的 input</text></view> | ||
| 58 | - <view class="uni-input-wrapper"> | ||
| 59 | - <input class="uni-input" ref="input1" @input="hideKeyboard" placeholder="输入123自动收起键盘" /> | ||
| 60 | - </view> | ||
| 61 | - </view> | ||
| 62 | - <!-- #endif --> | ||
| 63 | - <view class="uni-form-item uni-column"> | ||
| 64 | - <view class="title"><text class="uni-form-item__title">数字输入的 input</text></view> | ||
| 65 | - <view class="uni-input-wrapper"> | ||
| 66 | - <input class="uni-input" type="number" placeholder="这是一个数字输入框" /> | ||
| 67 | - </view> | ||
| 68 | - </view> | ||
| 69 | - <view class="uni-form-item uni-column"> | ||
| 70 | - <view class="title"><text class="uni-form-item__title">密码输入的 input</text></view> | ||
| 71 | - <view class="uni-input-wrapper"> | ||
| 72 | - <input class="uni-input" password type="text" placeholder="这是一个密码输入框" /> | ||
| 73 | - </view> | ||
| 74 | - </view> | ||
| 75 | - <view class="uni-form-item uni-column"> | ||
| 76 | - <view class="title"><text class="uni-form-item__title">带小数点的 input</text></view> | ||
| 77 | - <view class="uni-input-wrapper"> | ||
| 78 | - <input class="uni-input" type="digit" placeholder="带小数点的数字键盘" /> </view> | ||
| 79 | - </view> | ||
| 80 | - <view class="uni-form-item uni-column"> | ||
| 81 | - <view class="title"><text class="uni-form-item__title">身份证输入的 input</text></view> | ||
| 82 | - <view class="uni-input-wrapper"> | ||
| 83 | - <input class="uni-input" type="idcard" placeholder="身份证输入键盘" /> </view> | ||
| 84 | - </view> | ||
| 85 | - <view class="uni-form-item uni-column"> | ||
| 86 | - <view class="title"><text class="uni-form-item__title">控制占位符颜色的 input</text></view> | ||
| 87 | - <view class="uni-input-wrapper"> | ||
| 88 | - <input class="uni-input" placeholder-style="color:#F76260" placeholder="占位符字体是红色的" /> | ||
| 89 | - </view> | ||
| 90 | - </view> | ||
| 91 | - <view class="uni-form-item uni-column"> | ||
| 92 | - <view class="title"><text class="uni-form-item__title">带清除按钮的输入框</text></view> | ||
| 93 | - <view class="uni-input-wrapper"> | ||
| 94 | - <input class="uni-input" placeholder="带清除按钮的输入框" :value="inputClearValue" @input="clearInput" /> | ||
| 95 | - <text class="uni-icon" v-if="showClearIcon" @click="clearIcon"></text> | ||
| 96 | - </view> | ||
| 97 | - </view> | ||
| 98 | - <view class="uni-form-item uni-column"> | ||
| 99 | - <view class="title"><text class="uni-form-item__title">可查看密码的输入框</text></view> | ||
| 100 | - <view class="uni-input-wrapper"> | ||
| 101 | - <input class="uni-input" placeholder="请输入密码" :password="showPassword" /> | ||
| 102 | - <text class="uni-icon" :class="[!showPassword ? 'uni-eye-active' : '']" @click="changePassword"></text> | ||
| 103 | - </view> | ||
| 104 | - </view> | ||
| 105 | - </view> | ||
| 106 | - </view> | ||
| 107 | -</template> | ||
| 108 | -<script> | ||
| 109 | - export default { | ||
| 110 | - data() { | ||
| 111 | - return { | ||
| 112 | - title: 'input', | ||
| 113 | - focus: false, | ||
| 114 | - inputValue: '', | ||
| 115 | - showClearIcon: false, | ||
| 116 | - inputClearValue: '', | ||
| 117 | - changeValue: '', | ||
| 118 | - showPassword: true, | ||
| 119 | - src: '../../../static/eye-1.png', | ||
| 120 | - platform: '', | ||
| 121 | - isNvue: false, | ||
| 122 | - } | ||
| 123 | - }, | ||
| 124 | - methods: { | ||
| 125 | - onKeyInput: function(event) { | ||
| 126 | - this.inputValue = event.detail.value | ||
| 127 | - }, | ||
| 128 | - replaceInput: function(event) { | ||
| 129 | - var value = event.detail.value; | ||
| 130 | - if (value === '11') { | ||
| 131 | - this.changeValue = '2'; | ||
| 132 | - } | ||
| 133 | - }, | ||
| 134 | - hideKeyboard: function(event) { | ||
| 135 | - if (event.detail.value === '123') { | ||
| 136 | - uni.hideKeyboard(); | ||
| 137 | - } | ||
| 138 | - }, | ||
| 139 | - clearInput: function(event) { | ||
| 140 | - this.inputClearValue = event.detail.value; | ||
| 141 | - if (event.detail.value.length > 0) { | ||
| 142 | - this.showClearIcon = true; | ||
| 143 | - } else { | ||
| 144 | - this.showClearIcon = false; | ||
| 145 | - } | ||
| 146 | - }, | ||
| 147 | - clearIcon: function() { | ||
| 148 | - this.inputClearValue = ''; | ||
| 149 | - this.showClearIcon = false; | ||
| 150 | - }, | ||
| 151 | - changePassword: function() { | ||
| 152 | - this.showPassword = !this.showPassword; | ||
| 153 | - }, | ||
| 154 | - onFocus() { | ||
| 155 | - this.$mp.page.$getAppWebview().setStyle({ | ||
| 156 | - softinputNavBar: 'none' | ||
| 157 | - }) | ||
| 158 | - }, | ||
| 159 | - onBlur() { | ||
| 160 | - this.$mp.page.$getAppWebview().setStyle({ | ||
| 161 | - softinputNavBar: 'auto' | ||
| 162 | - }) | ||
| 163 | - } | ||
| 164 | - }, | ||
| 165 | - onLoad() { | ||
| 166 | - this.platform = uni.getSystemInfoSync().platform | ||
| 167 | - // #ifdef APP-PLUS-NVUE | ||
| 168 | - this.isNvue = true | ||
| 169 | - // #endif | ||
| 170 | - } | ||
| 171 | - } | ||
| 172 | -</script> | ||
| 173 | - | ||
| 174 | -<style scoped> | ||
| 175 | - .nvue-page-root { | ||
| 176 | - background-color: #F8F8F8; | ||
| 177 | - padding-bottom: 20px; | ||
| 178 | - } | ||
| 179 | - | ||
| 180 | - .page-title { | ||
| 181 | - /* #ifndef APP-NVUE */ | ||
| 182 | - display: flex; | ||
| 183 | - /* #endif */ | ||
| 184 | - flex-direction: row; | ||
| 185 | - justify-content: center; | ||
| 186 | - align-items: center; | ||
| 187 | - padding: 35rpx; | ||
| 188 | - } | ||
| 189 | - | ||
| 190 | - .page-title__wrapper { | ||
| 191 | - padding: 0px 20px; | ||
| 192 | - border-bottom-color: #D8D8D8; | ||
| 193 | - border-bottom-width: 1px; | ||
| 194 | - } | ||
| 195 | - | ||
| 196 | - .page-title__text { | ||
| 197 | - font-size: 16px; | ||
| 198 | - height: 48px; | ||
| 199 | - line-height: 48px; | ||
| 200 | - color: #BEBEBE; | ||
| 201 | - } | ||
| 202 | - | ||
| 203 | - .title { | ||
| 204 | - padding: 5px 13px; | ||
| 205 | - } | ||
| 206 | - | ||
| 207 | - .uni-form-item__title { | ||
| 208 | - font-size: 16px; | ||
| 209 | - line-height: 24px; | ||
| 210 | - } | ||
| 211 | - | ||
| 212 | - .uni-input-wrapper { | ||
| 213 | - /* #ifndef APP-NVUE */ | ||
| 214 | - display: flex; | ||
| 215 | - /* #endif */ | ||
| 216 | - padding: 8px 13px; | ||
| 217 | - flex-direction: row; | ||
| 218 | - flex-wrap: nowrap; | ||
| 219 | - background-color: #FFFFFF; | ||
| 220 | - } | ||
| 221 | - | ||
| 222 | - .uni-input { | ||
| 223 | - height: 28px; | ||
| 224 | - line-height: 28px; | ||
| 225 | - font-size: 15px; | ||
| 226 | - padding: 0px; | ||
| 227 | - flex: 1; | ||
| 228 | - background-color: #FFFFFF; | ||
| 229 | - } | ||
| 230 | - | ||
| 231 | - .uni-icon { | ||
| 232 | - font-family: uniicons; | ||
| 233 | - font-size: 24px; | ||
| 234 | - font-weight: normal; | ||
| 235 | - font-style: normal; | ||
| 236 | - width: 24px; | ||
| 237 | - height: 24px; | ||
| 238 | - line-height: 24px; | ||
| 239 | - color: #999999; | ||
| 240 | - } | ||
| 241 | - | ||
| 242 | - .uni-eye-active { | ||
| 243 | - color: #007AFF; | ||
| 244 | - } | ||
| 245 | -</style> |
pages/component/label/label.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-common-mt"> | ||
| 5 | - <view class="uni-form-item uni-column"> | ||
| 6 | - <view class="title">表单组件在label内</view> | ||
| 7 | - <checkbox-group class="uni-list" @change="checkboxChange"> | ||
| 8 | - <label class="uni-list-cell uni-list-cell-pd" v-for="item in checkboxItems" :key="item.name"> | ||
| 9 | - <view> | ||
| 10 | - <checkbox :value="item.name" :checked="item.checked"></checkbox> | ||
| 11 | - </view> | ||
| 12 | - <view>{{item.value}}</view> | ||
| 13 | - </label> | ||
| 14 | - </checkbox-group> | ||
| 15 | - </view> | ||
| 16 | - | ||
| 17 | - <view class="uni-form-item uni-column"> | ||
| 18 | - <view class="title">label用for标识表单组件</view> | ||
| 19 | - <radio-group class="uni-list" @change="radioChange"> | ||
| 20 | - <view class="uni-list-cell uni-list-cell-pd" v-for="(item,index) in radioItems" :key="index"> | ||
| 21 | - <view> | ||
| 22 | - <radio :id="item.name" :value="item.name" :checked="item.checked"></radio> | ||
| 23 | - </view> | ||
| 24 | - <label class="label-2-text" :for="item.name"> | ||
| 25 | - <text>{{item.value}}</text> | ||
| 26 | - </label> | ||
| 27 | - </view> | ||
| 28 | - </radio-group> | ||
| 29 | - </view> | ||
| 30 | - | ||
| 31 | - <view class="uni-form-item uni-column"> | ||
| 32 | - <view class="title">label内有多个时选中第一个</view> | ||
| 33 | - <checkbox-group class="uni-list" @change="checkboxChange"> | ||
| 34 | - <label class="label-3"> | ||
| 35 | - <view class="uni-list-cell uni-list-cell-pd"> | ||
| 36 | - <checkbox class="checkbox-3">选项一</checkbox> | ||
| 37 | - </view> | ||
| 38 | - <view class="uni-list-cell uni-list-cell-pd"> | ||
| 39 | - <checkbox class="checkbox-3">选项二</checkbox> | ||
| 40 | - </view> | ||
| 41 | - <view class="uni-link uni-center" style="margin-top:20rpx;">点击该label下的文字默认选中第一个checkbox</view> | ||
| 42 | - </label> | ||
| 43 | - </checkbox-group> | ||
| 44 | - </view> | ||
| 45 | - | ||
| 46 | - </view> | ||
| 47 | - </view> | ||
| 48 | -</template> | ||
| 49 | -<script> | ||
| 50 | - export default { | ||
| 51 | - data() { | ||
| 52 | - return { | ||
| 53 | - title: 'label', | ||
| 54 | - checkboxItems: [{ | ||
| 55 | - name: 'USA', | ||
| 56 | - value: '美国' | ||
| 57 | - }, | ||
| 58 | - { | ||
| 59 | - name: 'CHN', | ||
| 60 | - value: '中国', | ||
| 61 | - checked: 'true' | ||
| 62 | - } | ||
| 63 | - ], | ||
| 64 | - radioItems: [{ | ||
| 65 | - name: 'USA', | ||
| 66 | - value: '美国' | ||
| 67 | - }, | ||
| 68 | - { | ||
| 69 | - name: 'CHN', | ||
| 70 | - value: '中国', | ||
| 71 | - checked: 'true' | ||
| 72 | - } | ||
| 73 | - ], | ||
| 74 | - hidden: false | ||
| 75 | - } | ||
| 76 | - }, | ||
| 77 | - methods: { | ||
| 78 | - checkboxChange: function(e) { | ||
| 79 | - var checked = e.detail.value | ||
| 80 | - console.log(checked) | ||
| 81 | - | ||
| 82 | - }, | ||
| 83 | - radioChange: function(e) { | ||
| 84 | - var checked = e.detail.value | ||
| 85 | - console.log(checked) | ||
| 86 | - } | ||
| 87 | - } | ||
| 88 | - } | ||
| 89 | -</script> | ||
| 90 | - | ||
| 91 | -<style> | ||
| 92 | - .uni-list-cell { | ||
| 93 | - justify-content: flex-start | ||
| 94 | - } | ||
| 95 | - | ||
| 96 | - .uni-list .label-3 { | ||
| 97 | - padding: 0; | ||
| 98 | - } | ||
| 99 | - | ||
| 100 | - .label-2-text { | ||
| 101 | - flex: 1; | ||
| 102 | - } | ||
| 103 | -</style> |
pages/component/map/map.nvue deleted
| 1 | -<template> | ||
| 2 | - <view class="content"> | ||
| 3 | - <map class="map" ref="map1" :controls="controls" :scale="scale" :longitude="location.longitude" :latitude="location.latitude" | ||
| 4 | - :show-location="showLocation" :enable-3D="enable3D" :rotate="rotate" :skew="skew" :show-compass="showCompass" | ||
| 5 | - :enable-overlooking="enableOverlooking" :enable-zoom="enableZoom" :enable-scroll="enableScroll" | ||
| 6 | - :enable-rotate="enableRotate" :enable-satellite="enableSatellite" :enable-traffic="enableTraffic" :markers="markers" | ||
| 7 | - :polyline="polyline" :circles="circles" :polygons="polygons" :include-points="includePoints"></map> | ||
| 8 | - <view class="line"></view> | ||
| 9 | - <uni-list class="scrollview"> | ||
| 10 | - <uni-list-item :show-arrow="false" :show-switch="true" :switch-checked="enable3D" title="显示3D楼块" @switchChange="enableThreeD" /> | ||
| 11 | - <uni-list-item :show-arrow="false" :show-switch="true" :switch-checked="showCompass" title="显示指南针" @switchChange="changeShowCompass" /> | ||
| 12 | - <!-- <uni-list-item :show-arrow="false" :show-switch="true" :switch-checked="enableOverlooking" title="开启俯视" @switchChange="changeEnableOverlooking" /> --> | ||
| 13 | - <uni-list-item :show-arrow="false" :show-switch="true" :switch-checked="enableZoom" title="是否支持缩放" @switchChange="changeEnableZoom" /> | ||
| 14 | - <uni-list-item :show-arrow="false" :show-switch="true" :switch-checked="enableScroll" title="是否支持拖动" @switchChange="changeEnableScroll" /> | ||
| 15 | - <uni-list-item :show-arrow="false" :show-switch="true" :switch-checked="enableRotate" title="是否支持旋转" @switchChange="changeEnableRotate" /> | ||
| 16 | - <uni-list-item :show-arrow="false" :show-switch="true" :switch-checked="enableSatellite" title="是否开启卫星图" @switchChange="changeEnableSatellite" /> | ||
| 17 | - <uni-list-item :show-arrow="false" :show-switch="true" :switch-checked="enableTraffic" title="是否开启实时路况" @switchChange="changeEnableTraffic" /> | ||
| 18 | - </uni-list> | ||
| 19 | - </view> | ||
| 20 | -</template> | ||
| 21 | -<script> | ||
| 22 | - const testMarkers = [{ | ||
| 23 | - id: 0, | ||
| 24 | - latitude: 39.989631, | ||
| 25 | - longitude: 116.481018, | ||
| 26 | - title: '方恒国际 阜通东大街6号', | ||
| 27 | - zIndex: '1', | ||
| 28 | - rotate: 0, | ||
| 29 | - width: 20, | ||
| 30 | - height: 20, | ||
| 31 | - anchor: { | ||
| 32 | - x: 0.5, | ||
| 33 | - y: 1 | ||
| 34 | - }, | ||
| 35 | - callout: { | ||
| 36 | - content: '方恒国际 阜通东大街6号', | ||
| 37 | - color: '#00BFFF', | ||
| 38 | - fontSize: 10, | ||
| 39 | - borderRadius: 4, | ||
| 40 | - borderWidth: 1, | ||
| 41 | - borderColor: '#333300', | ||
| 42 | - bgColor: '#CCFF99', | ||
| 43 | - padding: '5', | ||
| 44 | - display: 'ALWAYS' | ||
| 45 | - } | ||
| 46 | - }, | ||
| 47 | - { | ||
| 48 | - id: 1, | ||
| 49 | - latitude: 39.9086920000, | ||
| 50 | - longitude: 116.3974770000, | ||
| 51 | - title: '天安门', | ||
| 52 | - zIndex: '1', | ||
| 53 | - iconPath: '/static/location.png', | ||
| 54 | - width: 40, | ||
| 55 | - height: 40, | ||
| 56 | - anchor: { | ||
| 57 | - x: 0.5, | ||
| 58 | - y: 1 | ||
| 59 | - }, | ||
| 60 | - callout: { | ||
| 61 | - content: '首都北京\n天安门', | ||
| 62 | - color: '#00BFFF', | ||
| 63 | - fontSize: 12, | ||
| 64 | - borderRadius: 2, | ||
| 65 | - borderWidth: 0, | ||
| 66 | - borderColor: '#333300', | ||
| 67 | - bgColor: '#CCFF11', | ||
| 68 | - padding: '1', | ||
| 69 | - display: 'ALWAYS' | ||
| 70 | - } | ||
| 71 | - } | ||
| 72 | - ]; | ||
| 73 | - const testPolyline = [{ | ||
| 74 | - points: [{ | ||
| 75 | - latitude: 39.925539, | ||
| 76 | - longitude: 116.279037 | ||
| 77 | - }, | ||
| 78 | - { | ||
| 79 | - latitude: 39.925539, | ||
| 80 | - longitude: 116.520285 | ||
| 81 | - } | ||
| 82 | - ], | ||
| 83 | - color: '#FFCCFF', | ||
| 84 | - width: 7, | ||
| 85 | - dottedLine: true, | ||
| 86 | - arrowLine: true, | ||
| 87 | - borderColor: '#000000', | ||
| 88 | - borderWidth: 2 | ||
| 89 | - }, | ||
| 90 | - { | ||
| 91 | - points: [{ | ||
| 92 | - latitude: 39.938698, | ||
| 93 | - longitude: 116.275177 | ||
| 94 | - }, | ||
| 95 | - { | ||
| 96 | - latitude: 39.966069, | ||
| 97 | - longitude: 116.289253 | ||
| 98 | - }, | ||
| 99 | - { | ||
| 100 | - latitude: 39.944226, | ||
| 101 | - longitude: 116.306076 | ||
| 102 | - }, | ||
| 103 | - { | ||
| 104 | - latitude: 39.966069, | ||
| 105 | - longitude: 116.322899 | ||
| 106 | - }, | ||
| 107 | - { | ||
| 108 | - latitude: 39.938698, | ||
| 109 | - longitude: 116.336975 | ||
| 110 | - } | ||
| 111 | - ], | ||
| 112 | - color: '#CCFFFF', | ||
| 113 | - width: 5, | ||
| 114 | - dottedLine: true, | ||
| 115 | - arrowLine: true, | ||
| 116 | - borderColor: '#CC0000', | ||
| 117 | - borderWidth: 3 | ||
| 118 | - } | ||
| 119 | - ]; | ||
| 120 | - const testPolygons = [{ | ||
| 121 | - points: [{ | ||
| 122 | - latitude: 39.781892, | ||
| 123 | - longitude: 116.293413 | ||
| 124 | - }, | ||
| 125 | - { | ||
| 126 | - latitude: 39.787600, | ||
| 127 | - longitude: 116.391842 | ||
| 128 | - }, | ||
| 129 | - { | ||
| 130 | - latitude: 39.733187, | ||
| 131 | - longitude: 116.417932 | ||
| 132 | - }, | ||
| 133 | - { | ||
| 134 | - latitude: 39.704653, | ||
| 135 | - longitude: 116.338255 | ||
| 136 | - } | ||
| 137 | - ], | ||
| 138 | - fillColor: '#FFCCFF', | ||
| 139 | - strokeWidth: 3, | ||
| 140 | - strokeColor: '#CC99CC', | ||
| 141 | - zIndex: 11 | ||
| 142 | - }, | ||
| 143 | - { | ||
| 144 | - points: [{ | ||
| 145 | - latitude: 39.887600, | ||
| 146 | - longitude: 116.518932 | ||
| 147 | - }, | ||
| 148 | - { | ||
| 149 | - latitude: 39.781892, | ||
| 150 | - longitude: 116.518932 | ||
| 151 | - }, | ||
| 152 | - { | ||
| 153 | - latitude: 39.781892, | ||
| 154 | - longitude: 116.428932 | ||
| 155 | - }, | ||
| 156 | - { | ||
| 157 | - latitude: 39.887600, | ||
| 158 | - longitude: 116.428932 | ||
| 159 | - } | ||
| 160 | - ], | ||
| 161 | - fillColor: '#CCFFFF', | ||
| 162 | - strokeWidth: 5, | ||
| 163 | - strokeColor: '#CC0000', | ||
| 164 | - zIndex: 3 | ||
| 165 | - } | ||
| 166 | - ]; | ||
| 167 | - const testCircles = [{ | ||
| 168 | - latitude: 39.996441, | ||
| 169 | - longitude: 116.411146, | ||
| 170 | - radius: 15000, | ||
| 171 | - strokeWidth: 5, | ||
| 172 | - color: '#CCFFFF', | ||
| 173 | - fillColor: '#CC0000' | ||
| 174 | - }, | ||
| 175 | - { | ||
| 176 | - latitude: 40.096441, | ||
| 177 | - longitude: 116.511146, | ||
| 178 | - radius: 12000, | ||
| 179 | - strokeWidth: 3, | ||
| 180 | - color: '#CCFFFF', | ||
| 181 | - fillColor: '#FFCCFF' | ||
| 182 | - }, | ||
| 183 | - { | ||
| 184 | - latitude: 39.896441, | ||
| 185 | - longitude: 116.311146, | ||
| 186 | - radius: 9000, | ||
| 187 | - strokeWidth: 1, | ||
| 188 | - color: '#CCFFFF', | ||
| 189 | - fillColor: '#CC0000' | ||
| 190 | - } | ||
| 191 | - ]; | ||
| 192 | - const testIncludePoints = [{ | ||
| 193 | - latitude: 39.989631, | ||
| 194 | - longitude: 116.481018, | ||
| 195 | - }, | ||
| 196 | - { | ||
| 197 | - latitude: 39.9086920000, | ||
| 198 | - longitude: 116.3974770000, | ||
| 199 | - } | ||
| 200 | - ]; | ||
| 201 | - export default { | ||
| 202 | - data() { | ||
| 203 | - return { | ||
| 204 | - location: { | ||
| 205 | - longitude: 116.3974770000, | ||
| 206 | - latitude: 39.9086920000 | ||
| 207 | - }, | ||
| 208 | - controls: [{ | ||
| 209 | - id: 1, | ||
| 210 | - position: { | ||
| 211 | - left: 5, | ||
| 212 | - top: 180, | ||
| 213 | - width: 30, | ||
| 214 | - height: 30 | ||
| 215 | - }, | ||
| 216 | - iconPath: '/static/logo.png', | ||
| 217 | - clickable: true | ||
| 218 | - }], | ||
| 219 | - showLocation: false, | ||
| 220 | - scale: 13, | ||
| 221 | - showCompass: true, | ||
| 222 | - enable3D: true, | ||
| 223 | - enableOverlooking: true, | ||
| 224 | - enableZoom: true, | ||
| 225 | - enableScroll: true, | ||
| 226 | - enableRotate: true, | ||
| 227 | - enableSatellite: false, | ||
| 228 | - enableTraffic: false, | ||
| 229 | - polyline: [], | ||
| 230 | - markers: [], | ||
| 231 | - polygons: [], | ||
| 232 | - circles: [], | ||
| 233 | - includePoints: [], | ||
| 234 | - rotate: 0, | ||
| 235 | - skew: 0 | ||
| 236 | - } | ||
| 237 | - }, | ||
| 238 | - onLoad() {}, | ||
| 239 | - methods: { | ||
| 240 | - changeScale() { | ||
| 241 | - this.scale = this.scale == 9 ? 15 : 9; | ||
| 242 | - }, | ||
| 243 | - changeRotate() { | ||
| 244 | - this.rotate = this.rotate == 90 ? 0 : 90; | ||
| 245 | - }, | ||
| 246 | - changeSkew() { | ||
| 247 | - this.skew = this.skew == 30 ? 0 : 30; | ||
| 248 | - }, | ||
| 249 | - enableThreeD(e) { | ||
| 250 | - this.enable3D = e.value; | ||
| 251 | - }, | ||
| 252 | - changeShowCompass(e) { | ||
| 253 | - this.showCompass = e.value; | ||
| 254 | - }, | ||
| 255 | - changeEnableOverlooking(e) { | ||
| 256 | - this.enableOverlooking = e.value; | ||
| 257 | - }, | ||
| 258 | - changeEnableZoom(e) { | ||
| 259 | - this.enableZoom = e.value; | ||
| 260 | - }, | ||
| 261 | - changeEnableScroll(e) { | ||
| 262 | - this.enableScroll = e.value; | ||
| 263 | - }, | ||
| 264 | - changeEnableRotate(e) { | ||
| 265 | - this.enableRotate = e.value; | ||
| 266 | - }, | ||
| 267 | - changeEnableSatellite(e) { | ||
| 268 | - this.enableSatellite = e.value; | ||
| 269 | - }, | ||
| 270 | - changeEnableTraffic(e) { | ||
| 271 | - this.enableTraffic = e.value; | ||
| 272 | - } | ||
| 273 | - } | ||
| 274 | - } | ||
| 275 | -</script> | ||
| 276 | - | ||
| 277 | -<style> | ||
| 278 | - .content { | ||
| 279 | - flex: 1; | ||
| 280 | - } | ||
| 281 | - | ||
| 282 | - .map { | ||
| 283 | - width: 750rpx; | ||
| 284 | - height: 250px; | ||
| 285 | - background-color: #f0f0f0; | ||
| 286 | - } | ||
| 287 | - | ||
| 288 | - .line { | ||
| 289 | - height: 4px; | ||
| 290 | - } | ||
| 291 | - | ||
| 292 | - .scrollview { | ||
| 293 | - flex: 1; | ||
| 294 | - } | ||
| 295 | -</style> |
pages/component/map/map.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-common-mt"> | ||
| 5 | - <view> | ||
| 6 | - <map :latitude="latitude" :longitude="longitude" :markers="covers"> | ||
| 7 | - </map> | ||
| 8 | - </view> | ||
| 9 | - </view> | ||
| 10 | - </view> | ||
| 11 | -</template> | ||
| 12 | -<script> | ||
| 13 | - export default { | ||
| 14 | - data() { | ||
| 15 | - return { | ||
| 16 | - title: 'map', | ||
| 17 | - latitude: 39.909, | ||
| 18 | - longitude: 116.39742, | ||
| 19 | - covers: [{ | ||
| 20 | - latitude: 39.9085, | ||
| 21 | - longitude: 116.39747, | ||
| 22 | - // #ifdef APP-PLUS | ||
| 23 | - iconPath: '../../../static/app-plus/location@3x.png', | ||
| 24 | - // #endif | ||
| 25 | - // #ifndef APP-PLUS | ||
| 26 | - iconPath: '../../../static/location.png', | ||
| 27 | - // #endif | ||
| 28 | - }, { | ||
| 29 | - latitude: 39.90, | ||
| 30 | - longitude: 116.39, | ||
| 31 | - // #ifdef APP-PLUS | ||
| 32 | - iconPath: '../../../static/app-plus/location@3x.png', | ||
| 33 | - // #endif | ||
| 34 | - // #ifndef APP-PLUS | ||
| 35 | - iconPath: '../../../static/location.png', | ||
| 36 | - // #endif | ||
| 37 | - }] | ||
| 38 | - } | ||
| 39 | - }, | ||
| 40 | - methods: { | ||
| 41 | - | ||
| 42 | - } | ||
| 43 | - } | ||
| 44 | -</script> | ||
| 45 | -<style> | ||
| 46 | - map { | ||
| 47 | - width: 100%; | ||
| 48 | - height: 600rpx; | ||
| 49 | - } | ||
| 50 | -</style> |
pages/component/movable-view/movable-view.vue deleted
| 1 | -<template> | ||
| 2 | - <view class="page-body"> | ||
| 3 | - <page-head title="movable-view,可拖动视图"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-title uni-common-mt"> | ||
| 6 | - 示例 1 | ||
| 7 | - <text>\nmovable-view 区域小于 movable-area</text> | ||
| 8 | - </view> | ||
| 9 | - <movable-area> | ||
| 10 | - <movable-view :x="x" :y="y" direction="all" @change="onChange">text</movable-view> | ||
| 11 | - </movable-area> | ||
| 12 | - <view @tap="tap" class="uni-link uni-center uni-common-mt"> | ||
| 13 | - 点击这里移动至 (30px, 30px) | ||
| 14 | - </view> | ||
| 15 | - <view class="uni-title uni-common-mt"> | ||
| 16 | - 示例 2 | ||
| 17 | - <text>\nmovable-view区域大于movable-area</text> | ||
| 18 | - </view> | ||
| 19 | - <movable-area> | ||
| 20 | - <movable-view class="max" direction="all">text</movable-view> | ||
| 21 | - </movable-area> | ||
| 22 | - <view class="uni-title uni-common-mt"> | ||
| 23 | - 示例 3 | ||
| 24 | - <text>\n只可以横向移动</text> | ||
| 25 | - </view> | ||
| 26 | - <movable-area> | ||
| 27 | - <movable-view direction="horizontal">text</movable-view> | ||
| 28 | - </movable-area> | ||
| 29 | - <view class="uni-title uni-common-mt"> | ||
| 30 | - 示例 4 | ||
| 31 | - <text>\n只可以纵向移动</text> | ||
| 32 | - </view> | ||
| 33 | - <movable-area> | ||
| 34 | - <movable-view direction="vertical">text</movable-view> | ||
| 35 | - </movable-area> | ||
| 36 | - <view class="uni-title uni-common-mt"> | ||
| 37 | - 示例 5 | ||
| 38 | - <text>\n可超出边界</text> | ||
| 39 | - </view> | ||
| 40 | - <movable-area> | ||
| 41 | - <movable-view direction="all" out-of-bounds>text</movable-view> | ||
| 42 | - </movable-area> | ||
| 43 | - <view class="uni-title uni-common-mt"> | ||
| 44 | - 示例 6 | ||
| 45 | - <text>\n带有惯性</text> | ||
| 46 | - </view> | ||
| 47 | - <movable-area> | ||
| 48 | - <movable-view direction="all" inertia>text</movable-view> | ||
| 49 | - </movable-area> | ||
| 50 | - <view class="uni-title uni-common-mt"> | ||
| 51 | - 示例 7 | ||
| 52 | - <text>\n可放缩</text> | ||
| 53 | - </view> | ||
| 54 | - <movable-area scale-area> | ||
| 55 | - <movable-view direction="all" @scale="onScale" scale scale-min="0.5" scale-max="4" :scale-value="scale">text</movable-view> | ||
| 56 | - </movable-area> | ||
| 57 | - <view @tap="tap2" class="uni-link uni-center uni-common-mt" style="padding-bottom:80rpx;"> | ||
| 58 | - 点击这里放大3倍 | ||
| 59 | - </view> | ||
| 60 | - </view> | ||
| 61 | - </view> | ||
| 62 | -</template> | ||
| 63 | - | ||
| 64 | -<script> | ||
| 65 | - export default { | ||
| 66 | - data() { | ||
| 67 | - return { | ||
| 68 | - x: 0, | ||
| 69 | - y: 0, | ||
| 70 | - scale: 2, | ||
| 71 | - old: { | ||
| 72 | - x: 0, | ||
| 73 | - y: 0, | ||
| 74 | - scale: 2 | ||
| 75 | - } | ||
| 76 | - } | ||
| 77 | - }, | ||
| 78 | - methods: { | ||
| 79 | - tap: function(e) { | ||
| 80 | - // 解决view层不同步的问题 | ||
| 81 | - this.x = this.old.x | ||
| 82 | - this.y = this.old.y | ||
| 83 | - this.$nextTick(function() { | ||
| 84 | - this.x = 30 | ||
| 85 | - this.y = 30 | ||
| 86 | - }) | ||
| 87 | - }, | ||
| 88 | - tap2() { | ||
| 89 | - // 解决view层不同步的问题 | ||
| 90 | - this.scale = this.old.scale | ||
| 91 | - this.scale = this.old.scale | ||
| 92 | - this.$nextTick(function() { | ||
| 93 | - this.scale = 3 | ||
| 94 | - }) | ||
| 95 | - }, | ||
| 96 | - onChange: function(e) { | ||
| 97 | - this.old.x = e.detail.x | ||
| 98 | - this.old.y = e.detail.y | ||
| 99 | - }, | ||
| 100 | - onScale: function(e) { | ||
| 101 | - this.old.scale = e.detail.scale | ||
| 102 | - } | ||
| 103 | - } | ||
| 104 | - } | ||
| 105 | -</script> | ||
| 106 | - | ||
| 107 | -<style> | ||
| 108 | - movable-view { | ||
| 109 | - display: flex; | ||
| 110 | - align-items: center; | ||
| 111 | - justify-content: center; | ||
| 112 | - height: 150rpx; | ||
| 113 | - width: 150rpx; | ||
| 114 | - background-color: #007AFF; | ||
| 115 | - color: #fff; | ||
| 116 | - } | ||
| 117 | - | ||
| 118 | - movable-area { | ||
| 119 | - height: 300rpx; | ||
| 120 | - width: 100%; | ||
| 121 | - background-color: #D8D8D8; | ||
| 122 | - overflow: hidden; | ||
| 123 | - } | ||
| 124 | - | ||
| 125 | - .max { | ||
| 126 | - width:500rpx; | ||
| 127 | - height: 500rpx; | ||
| 128 | - } | ||
| 129 | -</style> | ||
| 130 | \ No newline at end of file | 0 | \ No newline at end of file |
pages/component/navigator/navigate/navigate.vue deleted
pages/component/navigator/navigator.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-btn-v"> | ||
| 6 | - <navigator url="navigate/navigate?title=navigate" hover-class="navigator-hover"> | ||
| 7 | - <button type="default">跳转到新页面</button> | ||
| 8 | - </navigator> | ||
| 9 | - <navigator url="redirect/redirect?title=redirect" open-type="redirect" hover-class="other-navigator-hover"> | ||
| 10 | - <button type="default">在当前页打开</button> | ||
| 11 | - </navigator> | ||
| 12 | - <navigator v-if="!hasLeftWin" url="/pages/tabBar/extUI/extUI" open-type="switchTab" hover-class="other-navigator-hover"> | ||
| 13 | - <button type="default">跳转tab页面</button> | ||
| 14 | - </navigator> | ||
| 15 | - </view> | ||
| 16 | - </view> | ||
| 17 | - </view> | ||
| 18 | -</template> | ||
| 19 | -<script> | ||
| 20 | - import { mapState } from 'vuex' | ||
| 21 | - export default { | ||
| 22 | - data() { | ||
| 23 | - return { | ||
| 24 | - title: 'navigator' | ||
| 25 | - } | ||
| 26 | - }, | ||
| 27 | - computed: { | ||
| 28 | - ...mapState({ | ||
| 29 | - hasLeftWin: state => !state.noMatchLeftWindow | ||
| 30 | - }) | ||
| 31 | - }, | ||
| 32 | - } | ||
| 33 | -</script> |
pages/component/navigator/redirect/redirect.vue deleted
pages/component/picker-view/picker-view.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-title"> | ||
| 6 | - 日期：{{year}}年{{month}}月{{day}}日 | ||
| 7 | - </view> | ||
| 8 | - </view> | ||
| 9 | - <picker-view v-if="visible" :indicator-style="indicatorStyle" :mask-style="maskStyle" :value="value" @change="bindChange"> | ||
| 10 | - <picker-view-column> | ||
| 11 | - <view class="item" v-for="(item,index) in years" :key="index">{{item}}年</view> | ||
| 12 | - </picker-view-column> | ||
| 13 | - <picker-view-column> | ||
| 14 | - <view class="item" v-for="(item,index) in months" :key="index">{{item}}月</view> | ||
| 15 | - </picker-view-column> | ||
| 16 | - <picker-view-column> | ||
| 17 | - <view class="item" v-for="(item,index) in days" :key="index">{{item}}日</view> | ||
| 18 | - </picker-view-column> | ||
| 19 | - </picker-view> | ||
| 20 | - </view> | ||
| 21 | -</template> | ||
| 22 | - | ||
| 23 | -<script> | ||
| 24 | - export default { | ||
| 25 | - data () { | ||
| 26 | - const date = new Date() | ||
| 27 | - const years = [] | ||
| 28 | - const year = date.getFullYear() | ||
| 29 | - const months = [] | ||
| 30 | - const month = date.getMonth() + 1 | ||
| 31 | - const days = [] | ||
| 32 | - const day = date.getDate() | ||
| 33 | - | ||
| 34 | - for (let i = 1990; i <= date.getFullYear(); i++) { | ||
| 35 | - years.push(i) | ||
| 36 | - } | ||
| 37 | - | ||
| 38 | - for (let i = 1; i <= 12; i++) { | ||
| 39 | - months.push(i) | ||
| 40 | - } | ||
| 41 | - | ||
| 42 | - for (let i = 1; i <= 31; i++) { | ||
| 43 | - days.push(i) | ||
| 44 | - } | ||
| 45 | - return { | ||
| 46 | - title: 'picker-view', | ||
| 47 | - years, | ||
| 48 | - year, | ||
| 49 | - months, | ||
| 50 | - month, | ||
| 51 | - days, | ||
| 52 | - day, | ||
| 53 | - value: [9999, month - 1, day - 1], | ||
| 54 | - /** | ||
| 55 | - * 解决动态设置indicator-style不生效的问题 | ||
| 56 | - */ | ||
| 57 | - visible: true, | ||
| 58 | - // indicatorStyle: `height: ${Math.round(uni.getSystemInfoSync().screenWidth/(750/100))}px;` | ||
| 59 | - indicatorStyle: `height: 50px;`, | ||
| 60 | - // #ifdef MP-KUAISHOU | ||
| 61 | - maskStyle: "padding:10px 0" | ||
| 62 | - // #endif | ||
| 63 | - // #ifndef MP-KUAISHOU | ||
| 64 | - maskStyle: "" | ||
| 65 | - // #endif | ||
| 66 | - } | ||
| 67 | - }, | ||
| 68 | - methods: { | ||
| 69 | - bindChange (e) { | ||
| 70 | - const val = e.detail.value | ||
| 71 | - this.year = this.years[val[0]] | ||
| 72 | - this.month = this.months[val[1]] | ||
| 73 | - this.day = this.days[val[2]] | ||
| 74 | - } | ||
| 75 | - } | ||
| 76 | - } | ||
| 77 | -</script> | ||
| 78 | - | ||
| 79 | -<style> | ||
| 80 | - | ||
| 81 | - picker-view { | ||
| 82 | - width: 100%; | ||
| 83 | - height: 600rpx; | ||
| 84 | - margin-top:20rpx; | ||
| 85 | - } | ||
| 86 | - | ||
| 87 | - .item { | ||
| 88 | - line-height: 100rpx; | ||
| 89 | - text-align: center; | ||
| 90 | - } | ||
| 91 | -</style> |
pages/component/picker/picker.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-title uni-common-pl">普通选择器</view> | ||
| 5 | - <view class="uni-list"> | ||
| 6 | - <view class="uni-list-cell"> | ||
| 7 | - <view class="uni-list-cell-left"> | ||
| 8 | - 当前选择 | ||
| 9 | - </view> | ||
| 10 | - <view class="uni-list-cell-db"> | ||
| 11 | - <picker @change="bindPickerChange" :value="index" :range="array" range-key="name"> | ||
| 12 | - <view class="uni-input">{{array[index].name}}</view> | ||
| 13 | - </picker> | ||
| 14 | - </view> | ||
| 15 | - </view> | ||
| 16 | - </view> | ||
| 17 | - | ||
| 18 | - <!-- #ifndef MP-ALIPAY --> | ||
| 19 | - <view class="uni-title uni-common-pl">多列选择器</view> | ||
| 20 | - <view class="uni-list"> | ||
| 21 | - <view class="uni-list-cell"> | ||
| 22 | - <view class="uni-list-cell-left"> | ||
| 23 | - 当前选择 | ||
| 24 | - </view> | ||
| 25 | - <view class="uni-list-cell-db"> | ||
| 26 | - <picker mode="multiSelector" @columnchange="bindMultiPickerColumnChange" :value="multiIndex" :range="multiArray"> | ||
| 27 | - <view class="uni-input">{{multiArray[0][multiIndex[0]]}}，{{multiArray[1][multiIndex[1]]}}，{{multiArray[2][multiIndex[2]]}}</view> | ||
| 28 | - </picker> | ||
| 29 | - </view> | ||
| 30 | - </view> | ||
| 31 | - </view> | ||
| 32 | - <!-- #endif --> | ||
| 33 | - | ||
| 34 | - <view class="uni-title uni-common-pl">时间选择器</view> | ||
| 35 | - <view class="uni-list"> | ||
| 36 | - <view class="uni-list-cell"> | ||
| 37 | - <view class="uni-list-cell-left"> | ||
| 38 | - 当前选择 | ||
| 39 | - </view> | ||
| 40 | - <view class="uni-list-cell-db"> | ||
| 41 | - <picker mode="time" :value="time" start="09:01" end="21:01" @change="bindTimeChange"> | ||
| 42 | - <view class="uni-input">{{time}}</view> | ||
| 43 | - </picker> | ||
| 44 | - </view> | ||
| 45 | - </view> | ||
| 46 | - </view> | ||
| 47 | - <view class="uni-picker-tips"> | ||
| 48 | - 注：选择 09:01 ~ 21:01 之间的时间, 不在区间内不能选中 | ||
| 49 | - </view> | ||
| 50 | - | ||
| 51 | - <view class="uni-title uni-common-pl">日期选择器</view> | ||
| 52 | - <view class="uni-list"> | ||
| 53 | - <view class="uni-list-cell"> | ||
| 54 | - <view class="uni-list-cell-left"> | ||
| 55 | - 当前选择 | ||
| 56 | - </view> | ||
| 57 | - <view class="uni-list-cell-db"> | ||
| 58 | - <picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange"> | ||
| 59 | - <view class="uni-input">{{date}}</view> | ||
| 60 | - </picker> | ||
| 61 | - </view> | ||
| 62 | - </view> | ||
| 63 | - </view> | ||
| 64 | - <view class="uni-picker-tips"> | ||
| 65 | - 注：选择当前时间 ±10 年之间的时间, 不在区间内不能选中 | ||
| 66 | - </view> | ||
| 67 | - </view> | ||
| 68 | -</template> | ||
| 69 | -<script> | ||
| 70 | - | ||
| 71 | - function getDate(type) { | ||
| 72 | - const date = new Date(); | ||
| 73 | - | ||
| 74 | - let year = date.getFullYear(); | ||
| 75 | - let month = date.getMonth() + 1; | ||
| 76 | - let day = date.getDate(); | ||
| 77 | - | ||
| 78 | - if (type === 'start') { | ||
| 79 | - year = year - 10; | ||
| 80 | - } else if (type === 'end') { | ||
| 81 | - year = year + 10; | ||
| 82 | - } | ||
| 83 | - month = month > 9 ? month : '0' + month;; | ||
| 84 | - day = day > 9 ? day : '0' + day; | ||
| 85 | - | ||
| 86 | - return `${year}-${month}-${day}`; | ||
| 87 | - } | ||
| 88 | - export default { | ||
| 89 | - data() { | ||
| 90 | - return { | ||
| 91 | - title: 'picker', | ||
| 92 | - array: [{name:'中国'},{name: '美国'}, {name:'巴西'}, {name:'日本'}], | ||
| 93 | - index: 0, | ||
| 94 | - multiArray: [ | ||
| 95 | - ['亚洲', '欧洲'], | ||
| 96 | - ['中国', '日本'], | ||
| 97 | - ['北京', '上海', '广州'] | ||
| 98 | - ], | ||
| 99 | - multiIndex: [0, 0, 0], | ||
| 100 | - date: getDate({ | ||
| 101 | - format: true | ||
| 102 | - }), | ||
| 103 | - startDate:getDate('start'), | ||
| 104 | - endDate:getDate('end'), | ||
| 105 | - time: '12:01' | ||
| 106 | - } | ||
| 107 | - }, | ||
| 108 | - methods: { | ||
| 109 | - bindPickerChange: function(e) { | ||
| 110 | - console.log('picker发送选择改变，携带值为：' + e.detail.value) | ||
| 111 | - this.index = e.detail.value | ||
| 112 | - }, | ||
| 113 | - bindMultiPickerColumnChange: function(e) { | ||
| 114 | - console.log('修改的列为：' + e.detail.column + '，值为：' + e.detail.value) | ||
| 115 | - this.multiIndex[e.detail.column] = e.detail.value | ||
| 116 | - switch (e.detail.column) { | ||
| 117 | - case 0: //拖动第1列 | ||
| 118 | - switch (this.multiIndex[0]) { | ||
| 119 | - case 0: | ||
| 120 | - this.multiArray[1] = ['中国', '日本'] | ||
| 121 | - this.multiArray[2] = ['北京', '上海', '广州'] | ||
| 122 | - break | ||
| 123 | - case 1: | ||
| 124 | - this.multiArray[1] = ['英国', '法国'] | ||
| 125 | - this.multiArray[2] = ['伦敦', '曼彻斯特'] | ||
| 126 | - break | ||
| 127 | - } | ||
| 128 | - this.multiIndex.splice(1, 1, 0) | ||
| 129 | - this.multiIndex.splice(2, 1, 0) | ||
| 130 | - break | ||
| 131 | - case 1: //拖动第2列 | ||
| 132 | - switch (this.multiIndex[0]) { //判断第一列是什么 | ||
| 133 | - case 0: | ||
| 134 | - switch (this.multiIndex[1]) { | ||
| 135 | - case 0: | ||
| 136 | - this.multiArray[2] = ['北京', '上海', '广州'] | ||
| 137 | - break | ||
| 138 | - case 1: | ||
| 139 | - this.multiArray[2] = ['东京','北海道'] | ||
| 140 | - break | ||
| 141 | - } | ||
| 142 | - break | ||
| 143 | - case 1: | ||
| 144 | - switch (this.multiIndex[1]) { | ||
| 145 | - case 0: | ||
| 146 | - this.multiArray[2] = ['伦敦', '曼彻斯特'] | ||
| 147 | - break | ||
| 148 | - case 1: | ||
| 149 | - this.multiArray[2] = ['巴黎', '马赛'] | ||
| 150 | - break | ||
| 151 | - } | ||
| 152 | - break | ||
| 153 | - } | ||
| 154 | - this.multiIndex.splice(2, 1, 0) | ||
| 155 | - break | ||
| 156 | - } | ||
| 157 | - this.$forceUpdate() | ||
| 158 | - }, | ||
| 159 | - bindDateChange: function(e) { | ||
| 160 | - this.date = e.detail.value | ||
| 161 | - }, | ||
| 162 | - bindTimeChange: function(e) { | ||
| 163 | - this.time = e.detail.value | ||
| 164 | - } | ||
| 165 | - | ||
| 166 | - } | ||
| 167 | - } | ||
| 168 | -</script> | ||
| 169 | - | ||
| 170 | -<style> | ||
| 171 | -.uni-picker-tips { | ||
| 172 | - font-size: 12px; | ||
| 173 | - color: #666; | ||
| 174 | - margin-bottom: 15px; | ||
| 175 | - padding: 0 15px; | ||
| 176 | - /* text-align: right; */ | ||
| 177 | -} | ||
| 178 | -</style> |
pages/component/progress/progress.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="progress-box"> | ||
| 6 | - <progress :percent="pgList[0]" show-info stroke-width="3" /> | ||
| 7 | - </view> | ||
| 8 | - <view class="progress-box"> | ||
| 9 | - <progress :percent="pgList[1]" stroke-width="3" /> | ||
| 10 | - <uni-icons type="close" class="progress-cancel" color="#dd524d"></uni-icons> | ||
| 11 | - </view> | ||
| 12 | - <view class="progress-box"> | ||
| 13 | - <progress :percent="pgList[2]" stroke-width="3" /> | ||
| 14 | - </view> | ||
| 15 | - <view class="progress-box"> | ||
| 16 | - <progress :percent="pgList[3]" activeColor="#10AEFF" stroke-width="3" /> | ||
| 17 | - </view> | ||
| 18 | - <view class="progress-control"> | ||
| 19 | - <button type="primary" @click="setProgress">设置进度</button> | ||
| 20 | - <button type="warn" @click="clearProgress">清除进度</button> | ||
| 21 | - </view> | ||
| 22 | - </view> | ||
| 23 | - </view> | ||
| 24 | -</template> | ||
| 25 | -<script> | ||
| 26 | - export default { | ||
| 27 | - data() { | ||
| 28 | - return { | ||
| 29 | - title: 'progress', | ||
| 30 | - pgList: [0, 0, 0, 0] | ||
| 31 | - } | ||
| 32 | - }, | ||
| 33 | - methods: { | ||
| 34 | - setProgress() { | ||
| 35 | - this.pgList = [20, 40, 60, 80] | ||
| 36 | - }, | ||
| 37 | - clearProgress() { | ||
| 38 | - this.pgList = [0, 0, 0, 0] | ||
| 39 | - } | ||
| 40 | - } | ||
| 41 | - } | ||
| 42 | -</script> | ||
| 43 | - | ||
| 44 | -<style> | ||
| 45 | - .progress-box { | ||
| 46 | - display: flex; | ||
| 47 | - height: 50rpx; | ||
| 48 | - margin-bottom: 60rpx; | ||
| 49 | - } | ||
| 50 | - | ||
| 51 | - .uni-icon { | ||
| 52 | - line-height: 1.5; | ||
| 53 | - } | ||
| 54 | - | ||
| 55 | - .progress-cancel { | ||
| 56 | - margin-left: 40rpx; | ||
| 57 | - } | ||
| 58 | - | ||
| 59 | - .progress-control button{ | ||
| 60 | - margin-top: 20rpx; | ||
| 61 | - } | ||
| 62 | -</style> |
pages/component/radio/radio.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-title">默认样式</view> | ||
| 6 | - <view> | ||
| 7 | - <label class="radio" style="margin-right: 30rpx;"> | ||
| 8 | - <radio value="r1" checked="true" />选中 | ||
| 9 | - </label> | ||
| 10 | - <label class="radio"> | ||
| 11 | - <radio value="r2" />未选中 | ||
| 12 | - </label> | ||
| 13 | - </view> | ||
| 14 | - </view> | ||
| 15 | - <view class="uni-padding-wrap"> | ||
| 16 | - <view class="uni-title">不同颜色和尺寸的radio</view> | ||
| 17 | - <view> | ||
| 18 | - <label class="radio" style="margin-right: 30rpx;"> | ||
| 19 | - <radio value="r1" checked="true" color="#FFCC33" style="transform:scale(0.7)"/>选中 | ||
| 20 | - </label> | ||
| 21 | - <label class="radio"> | ||
| 22 | - <radio value="r2" color="#FFCC33" style="transform:scale(0.7)"/>未选中 | ||
| 23 | - </label> | ||
| 24 | - </view> | ||
| 25 | - </view> | ||
| 26 | - <view class="uni-title uni-common-mt uni-common-pl">推荐展示样式</view> | ||
| 27 | - <view class="uni-list"> | ||
| 28 | - <radio-group @change="radioChange"> | ||
| 29 | - <label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in items" :key="item.value"> | ||
| 30 | - <view> | ||
| 31 | - <radio :value="item.value" :checked="index === current" /> | ||
| 32 | - </view> | ||
| 33 | - <view>{{item.name}}</view> | ||
| 34 | - </label> | ||
| 35 | - </radio-group> | ||
| 36 | - </view> | ||
| 37 | - </view> | ||
| 38 | -</template> | ||
| 39 | -<script> | ||
| 40 | - export default { | ||
| 41 | - data() { | ||
| 42 | - return { | ||
| 43 | - title: 'radio 单选框', | ||
| 44 | - items: [{ | ||
| 45 | - value: 'USA', | ||
| 46 | - name: '美国' | ||
| 47 | - }, | ||
| 48 | - { | ||
| 49 | - value: 'CHN', | ||
| 50 | - name: '中国', | ||
| 51 | - checked: 'true' | ||
| 52 | - }, | ||
| 53 | - { | ||
| 54 | - value: 'BRA', | ||
| 55 | - name: '巴西' | ||
| 56 | - }, | ||
| 57 | - { | ||
| 58 | - value: 'JPN', | ||
| 59 | - name: '日本' | ||
| 60 | - }, | ||
| 61 | - { | ||
| 62 | - value: 'ENG', | ||
| 63 | - name: '英国' | ||
| 64 | - }, | ||
| 65 | - { | ||
| 66 | - value: 'FRA', | ||
| 67 | - name: '法国' | ||
| 68 | - }, | ||
| 69 | - ], | ||
| 70 | - current: 0 | ||
| 71 | - } | ||
| 72 | - }, | ||
| 73 | - methods: { | ||
| 74 | - radioChange(evt) { | ||
| 75 | - for (let i = 0; i < this.items.length; i++) { | ||
| 76 | - if (this.items[i].value === evt.detail.value) { | ||
| 77 | - this.current = i; | ||
| 78 | - break; | ||
| 79 | - } | ||
| 80 | - } | ||
| 81 | - } | ||
| 82 | - } | ||
| 83 | - } | ||
| 84 | -</script> | ||
| 85 | - | ||
| 86 | -<style> | ||
| 87 | - .uni-list-cell { | ||
| 88 | - justify-content: flex-start | ||
| 89 | - } | ||
| 90 | -</style> |
pages/component/rich-text/rich-text.vue deleted
| 1 | -<template> | ||
| 2 | - <view class="content"> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap"> | ||
| 5 | - <view class="uni-title uni-common-mt"> | ||
| 6 | - 数组类型 | ||
| 7 | - <text>\nnodes属性为Array</text> | ||
| 8 | - </view> | ||
| 9 | - <view class="uni-common-mt" style="background:#FFF; padding:20rpx;"> | ||
| 10 | - <rich-text :nodes="nodes"></rich-text> | ||
| 11 | - </view> | ||
| 12 | - <!-- #ifndef MP-ALIPAY --> | ||
| 13 | - <view class="uni-title uni-common-mt"> | ||
| 14 | - 字符串类型 | ||
| 15 | - <text>\nnodes属性为String</text> | ||
| 16 | - </view> | ||
| 17 | - <view class="uni-common-mt" style="background:#FFF; padding:20rpx;"> | ||
| 18 | - <rich-text :nodes="strings"></rich-text> | ||
| 19 | - </view> | ||
| 20 | - <!-- #endif --> | ||
| 21 | - </view> | ||
| 22 | - </view> | ||
| 23 | -</template> | ||
| 24 | -<script> | ||
| 25 | - export default { | ||
| 26 | - data() { | ||
| 27 | - return { | ||
| 28 | - title: 'rich-text', | ||
| 29 | - nodes: [{ | ||
| 30 | - name: 'div', | ||
| 31 | - attrs: { | ||
| 32 | - class: 'div-class', | ||
| 33 | - style: 'line-height: 60px; color: red; text-align:center;' | ||
| 34 | - }, | ||
| 35 | - children: [{ | ||
| 36 | - type: 'text', | ||
| 37 | - text: 'Hello uni-app!' | ||
| 38 | - }] | ||
| 39 | - }], | ||
| 40 | - strings: '<div style="text-align:center;"><img src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/ceb770c0-5164-11eb-8a36-ebb87efcf8c0.png"/></div>' | ||
| 41 | - } | ||
| 42 | - } | ||
| 43 | - } | ||
| 44 | -</script> |
pages/component/scroll-view/scroll-view.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head title="scroll-view,区域滚动视图"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-title uni-common-mt"> | ||
| 6 | - Vertical Scroll | ||
| 7 | - <text>\n纵向滚动</text> | ||
| 8 | - </view> | ||
| 9 | - <view> | ||
| 10 | - <scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper" @scrolltolower="lower" | ||
| 11 | - @scroll="scroll"> | ||
| 12 | - <view id="demo1" class="scroll-view-item uni-bg-red">A</view> | ||
| 13 | - <view id="demo2" class="scroll-view-item uni-bg-green">B</view> | ||
| 14 | - <view id="demo3" class="scroll-view-item uni-bg-blue">C</view> | ||
| 15 | - </scroll-view> | ||
| 16 | - </view> | ||
| 17 | - <view @tap="goTop" class="uni-link uni-center uni-common-mt"> | ||
| 18 | - 点击这里返回顶部 | ||
| 19 | - </view> | ||
| 20 | - | ||
| 21 | - <view class="uni-title uni-common-mt"> | ||
| 22 | - Horizontal Scroll | ||
| 23 | - <text>\n横向滚动</text> | ||
| 24 | - </view> | ||
| 25 | - <view> | ||
| 26 | - <scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" scroll-left="120"> | ||
| 27 | - <view id="demo1" class="scroll-view-item_H uni-bg-red">A</view> | ||
| 28 | - <view id="demo2" class="scroll-view-item_H uni-bg-green">B</view> | ||
| 29 | - <view id="demo3" class="scroll-view-item_H uni-bg-blue">C</view> | ||
| 30 | - </scroll-view> | ||
| 31 | - </view> | ||
| 32 | - <view class="uni-common-pb"></view> | ||
| 33 | - </view> | ||
| 34 | - </view> | ||
| 35 | -</template> | ||
| 36 | -<script> | ||
| 37 | - export default { | ||
| 38 | - data() { | ||
| 39 | - return { | ||
| 40 | - scrollTop: 0, | ||
| 41 | - old: { | ||
| 42 | - scrollTop: 0 | ||
| 43 | - } | ||
| 44 | - } | ||
| 45 | - }, | ||
| 46 | - methods: { | ||
| 47 | - upper: function(e) { | ||
| 48 | - console.log(e) | ||
| 49 | - }, | ||
| 50 | - lower: function(e) { | ||
| 51 | - console.log(e) | ||
| 52 | - }, | ||
| 53 | - scroll: function(e) { | ||
| 54 | - console.log(e) | ||
| 55 | - this.old.scrollTop = e.detail.scrollTop | ||
| 56 | - }, | ||
| 57 | - goTop: function(e) { | ||
| 58 | - // 解决view层不同步的问题 | ||
| 59 | - this.scrollTop = this.old.scrollTop | ||
| 60 | - this.$nextTick(function() { | ||
| 61 | - this.scrollTop = 0 | ||
| 62 | - }); | ||
| 63 | - uni.showToast({ | ||
| 64 | - icon:"none", | ||
| 65 | - title:"纵向滚动 scrollTop 值已被修改为 0" | ||
| 66 | - }) | ||
| 67 | - } | ||
| 68 | - } | ||
| 69 | - } | ||
| 70 | -</script> | ||
| 71 | - | ||
| 72 | -<style> | ||
| 73 | - .scroll-Y { | ||
| 74 | - height: 300rpx; | ||
| 75 | - } | ||
| 76 | - | ||
| 77 | - .scroll-view_H { | ||
| 78 | - white-space: nowrap; | ||
| 79 | - width: 100%; | ||
| 80 | - } | ||
| 81 | - | ||
| 82 | - .scroll-view-item { | ||
| 83 | - height: 300rpx; | ||
| 84 | - line-height: 300rpx; | ||
| 85 | - text-align: center; | ||
| 86 | - font-size: 36rpx; | ||
| 87 | - } | ||
| 88 | - | ||
| 89 | - .scroll-view-item_H { | ||
| 90 | - display: inline-block; | ||
| 91 | - width: 100%; | ||
| 92 | - height: 300rpx; | ||
| 93 | - line-height: 300rpx; | ||
| 94 | - text-align: center; | ||
| 95 | - font-size: 36rpx; | ||
| 96 | - } | ||
| 97 | -</style> | ||
| 98 | \ No newline at end of file | 0 | \ No newline at end of file |
pages/component/slider/slider.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-title">显示当前value</view> | ||
| 6 | - <view> | ||
| 7 | - <slider value="50" @change="sliderChange" show-value /> | ||
| 8 | - </view> | ||
| 9 | - | ||
| 10 | - <view class="uni-title">设置步进step跳动</view> | ||
| 11 | - <view> | ||
| 12 | - <slider value="60" @change="sliderChange" step="5" /> | ||
| 13 | - </view> | ||
| 14 | - | ||
| 15 | - <view class="uni-title">设置最小/最大值</view> | ||
| 16 | - <view> | ||
| 17 | - <slider value="100" @change="sliderChange" min="50" max="200" show-value /> | ||
| 18 | - </view> | ||
| 19 | - | ||
| 20 | - <view class="uni-title">不同颜色和大小的滑块</view> | ||
| 21 | - <view> | ||
| 22 | - <slider value="50" @change="sliderChange" activeColor="#FFCC33" backgroundColor="#000000" block-color="#8A6DE9" block-size="20" /> | ||
| 23 | - </view> | ||
| 24 | - </view> | ||
| 25 | - </view> | ||
| 26 | -</template> | ||
| 27 | -<script> | ||
| 28 | - export default { | ||
| 29 | - data() { | ||
| 30 | - return { | ||
| 31 | - title: 'slider 滑块' | ||
| 32 | - } | ||
| 33 | - }, | ||
| 34 | - methods: { | ||
| 35 | - sliderChange(e) { | ||
| 36 | - console.log('value 发生变化：' + e.detail.value) | ||
| 37 | - } | ||
| 38 | - } | ||
| 39 | - } | ||
| 40 | -</script> |
pages/component/swiper/swiper.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head title="swiper,可滑动视图"></page-head> | ||
| 4 | - <view class="uni-margin-wrap"> | ||
| 5 | - <swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration"> | ||
| 6 | - <swiper-item> | ||
| 7 | - <view class="swiper-item uni-bg-red">A</view> | ||
| 8 | - </swiper-item> | ||
| 9 | - <swiper-item> | ||
| 10 | - <view class="swiper-item uni-bg-green">B</view> | ||
| 11 | - </swiper-item> | ||
| 12 | - <swiper-item> | ||
| 13 | - <view class="swiper-item uni-bg-blue">C</view> | ||
| 14 | - </swiper-item> | ||
| 15 | - </swiper> | ||
| 16 | - </view> | ||
| 17 | - | ||
| 18 | - <view class="swiper-list"> | ||
| 19 | - <view class="uni-list-cell uni-list-cell-pd"> | ||
| 20 | - <view class="uni-list-cell-db">指示点</view> | ||
| 21 | - <switch :checked="indicatorDots" @change="changeIndicatorDots" /> | ||
| 22 | - </view> | ||
| 23 | - <view class="uni-list-cell uni-list-cell-pd"> | ||
| 24 | - <view class="uni-list-cell-db">自动播放</view> | ||
| 25 | - <switch :checked="autoplay" @change="changeAutoplay" /> | ||
| 26 | - </view> | ||
| 27 | - </view> | ||
| 28 | - | ||
| 29 | - <view class="uni-padding-wrap"> | ||
| 30 | - <view class="uni-common-mt"> | ||
| 31 | - <text>幻灯片切换时长(ms)</text> | ||
| 32 | - <text class="info">{{duration}}</text> | ||
| 33 | - </view> | ||
| 34 | - <slider @change="durationChange" :value="duration" min="500" max="2000" /> | ||
| 35 | - <view class="uni-common-mt"> | ||
| 36 | - <text>自动播放间隔时长(ms)</text> | ||
| 37 | - <text class="info">{{interval}}</text> | ||
| 38 | - </view> | ||
| 39 | - <slider @change="intervalChange" :value="interval" min="2000" max="10000" /> | ||
| 40 | - </view> | ||
| 41 | - </view> | ||
| 42 | -</template> | ||
| 43 | -<script> | ||
| 44 | - export default { | ||
| 45 | - data() { | ||
| 46 | - return { | ||
| 47 | - background: ['color1', 'color2', 'color3'], | ||
| 48 | - indicatorDots: true, | ||
| 49 | - autoplay: true, | ||
| 50 | - interval: 2000, | ||
| 51 | - duration: 500 | ||
| 52 | - } | ||
| 53 | - }, | ||
| 54 | - methods: { | ||
| 55 | - changeIndicatorDots(e) { | ||
| 56 | - this.indicatorDots = !this.indicatorDots | ||
| 57 | - }, | ||
| 58 | - changeAutoplay(e) { | ||
| 59 | - this.autoplay = !this.autoplay | ||
| 60 | - }, | ||
| 61 | - intervalChange(e) { | ||
| 62 | - this.interval = e.detail.value | ||
| 63 | - }, | ||
| 64 | - durationChange(e) { | ||
| 65 | - this.duration = e.detail.value | ||
| 66 | - } | ||
| 67 | - } | ||
| 68 | - } | ||
| 69 | -</script> | ||
| 70 | - | ||
| 71 | -<style> | ||
| 72 | - .uni-margin-wrap { | ||
| 73 | - width:690rpx; | ||
| 74 | - width: 100%;; | ||
| 75 | - } | ||
| 76 | - .swiper { | ||
| 77 | - height: 300rpx; | ||
| 78 | - } | ||
| 79 | - .swiper-item { | ||
| 80 | - display: block; | ||
| 81 | - height: 300rpx; | ||
| 82 | - line-height: 300rpx; | ||
| 83 | - text-align: center; | ||
| 84 | - } | ||
| 85 | - | ||
| 86 | - .swiper-list { | ||
| 87 | - margin-top: 40rpx; | ||
| 88 | - margin-bottom: 0; | ||
| 89 | - } | ||
| 90 | - | ||
| 91 | - .uni-common-mt{ | ||
| 92 | - margin-top:60rpx; | ||
| 93 | - position:relative; | ||
| 94 | - } | ||
| 95 | - | ||
| 96 | - .info { | ||
| 97 | - position: absolute; | ||
| 98 | - right:20rpx; | ||
| 99 | - } | ||
| 100 | - | ||
| 101 | - .uni-padding-wrap { | ||
| 102 | - width:550rpx; | ||
| 103 | - padding:0 100rpx; | ||
| 104 | - } | ||
| 105 | -</style> |
pages/component/switch/switch.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-title">默认样式</view> | ||
| 6 | - <view> | ||
| 7 | - <switch checked @change="switch1Change" /> | ||
| 8 | - <switch @change="switch2Change" /> | ||
| 9 | - </view> | ||
| 10 | - <view class="uni-title">不同颜色和尺寸的switch</view> | ||
| 11 | - <view> | ||
| 12 | - <switch checked color="#FFCC33" style="transform:scale(0.7)"/> | ||
| 13 | - <switch color="#FFCC33" style="transform:scale(0.7)"/> | ||
| 14 | - </view> | ||
| 15 | - | ||
| 16 | - <view class="uni-title">推荐展示样式</view> | ||
| 17 | - </view> | ||
| 18 | - <view class="uni-list"> | ||
| 19 | - <view class="uni-list-cell uni-list-cell-pd"> | ||
| 20 | - <view class="uni-list-cell-db">开启中</view> | ||
| 21 | - <switch checked /> | ||
| 22 | - </view> | ||
| 23 | - <view class="uni-list-cell uni-list-cell-pd"> | ||
| 24 | - <view class="uni-list-cell-db">关闭</view> | ||
| 25 | - <switch /> | ||
| 26 | - </view> | ||
| 27 | - </view> | ||
| 28 | - </view> | ||
| 29 | -</template> | ||
| 30 | -<script> | ||
| 31 | - export default { | ||
| 32 | - data() { | ||
| 33 | - return { | ||
| 34 | - title: 'switch 开关' | ||
| 35 | - } | ||
| 36 | - }, | ||
| 37 | - methods: { | ||
| 38 | - switch1Change: function (e) { | ||
| 39 | - console.log('switch1 发生 change 事件，携带值为', e.detail.value) | ||
| 40 | - }, | ||
| 41 | - switch2Change: function (e) { | ||
| 42 | - console.log('switch2 发生 change 事件，携带值为', e.detail.value) | ||
| 43 | - } | ||
| 44 | - } | ||
| 45 | - } | ||
| 46 | -</script> | ||
| 47 | - |
pages/component/text/text.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="text-box" scroll-y="true"> | ||
| 6 | - <text>{{text}}</text> | ||
| 7 | - </view> | ||
| 8 | - <view class="uni-btn-v"> | ||
| 9 | - <button type="primary" :disabled="!canAdd" @click="add">add line</button> | ||
| 10 | - <button type="warn" :disabled="!canRemove" @click="remove">remove line</button> | ||
| 11 | - </view> | ||
| 12 | - </view> | ||
| 13 | - </view> | ||
| 14 | -</template> | ||
| 15 | -<script> | ||
| 16 | - export default { | ||
| 17 | - data() { | ||
| 18 | - return { | ||
| 19 | - title: 'text', | ||
| 20 | - texts: [ | ||
| 21 | - 'HBuilder，400万开发者选择的IDE', | ||
| 22 | - 'MUI，轻巧、漂亮的前端开源框架', | ||
| 23 | - 'wap2app，M站快速转换原生体验的App', | ||
| 24 | - '5+Runtime，为HTML5插上原生的翅膀', | ||
| 25 | - 'HBuilderX，轻巧、极速，极客编辑器', | ||
| 26 | - 'uni-app，终极跨平台方案', | ||
| 27 | - 'HBuilder，400万开发者选择的IDE', | ||
| 28 | - 'MUI，轻巧、漂亮的前端开源框架', | ||
| 29 | - 'wap2app，M站快速转换原生体验的App', | ||
| 30 | - '5+Runtime，为HTML5插上原生的翅膀', | ||
| 31 | - 'HBuilderX，轻巧、极速，极客编辑器', | ||
| 32 | - 'uni-app，终极跨平台方案', | ||
| 33 | - '......' | ||
| 34 | - ], | ||
| 35 | - text: '', | ||
| 36 | - canAdd: true, | ||
| 37 | - canRemove: false, | ||
| 38 | - extraLine: [] | ||
| 39 | - } | ||
| 40 | - }, | ||
| 41 | - methods: { | ||
| 42 | - add: function(e) { | ||
| 43 | - this.extraLine.push(this.texts[this.extraLine.length % 12]); | ||
| 44 | - this.text = this.extraLine.join('\n'); | ||
| 45 | - this.canAdd = this.extraLine.length < 12; | ||
| 46 | - this.canRemove = this.extraLine.length > 0; | ||
| 47 | - }, | ||
| 48 | - remove: function(e) { | ||
| 49 | - if (this.extraLine.length > 0) { | ||
| 50 | - this.extraLine.pop(); | ||
| 51 | - this.text = this.extraLine.join('\n'); | ||
| 52 | - this.canAdd = this.extraLine.length < 12; | ||
| 53 | - this.canRemove = this.extraLine.length > 0; | ||
| 54 | - } | ||
| 55 | - } | ||
| 56 | - } | ||
| 57 | - } | ||
| 58 | -</script> | ||
| 59 | - | ||
| 60 | -<style> | ||
| 61 | - .text-box { | ||
| 62 | - margin-bottom: 40rpx; | ||
| 63 | - padding: 40rpx 0; | ||
| 64 | - display: flex; | ||
| 65 | - min-height: 300rpx; | ||
| 66 | - background-color: #FFFFFF; | ||
| 67 | - justify-content: center; | ||
| 68 | - align-items: center; | ||
| 69 | - text-align: center; | ||
| 70 | - font-size: 30rpx; | ||
| 71 | - color: #353535; | ||
| 72 | - line-height: 1.8; | ||
| 73 | - } | ||
| 74 | -</style> |
pages/component/textarea/textarea.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-title uni-common-pl">输入区域高度自适应，不会出现滚动条</view> | ||
| 5 | - <view class="uni-textarea"> | ||
| 6 | - <textarea @blur="bindTextAreaBlur" auto-height /> | ||
| 7 | - </view> | ||
| 8 | - <view class="uni-title uni-common-pl">占位符字体是红色的textarea</view> | ||
| 9 | - <view class="uni-textarea"> | ||
| 10 | - <textarea placeholder-style="color:#F76260" placeholder="占位符字体是红色的"/> | ||
| 11 | - </view> | ||
| 12 | - </view> | ||
| 13 | -</template> | ||
| 14 | -<script> | ||
| 15 | - export default { | ||
| 16 | - data() { | ||
| 17 | - return { | ||
| 18 | - title: 'textarea', | ||
| 19 | - focus: false | ||
| 20 | - } | ||
| 21 | - }, | ||
| 22 | - methods: { | ||
| 23 | - bindTextAreaBlur: function (e) { | ||
| 24 | - console.log(e.detail.value) | ||
| 25 | - } | ||
| 26 | - } | ||
| 27 | - } | ||
| 28 | -</script> | ||
| 29 | - | ||
| 30 | -<style> | ||
| 31 | -</style> |
pages/component/video/video.nvue deleted
| 1 | -<template> | ||
| 2 | - <div> | ||
| 3 | - <video id='video1' class="video" :src="src" autoplay="false" duration="" controls="true" :danmu-list="list" | ||
| 4 | - danmu-btn="true" enable-danmu="true" :loop="true" muted="true" initial-time="" direction="-90" | ||
| 5 | - show-mute-btn="true" @play="onstart" @pause="onpause" @ended="onfinish" @error="onfail" @waiting="waiting" | ||
| 6 | - @timeupdate="timeupdate" @fullscreenchange="fullscreenchange"></video> | ||
| 7 | - <button class="btn" @click="play">播放</button> | ||
| 8 | - <button class="btn" @click="pause">暂停</button> | ||
| 9 | - <button class="btn" @click="seek">跳转到指定位置</button> | ||
| 10 | - <button class="btn" @click="stop">停止</button> | ||
| 11 | - <button class="btn" @click="fullScreen">全屏</button> | ||
| 12 | - <button class="btn" @click="exitFullScreen">退出全屏</button> | ||
| 13 | - <button class="btn" @click="playbackRate">设置倍速</button> | ||
| 14 | - <button class="btn" @click="sendDanmu">发送弹幕</button> | ||
| 15 | - </div> | ||
| 16 | -</template> | ||
| 17 | - | ||
| 18 | -<script> | ||
| 19 | - export default { | ||
| 20 | - data() { | ||
| 21 | - return { | ||
| 22 | - src: "https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20181126-lite.m4v", | ||
| 23 | - fil: true, | ||
| 24 | - list: [{ | ||
| 25 | - text: '要显示的文本', | ||
| 26 | - color: '#FF0000', | ||
| 27 | - time: 9 | ||
| 28 | - }] | ||
| 29 | - } | ||
| 30 | - }, | ||
| 31 | - onReady() { | ||
| 32 | - this.context = uni.createVideoContext("video1", this); | ||
| 33 | - }, | ||
| 34 | - methods: { | ||
| 35 | - onstart(e) { | ||
| 36 | - console.log("onstart:" + JSON.stringify(e)); | ||
| 37 | - }, | ||
| 38 | - onpause(e) { | ||
| 39 | - console.log("onpause:" + JSON.stringify(e)); | ||
| 40 | - }, | ||
| 41 | - onfinish(e) { | ||
| 42 | - console.log("onfinish:" + JSON.stringify(e)); | ||
| 43 | - }, | ||
| 44 | - onfail(e) { | ||
| 45 | - console.log("onfail:" + JSON.stringify(e)); | ||
| 46 | - }, | ||
| 47 | - fullscreenchange(e) { | ||
| 48 | - console.log("fullscreenchange:" + JSON.stringify(e)); | ||
| 49 | - }, | ||
| 50 | - waiting(e) { | ||
| 51 | - console.log("waiting:" + JSON.stringify(e)); | ||
| 52 | - }, | ||
| 53 | - timeupdate(e) { | ||
| 54 | - console.log("timeupdate:" + JSON.stringify(e)); | ||
| 55 | - }, | ||
| 56 | - | ||
| 57 | - play() { | ||
| 58 | - this.context.play(); | ||
| 59 | - }, | ||
| 60 | - pause() { | ||
| 61 | - this.context.pause(); | ||
| 62 | - }, | ||
| 63 | - seek() { | ||
| 64 | - this.context.seek(20); | ||
| 65 | - }, | ||
| 66 | - stop() { | ||
| 67 | - this.context.stop(); | ||
| 68 | - }, | ||
| 69 | - fullScreen() { | ||
| 70 | - this.context.requestFullScreen({ | ||
| 71 | - direction: 90 | ||
| 72 | - }); | ||
| 73 | - }, | ||
| 74 | - exitFullScreen() { | ||
| 75 | - this.context.exitFullScreen(); | ||
| 76 | - }, | ||
| 77 | - sendDanmu() { | ||
| 78 | - this.context.sendDanmu({ | ||
| 79 | - text: '要显示的弹幕文本', | ||
| 80 | - color: '#FF0000' | ||
| 81 | - }); | ||
| 82 | - }, | ||
| 83 | - playbackRate() { | ||
| 84 | - this.context.playbackRate(2); | ||
| 85 | - } | ||
| 86 | - } | ||
| 87 | - } | ||
| 88 | -</script> | ||
| 89 | - | ||
| 90 | -<style> | ||
| 91 | - .video { | ||
| 92 | - width: 750rpx; | ||
| 93 | - /* #ifdef H5 */ | ||
| 94 | - width: 100%; | ||
| 95 | - /* #endif */ | ||
| 96 | - height: 400rpx; | ||
| 97 | - background-color: #808080; | ||
| 98 | - } | ||
| 99 | - | ||
| 100 | - .btn { | ||
| 101 | - margin-top: 5px; | ||
| 102 | - margin-bottom: 5px; | ||
| 103 | - } | ||
| 104 | -</style> |
pages/component/video/video.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head :title="title"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt" v-if="showVideo"> | ||
| 5 | - <view> | ||
| 6 | - <video id="myVideo" src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20181126-lite.m4v" | ||
| 7 | - @error="videoErrorCallback" :danmu-list="danmuList" enable-danmu danmu-btn controls poster="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/b1476d40-4e5f-11eb-b997-9918a5dda011.png"></video> | ||
| 8 | - </view> | ||
| 9 | - <!-- #ifndef MP-ALIPAY || MP-TOUTIAO || MP-KUAISHOU || MP-LARK || MP-JD --> | ||
| 10 | - <view class="uni-list uni-common-mt"> | ||
| 11 | - <view class="uni-list-cell"> | ||
| 12 | - <view> | ||
| 13 | - <view class="uni-label">弹幕内容</view> | ||
| 14 | - </view> | ||
| 15 | - <view class="uni-list-cell-db"> | ||
| 16 | - <input v-model="danmuValue" class="uni-input" type="text" placeholder="在此处输入弹幕内容" /> | ||
| 17 | - </view> | ||
| 18 | - </view> | ||
| 19 | - </view> | ||
| 20 | - <view class="uni-btn-v"> | ||
| 21 | - <button @click="sendDanmu" class="page-body-button">发送弹幕</button> | ||
| 22 | - </view> | ||
| 23 | - <!-- #endif --> | ||
| 24 | - </view> | ||
| 25 | - </view> | ||
| 26 | -</template> | ||
| 27 | -<script> | ||
| 28 | - export default { | ||
| 29 | - data() { | ||
| 30 | - return { | ||
| 31 | - title: 'video', | ||
| 32 | - src: '', | ||
| 33 | - danmuList: [{ | ||
| 34 | - text: '第 1s 出现的弹幕', | ||
| 35 | - color: '#ff0000', | ||
| 36 | - time: 1 | ||
| 37 | - }, | ||
| 38 | - { | ||
| 39 | - text: '第 3s 出现的弹幕', | ||
| 40 | - color: '#ff00ff', | ||
| 41 | - time: 3 | ||
| 42 | - } | ||
| 43 | - ], | ||
| 44 | - danmuValue: '', | ||
| 45 | - showVideo: false | ||
| 46 | - } | ||
| 47 | - }, | ||
| 48 | - onReady: function(res) { | ||
| 49 | - // #ifndef MP-ALIPAY || MP-TOUTIAO | ||
| 50 | - this.videoContext = uni.createVideoContext('myVideo') | ||
| 51 | - // #endif | ||
| 52 | - // #ifdef APP-PLUS || MP-BAIDU | ||
| 53 | - setTimeout(()=>{ | ||
| 54 | - this.showVideo = true | ||
| 55 | - },350) | ||
| 56 | - // #endif | ||
| 57 | - // #ifndef APP-PLUS || MP-BAIDU | ||
| 58 | - this.showVideo = true | ||
| 59 | - // #endif | ||
| 60 | - }, | ||
| 61 | - methods: { | ||
| 62 | - sendDanmu: function() { | ||
| 63 | - this.videoContext.sendDanmu({ | ||
| 64 | - text: this.danmuValue, | ||
| 65 | - color: this.getRandomColor() | ||
| 66 | - }); | ||
| 67 | - this.danmuValue = ''; | ||
| 68 | - }, | ||
| 69 | - videoErrorCallback: function(e) { | ||
| 70 | - uni.showModal({ | ||
| 71 | - content: e.target.errMsg, | ||
| 72 | - showCancel: false | ||
| 73 | - }) | ||
| 74 | - }, | ||
| 75 | - getRandomColor: function() { | ||
| 76 | - const rgb = [] | ||
| 77 | - for (let i = 0; i < 3; ++i) { | ||
| 78 | - let color = Math.floor(Math.random() * 256).toString(16) | ||
| 79 | - color = color.length == 1 ? '0' + color : color | ||
| 80 | - rgb.push(color) | ||
| 81 | - } | ||
| 82 | - return '#' + rgb.join('') | ||
| 83 | - } | ||
| 84 | - } | ||
| 85 | - } | ||
| 86 | -</script> | ||
| 87 | - | ||
| 88 | -<style> | ||
| 89 | - video { | ||
| 90 | - width: 690rpx; | ||
| 91 | - width: 100%; | ||
| 92 | - height: 400px; | ||
| 93 | - } | ||
| 94 | -</style> |
pages/component/view/view.test.js deleted
| 1 | -describe('pages/component/view/view.vue', () => { | ||
| 2 | - let page | ||
| 3 | - beforeAll(async () => { | ||
| 4 | - // 重新reLaunch至首页，并获取首页page对象（其中 program 是uni-automator自动注入的全局对象） | ||
| 5 | - page = await program.reLaunch('/pages/component/view/view') | ||
| 6 | - await page.waitFor(1000) | ||
| 7 | - }) | ||
| 8 | - | ||
| 9 | - /** | ||
| 10 | - * 测试步骤 | ||
| 11 | - * 1. 检测页面标题是否为 view | ||
| 12 | - */ | ||
| 13 | - it('view 组件标题', async () => { | ||
| 14 | - let view = await page.$('.common-page-head-title') | ||
| 15 | - expect(await view.text()).toBe('view') | ||
| 16 | - }) | ||
| 17 | - /** | ||
| 18 | - * 测试步骤 | ||
| 19 | - * 1. uni-flex 的个数 | ||
| 20 | - * 2. flex-item 的个数 | ||
| 21 | - */ | ||
| 22 | - it('view 个数', async () => { | ||
| 23 | - let viewLen = await page.$$('.uni-flex') | ||
| 24 | - expect(viewLen.length).toBe(18) | ||
| 25 | - let viewItemLen = await page.$$('.flex-item') | ||
| 26 | - expect(viewItemLen.length).toBe(6) | ||
| 27 | - }) | ||
| 28 | - /** | ||
| 29 | - * 测试步骤 | ||
| 30 | - * 1. 第一个颜色块的色值是否为 rgb(247, 98, 96) | ||
| 31 | - */ | ||
| 32 | - it('view 前三个元素颜色', async () => { | ||
| 33 | - let viewRed = await page.$('.uni-bg-red') | ||
| 34 | - expect(await viewRed.style('backgroundColor')).toBe('rgb(247, 98, 96)') | ||
| 35 | - }) | ||
| 36 | -}) |
pages/component/view/view.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <page-head title="view"></page-head> | ||
| 4 | - <view class="uni-padding-wrap uni-common-mt"> | ||
| 5 | - <view class="uni-hello-text"> | ||
| 6 | - Flex是Flexible Box的缩写，意为“弹性布局”，用来为盒状模型提供最大的灵活性。当设置display: flex后，继续给view等容器组件设置flex-direction: | ||
| 7 | - row或column，就可以在该容器内按行或列排布子组件。uni-app推荐使用flex布局。因为flex布局有利于跨更多平台，尤其是采用原生渲染的平台。 | ||
| 8 | - </view> | ||
| 9 | - | ||
| 10 | - <view class="uni-title uni-common-mt"> | ||
| 11 | - flex-direction: row | ||
| 12 | - <text>\n横向布局</text> | ||
| 13 | - </view> | ||
| 14 | - <view class="uni-flex uni-row"> | ||
| 15 | - <view class="flex-item uni-bg-red">A</view> | ||
| 16 | - <view class="flex-item uni-bg-green">B</view> | ||
| 17 | - <view class="flex-item uni-bg-blue">C</view> | ||
| 18 | - </view> | ||
| 19 | - | ||
| 20 | - <view class="uni-title uni-common-mt"> | ||
| 21 | - flex-direction: column | ||
| 22 | - <text>\n纵向布局</text> | ||
| 23 | - </view> | ||
| 24 | - <view class="uni-flex uni-column"> | ||
| 25 | - <view class="flex-item flex-item-V uni-bg-red">A</view> | ||
| 26 | - <view class="flex-item flex-item-V uni-bg-green">B</view> | ||
| 27 | - <view class="flex-item flex-item-V uni-bg-blue">C</view> | ||
| 28 | - </view> | ||
| 29 | - | ||
| 30 | - <view class="uni-title uni-common-mt"> | ||
| 31 | - 更多布局示例 | ||
| 32 | - <text>\nflex布局演示</text> | ||
| 33 | - </view> | ||
| 34 | - <view> | ||
| 35 | - <view class="text">纵向布局-自动宽度</view> | ||
| 36 | - <view class="text" style="width: 300rpx;">纵向布局-固定宽度</view> | ||
| 37 | - <view class="uni-flex uni-row"> | ||
| 38 | - <view class="text">横向布局-自动宽度</view> | ||
| 39 | - <view class="text">横向布局-自动宽度</view> | ||
| 40 | - </view> | ||
| 41 | - <view class="uni-flex uni-row" style="-webkit-justify-content: center;justify-content: center;"> | ||
| 42 | - <view class="text">横向布局-居中</view> | ||
| 43 | - <view class="text">横向布局-居中</view> | ||
| 44 | - </view> | ||
| 45 | - <view class="uni-flex uni-row" style="-webkit-justify-content: flex-end;justify-content: flex-end;"> | ||
| 46 | - <view class="text">横向布局-居右</view> | ||
| 47 | - <view class="text">横向布局-居右</view> | ||
| 48 | - </view> | ||
| 49 | - <view class="uni-flex uni-row"> | ||
| 50 | - <view class="text" style="-webkit-flex: 1;flex: 1;">横向布局-平均分布</view> | ||
| 51 | - <view class="text" style="-webkit-flex: 1;flex: 1;">横向布局-平均分布</view> | ||
| 52 | - </view> | ||
| 53 | - <view class="uni-flex uni-row" style="-webkit-justify-content: space-between;justify-content: space-between;"> | ||
| 54 | - <view class="text">横向布局-两端对齐</view> | ||
| 55 | - <view class="text">横向布局-两端对齐</view> | ||
| 56 | - </view> | ||
| 57 | - <view class="uni-flex uni-row"> | ||
| 58 | - <view class="text" style="width: 200rpx;">固定宽度</view> | ||
| 59 | - <view class="text" style="-webkit-flex: 1;flex: 1;">自动占满余量</view> | ||
| 60 | - </view> | ||
| 61 | - <view class="uni-flex uni-row"> | ||
| 62 | - <view class="text" style="width: 200rpx;">固定宽度</view> | ||
| 63 | - <view class="text" style="-webkit-flex: 1;flex: 1;">自动占满</view> | ||
| 64 | - <view class="text" style="width: 200rpx;">固定宽度</view> | ||
| 65 | - </view> | ||
| 66 | - <view class="uni-flex uni-row" style="-webkit-flex-wrap: wrap;flex-wrap: wrap;"> | ||
| 67 | - <view class="text" style="width: 280rpx;">一行显示不全,wrap折行</view> | ||
| 68 | - <view class="text" style="width: 280rpx;">一行显示不全,wrap折行</view> | ||
| 69 | - <view class="text" style="width: 280rpx;">一行显示不全,wrap折行</view> | ||
| 70 | - </view> | ||
| 71 | - <view class="uni-flex uni-row"> | ||
| 72 | - <view class="text uni-flex" style="-webkit-flex: 1;flex: 1;height: 200rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: flex-start;align-items: flex-start;"> | ||
| 73 | - <text>垂直居顶</text> | ||
| 74 | - </view> | ||
| 75 | - <view class="text uni-flex" style="-webkit-flex: 1;flex: 1;height: 200rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;"> | ||
| 76 | - <text>垂直居中</text> | ||
| 77 | - </view> | ||
| 78 | - <view class="text uni-flex" style="-webkit-flex: 1;flex: 1;height: 200rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: flex-end;align-items: flex-end;"> | ||
| 79 | - <text>垂直居底</text> | ||
| 80 | - </view> | ||
| 81 | - </view> | ||
| 82 | - </view> | ||
| 83 | - | ||
| 84 | - <view class="uni-title uni-common-mt"> | ||
| 85 | - 组合示例 | ||
| 86 | - <text>\nflex布局演示</text> | ||
| 87 | - </view> | ||
| 88 | - <view class="uni-flex uni-row"> | ||
| 89 | - <view class="text uni-flex" style="width: 200rpx;height: 220rpx;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;"> | ||
| 90 | - <image src="../../../static/plus.png" style="width: 150rpx;height: 150rpx;"></image> | ||
| 91 | - </view> | ||
| 92 | - <view class="uni-flex uni-column" style="-webkit-flex: 1;flex: 1;-webkit-justify-content: space-between;justify-content: space-between;"> | ||
| 93 | - <view class="text" style="height: 120rpx;text-align: left;padding-left: 20rpx;padding-top: 10rpx;"> | ||
| 94 | - 文字居左，留出左间距 | ||
| 95 | - </view> | ||
| 96 | - <view class="uni-flex uni-row"> | ||
| 97 | - <view class="text" style="-webkit-flex: 1;flex: 1;">剩余数量</view> | ||
| 98 | - <view class="text" style="-webkit-flex: 1;flex: 1;">立即购买</view> | ||
| 99 | - </view> | ||
| 100 | - </view> | ||
| 101 | - </view> | ||
| 102 | - </view> | ||
| 103 | - </view> | ||
| 104 | -</template> | ||
| 105 | -<script> | ||
| 106 | - export default { | ||
| 107 | - data() { | ||
| 108 | - return {} | ||
| 109 | - } | ||
| 110 | - } | ||
| 111 | -</script> | ||
| 112 | - | ||
| 113 | -<style> | ||
| 114 | - .flex-item { | ||
| 115 | - width: 33.3%; | ||
| 116 | - height: 200rpx; | ||
| 117 | - text-align: center; | ||
| 118 | - line-height: 200rpx; | ||
| 119 | - } | ||
| 120 | - | ||
| 121 | - .flex-item-V { | ||
| 122 | - width: 100%; | ||
| 123 | - height: 150rpx; | ||
| 124 | - text-align: center; | ||
| 125 | - line-height: 150rpx; | ||
| 126 | - } | ||
| 127 | - | ||
| 128 | - .text { | ||
| 129 | - margin: 15rpx 10rpx; | ||
| 130 | - padding: 0 20rpx; | ||
| 131 | - background-color: #ebebeb; | ||
| 132 | - height: 70rpx; | ||
| 133 | - line-height: 70rpx; | ||
| 134 | - text-align: center; | ||
| 135 | - color: #777; | ||
| 136 | - font-size: 26rpx; | ||
| 137 | - } | ||
| 138 | - | ||
| 139 | - .desc { | ||
| 140 | - /* text-indent: 40rpx; */ | ||
| 141 | - } | ||
| 142 | - .flex-pc { | ||
| 143 | - display: flex; | ||
| 144 | - justify-content: center; | ||
| 145 | - } | ||
| 146 | -</style> |
pages/component/web-view-local/web-view-local.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <web-view src="/hybrid/html/local.html" @message="getMessage"></web-view> | ||
| 4 | - </view> | ||
| 5 | -</template> | ||
| 6 | - | ||
| 7 | -<script> | ||
| 8 | - export default { | ||
| 9 | - methods: { | ||
| 10 | - getMessage(e) { | ||
| 11 | - uni.showModal({ | ||
| 12 | - content: JSON.stringify(e.detail), | ||
| 13 | - showCancel: false | ||
| 14 | - }) | ||
| 15 | - } | ||
| 16 | - } | ||
| 17 | - } | ||
| 18 | -</script> | ||
| 19 | - | ||
| 20 | -<style> | ||
| 21 | - | ||
| 22 | -</style> |
pages/component/web-view/web-view.vue deleted
| 1 | -<template> | ||
| 2 | - <view> | ||
| 3 | - <web-view :src="url" @message="getMessage"></web-view> | ||
| 4 | - </view> | ||
| 5 | -</template> | ||
| 6 | - | ||
| 7 | -<script> | ||
| 8 | - export default { | ||
| 9 | - data() { | ||
| 10 | - return { | ||
| 11 | - url: 'https://uniapp.dcloud.io/static/web-view.html' | ||
| 12 | - } | ||
| 13 | - }, | ||
| 14 | - onLoad(options) { | ||
| 15 | - if (options && options.url) { | ||
| 16 | - this.url = options.url; | ||
| 17 | - } | ||
| 18 | - }, | ||
| 19 | - methods: { | ||
| 20 | - getMessage(event) { | ||
| 21 | - uni.showModal({ | ||
| 22 | - content: JSON.stringify(event.detail), | ||
| 23 | - showCancel: false | ||
| 24 | - }); | ||
| 25 | - } | ||
| 26 | - } | ||
| 27 | - } | ||
| 28 | -</script> | ||
| 29 | - | ||
| 30 | -<style> | ||
| 31 | - | ||
| 32 | -</style> |
pages/extUI/badge/badge.vue deleted
| 1 | -<template> | ||
| 2 | - <view class="container"> | ||
| 3 | - <uni-card is-full :is-shadow="false"> | ||
| 4 | - <text class="uni-h6">数字角标通用来标记重点信息使用，如接受到新消息、有未读消息等</text> | ||
| 5 | - </uni-card> | ||
| 6 | - <uni-section title="基础用法" type="line" padding> | ||
| 7 | - <view class="example-body"> | ||
| 8 | - <uni-badge class="uni-badge-left-margin" text="1" /> | ||
| 9 | - <uni-badge class="uni-badge-left-margin" text="2" type="primary" /> | ||
| 10 | - <uni-badge class="uni-badge-left-margin" text="34" type="success" /> | ||
| 11 | - <uni-badge class="uni-badge-left-margin" text="45" type="warning" /> | ||
| 12 | - <uni-badge class="uni-badge-left-margin" text="123" type="info" /> | ||
| 13 | - </view> | ||
| 14 | - </uni-section> | ||
| 15 | - <uni-section title="无底色" type="line" padding> | ||
| 16 | - <view class="example-body"> | ||
| 17 | - <uni-badge class="uni-badge-left-margin" :inverted="true" text="1" /> | ||
| 18 | - <uni-badge class="uni-badge-left-margin" :inverted="true" text="2" type="primary" /> | ||
| 19 | - <uni-badge class="uni-badge-left-margin" :inverted="true" text="34" type="success" /> | ||
| 20 | - <uni-badge class="uni-badge-left-margin" :inverted="true" text="45" type="warning" /> | ||
| 21 | - <uni-badge class="uni-badge-left-margin" :inverted="true" text="123" type="info" /> | ||
| 22 | - </view> | ||
| 23 | - </uni-section> | ||
| 24 | - | ||
| 25 | - <uni-section title="自定义样式" type="line" padding> | ||
| 26 | - <view class="example-body"> | ||
| 27 | - <uni-badge class="uni-badge-left-margin" text="2" type="primary" | ||
| 28 | - :customStyle="{background: '#4335d6'}" /> | ||
| 29 | - <uni-badge class="uni-badge-left-margin" text="2" type="primary" :customStyle="customStyle" /> | ||
| 30 | - </view> | ||
| 31 | - </uni-section> | ||
| 32 | - | ||
| 33 | - <uni-section title="定位: aboslute 属性" subTitle="注：在安卓端不支持 nvue" type="line" padding> | ||
| 34 | - <uni-badge class="uni-badge-left-margin" :text="value" absolute="rightTop" size="small"> | ||
| 35 | - <view class="box"><text class="box-text">右上</text></view> | ||
| 36 | - </uni-badge> | ||
| 37 | - </uni-section> | ||
| 38 | - | ||
| 39 | - <uni-section title="偏移: offset 属性(存在 aboslute)" type="line" padding> | ||
| 40 | - <uni-badge class="uni-badge-left-margin" :text="8" absolute="rightTop" :offset="[-3, -3]" size="small"> | ||
| 41 | - <view class="box"><text class="box-text">右上</text></view> | ||
| 42 | - </uni-badge> | ||
| 43 | - </uni-section> | ||
| 44 | - <uni-section title="仅显示点: is-dot 属性" type="line" padding> | ||
| 45 | - <uni-badge class="uni-badge-left-margin" :is-dot="true" :text="value" absolute="rightTop" size="small"> | ||
| 46 | - <view class="box"><text class="box-text">圆点</text></view> | ||
| 47 | - </uni-badge> | ||
| 48 | - </uni-section> | ||
| 49 | - </view> | ||
| 50 | -</template> | ||
| 51 | - | ||
| 52 | -<script> | ||
| 53 | - export default { | ||
| 54 | - components: {}, | ||
| 55 | - data() { | ||
| 56 | - return { | ||
| 57 | - value: 0, | ||
| 58 | - customStyle: { | ||
| 59 | - backgroundColor: '#62ed0d', | ||
| 60 | - color: '#fff' | ||
| 61 | - } | ||
| 62 | - }; | ||
| 63 | - }, | ||
| 64 | - mounted() { | ||
| 65 | - const timer = setInterval(() => { | ||
| 66 | - if (this.value >= 199) { | ||
| 67 | - clearInterval(timer) | ||
| 68 | - return | ||
| 69 | - } | ||
| 70 | - this.value++ | ||
| 71 | - }, 100) | ||
| 72 | - } | ||
| 73 | - }; | ||
| 74 | -</script> | ||
| 75 | - | ||
| 76 | -<style lang="scss"> | ||
| 77 | - /* #ifdef MP-ALIPAY */ | ||
| 78 | - .uni-badge { | ||
| 79 | - margin-left: 20rpx; | ||
| 80 | - } | ||
| 81 | - | ||
| 82 | - /* #endif */ | ||
| 83 | - .example-body { | ||
| 84 | - flex-direction: row; | ||
| 85 | - justify-content: flex-start; | ||
| 86 | - } | ||
| 87 | - | ||
| 88 | - .uni-badge-left-margin { | ||
| 89 | - margin-left: 10px; | ||
| 90 | - } | ||
| 91 | - | ||
| 92 | - .uni-badge-absolute { | ||
| 93 | - margin-left: 40px; | ||
| 94 | - } | ||
| 95 | - | ||
| 96 | - .box { | ||
| 97 | - width: 40px; | ||
| 98 | - height: 40px; | ||
| 99 | - display: flex; | ||
| 100 | - justify-content: center; | ||
| 101 | - align-items: center; | ||
| 102 | - text-align: center; | ||
| 103 | - background-color: #DCDFE6; | ||
| 104 | - color: #fff; | ||
| 105 | - font-size: 12px; | ||
| 106 | - } | ||
| 107 | - | ||
| 108 | - .box-text { | ||
| 109 | - text-align: center; | ||
| 110 | - color: #fff; | ||
| 111 | - font-size: 12px; | ||
| 112 | - } | ||
| 113 | -</style> |
pages/extUI/button/button.vue deleted
| 1 | -<template> | ||
| 2 | - <view class="container"> | ||
| 3 | - <!-- 暂时不支持 nvue --> | ||
| 4 | - <uni-card :is-shadow="false" is-full> | ||
| 5 | - <text class="uni-h6">使用 '.uni-btn' 样式，可对内置button组件设置样式</text> | ||
| 6 | - </uni-card> | ||
| 7 | - <uni-section title="按钮形状" sub-title="添加类名 .uni-btn-radius 可以使用圆角按钮" type="line"> | ||
| 8 | - <view class="uni-ma-5 uni-pb-5"> | ||
| 9 | - <button class="uni-btn">默认按钮</button> | ||
| 10 | - <button class="uni-btn uni-btn-radius " hover-class="hover-class">圆角</button> | ||
| 11 | - </view> | ||
| 12 | - </uni-section> | ||
| 13 | - <uni-section title="按钮形状(size=mini)" sub-title="添加类名 .uni-btn-radius 可以使用圆角按钮" type="line"> | ||
| 14 | - <view class="uni-ma-5 uni-pb-5"> | ||
| 15 | - <button class="uni-btn" size="mini">默认按钮</button> | ||
| 16 | - <button class="uni-btn uni-btn-radius" size="mini">圆角</button> | ||
| 17 | - </view> | ||
| 18 | - </uni-section> | ||
| 19 | - <uni-section title="普通按钮" sub-title="指定不同的 type 属性 ,展示不同类型按钮" type="line"> | ||
| 20 | - <view class="uni-ma-5 uni-pb-5"> | ||
| 21 | - <button class="uni-btn" type="default">default</button> | ||
| 22 | - <button class="uni-btn" type="primary">primary</button> | ||
| 23 | - <button class="uni-btn" type="success">success</button> | ||
| 24 | - <button class="uni-btn" type="warning">warning</button> | ||
| 25 | - <button class="uni-btn" type="error">error</button> | ||
| 26 | - <button class="uni-btn" type="info">info</button> | ||
| 27 | - </view> | ||
| 28 | - </uni-section> | ||
| 29 | - <uni-section title="普通按钮(size=mini)" sub-title="指定不同的 type 属性 ,展示不同类型按钮" type="line"> | ||
| 30 | - <view class="uni-ma-5 uni-pb-5"> | ||
| 31 | - <button class="uni-btn" size="mini">default</button> | ||
| 32 | - <button class="uni-btn" type="primary" size="mini">primary</button> | ||
| 33 | - <button class="uni-btn" type="success" size="mini">success</button> | ||
| 34 | - <button class="uni-btn" type="warning" size="mini">warning</button> | ||
| 35 | - <button class="uni-btn" type="error" size="mini">error</button> | ||
| 36 | - <button class="uni-btn" type="info" size="mini">info</button> | ||
| 37 | - </view> | ||
| 38 | - </uni-section> | ||
| 39 | - | ||
| 40 | - <uni-section title="镂空按钮" sub-title="添加类名 .uni-btn-plain 使用镂空按钮" type="line"> | ||
| 41 | - <view class="uni-ma-5 uni-pb-5"> | ||
| 42 | - <button class="uni-btn" plain>default</button> | ||
| 43 | - <button class="uni-btn" plain type="primary">primary</button> | ||
| 44 | - <button class="uni-btn" plain type="success">success</button> | ||
| 45 | - <button class="uni-btn" plain type="warning">warning</button> | ||
| 46 | - <button class="uni-btn" plain type="error">error</button> | ||
| 47 | - <button class="uni-btn" plain type="info">info</button> | ||
| 48 | - </view> | ||
| 49 | - </uni-section> | ||
| 50 | - | ||
| 51 | - | ||
| 52 | - <uni-section title="镂空按钮(size=mini)" sub-title="添加类名 .uni-btn-plain 使用镂空按钮" type="line"> | ||
| 53 | - <view class="uni-ma-5 uni-pb-5"> | ||
| 54 | - <button class="uni-btn" plain size="mini">default</button> | ||
| 55 | - <button class="uni-btn" plain type="primary" size="mini">primary</button> | ||
| 56 | - <button class="uni-btn" plain type="success" size="mini">success</button> | ||
| 57 | - <button class="uni-btn" plain type="warning" size="mini">warning</button> | ||
| 58 | - <button class="uni-btn" plain type="error" size="mini">error</button> | ||
| 59 | - <button class="uni-btn" plain type="info" size="mini">info</button> | ||
| 60 | - </view> | ||
| 61 | - </uni-section> | ||
| 62 | - <uni-section title="禁用" sub-title="使用 disabled 属性 ,展示禁用按钮" type="line"> | ||
| 63 | - <view class="uni-ma-5 uni-pb-5"> | ||
| 64 | - <button class="uni-btn" type="primary" disabled>primary</button> | ||
| 65 | - <button class="uni-btn" plain type="primary" disabled>primary</button> | ||
| 66 | - <button class="uni-btn uni-btn-radius" disabled>圆角</button> | ||
| 67 | - </view> | ||
| 68 | - </uni-section> | ||
| 69 | - <uni-section title="禁用(size=mini)" sub-title="使用 disabled 属性 ,展示禁用按钮" type="line"> | ||
| 70 | - <view class="uni-ma-5 uni-pb-5"> | ||
| 71 | - <button class="uni-btn" type="primary" disabled size="mini">primary</button> | ||
| 72 | - <button class="uni-btn" plain type="primary" disabled size="mini">primary</button> | ||
| 73 | - <button class="uni-btn uni-btn-radius" disabled size="mini">圆角</button> | ||
| 74 | - </view> | ||
| 75 | - </uni-section> | ||
| 76 | - <uni-section title="大小" sub-title="添加类名 .uni-btn-small .uni-btn-mini 展示按钮的不同大小" type="line"> | ||
| 77 | - <view class="uni-ma-5 uni-pb-5"> | ||
| 78 | - <button class="uni-btn" type="primary">default</button> | ||
| 79 | - <button class="uni-btn uni-btn-small" type="primary">samll</button> | ||
| 80 | - <button class="uni-btn uni-btn-mini uni-btn-radius" type="primary">mini</button> | ||
| 81 | - </view> | ||
| 82 | - </uni-section> | ||
| 83 | - <uni-section title="大小(sizi=mini)" sub-title="添加类名 .uni-btn-small .uni-btn-mini 展示按钮的不同大小" type="line"> | ||
| 84 | - <view class="uni-ma-5 uni-pb-5"> | ||
| 85 | - <button class="uni-btn" type="primary" size="mini">default</button> | ||
| 86 | - <button class="uni-btn uni-btn-small" type="primary" size="mini">samll</button> | ||
| 87 | - <button class="uni-btn uni-btn-mini uni-btn-radius" type="primary" size="mini">mini</button> | ||
| 88 | - </view> | ||
| 89 | - </uni-section> | ||
| 90 | - </view> | ||
| 91 | -</template> | ||
| 92 | -<script> | ||
| 93 | - export default { | ||
| 94 | - data() { | ||
| 95 | - return {} | ||
| 96 | - }, | ||
| 97 | - onLoad() {}, | ||
| 98 | - methods: {} | ||
| 99 | - } | ||
| 100 | -</script> | ||
| 101 | -<style lang="scss"> | ||
| 102 | - .hover-class-test { | ||
| 103 | - color: red; | ||
| 104 | - border: 1px red solid; | ||
| 105 | - background: blue; | ||
| 106 | - } | ||
| 107 | -</style> |
pages/extUI/calendar/calendar.nvue deleted
| 1 | -<template> | ||
| 2 | - <view class="calendar-content" v-if="showCalendar"> | ||
| 3 | - <text class="example-info">日历组件可以查看日期，选择任意范围内的日期，打点操作。常用场景如：酒店日期预订、火车机票选择购买日期、上下班打卡等。</text> | ||
| 4 | - <uni-section title="插入模式" type="line"></uni-section> | ||
| 5 | - <view> | ||
| 6 | - <!-- 插入模式 --> | ||
| 7 | - <uni-calendar class="uni-calendar--hook" :selected="info.selected" :showMonth="false" @change="change" @monthSwitch="monthSwitch" /> | ||
| 8 | - </view> | ||
| 9 | - <uni-section class="hideOnPc" title="弹出模式" type="line"></uni-section> | ||
| 10 | - <view class="example-body hideOnPc"> | ||
| 11 | - <button class="calendar-button" type="button" @click="open">打开日历</button> | ||
| 12 | - </view> | ||
| 13 | - <uni-calendar ref="calendar" class="uni-calendar--hook" :clear-date="true" :date="info.date" :insert="info.insert" :lunar="info.lunar" :startDate="info.startDate" | ||
| 14 | - :endDate="info.endDate" :range="info.range" @confirm="confirm" @close="close"/> | ||
| 15 | - </view> | ||
| 16 | -</template> | ||
| 17 | - | ||
| 18 | -<script> | ||
| 19 | - /** | ||
| 20 | - * 获取任意时间 | ||
| 21 | - */ | ||
| 22 | - function getDate(date, AddDayCount = 0) { | ||
| 23 | - if (!date) { | ||
| 24 | - date = new Date() | ||
| 25 | - } | ||
| 26 | - if (typeof date !== 'object') { | ||
| 27 | - date = date.replace(/-/g, '/') | ||
| 28 | - } | ||
| 29 | - const dd = new Date(date) | ||
| 30 | - | ||
| 31 | - dd.setDate(dd.getDate() + AddDayCount) // 获取AddDayCount天后的日期 | ||
| 32 | - | ||
| 33 | - const y = dd.getFullYear() | ||
| 34 | - const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1 // 获取当前月份的日期，不足10补0 | ||
| 35 | - const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate() // 获取当前几号，不足10补0 | ||
| 36 | - return { | ||
| 37 | - fullDate: y + '-' + m + '-' + d, | ||
| 38 | - year: y, | ||
| 39 | - month: m, | ||
| 40 | - date: d, | ||
| 41 | - day: dd.getDay() | ||
| 42 | - } | ||
| 43 | - } | ||
| 44 | - export default { | ||
| 45 | - components: {}, | ||
| 46 | - data() { | ||
| 47 | - return { | ||
| 48 | - showCalendar: false, | ||
| 49 | - info: { | ||
| 50 | - lunar: true, | ||
| 51 | - range: true, | ||
| 52 | - insert: false, | ||
| 53 | - selected: [] | ||
| 54 | - } | ||
| 55 | - } | ||
| 56 | - }, | ||
| 57 | - onReady() { | ||
| 58 | - this.$nextTick(() => { | ||
| 59 | - this.showCalendar = true | ||
| 60 | - }) | ||
| 61 | - // TODO 模拟请求异步同步数据 | ||
| 62 | - setTimeout(() => { | ||
| 63 | - this.info.date = getDate(new Date(),-30).fullDate | ||
| 64 | - this.info.startDate = getDate(new Date(),-60).fullDate | ||
| 65 | - this.info.endDate = getDate(new Date(),30).fullDate | ||
| 66 | - this.info.selected = [{ | ||
| 67 | - date: getDate(new Date(),-3).fullDate, | ||
| 68 | - info: '打卡' | ||
| 69 | - }, | ||
| 70 | - { | ||
| 71 | - date: getDate(new Date(),-2).fullDate, | ||
| 72 | - info: '签到', | ||
| 73 | - data: { | ||
| 74 | - custom: '自定义信息', | ||
| 75 | - name: '自定义消息头' | ||
| 76 | - } | ||
| 77 | - }, | ||
| 78 | - { | ||
| 79 | - date: getDate(new Date(),-1).fullDate, | ||
| 80 | - info: '已打卡' | ||
| 81 | - } | ||
| 82 | - ] | ||
| 83 | - }, 2000) | ||
| 84 | - }, | ||
| 85 | - methods: { | ||
| 86 | - open() { | ||
| 87 | - this.$refs.calendar.open() | ||
| 88 | - }, | ||
| 89 | - close(){ | ||
| 90 | - console.log('弹窗关闭'); | ||
| 91 | - }, | ||
| 92 | - change(e) { | ||
| 93 | - console.log('change 返回:', e) | ||
| 94 | - // 模拟动态打卡 | ||
| 95 | - if (this.info.selected.length > 5) return | ||
| 96 | - this.info.selected.push({ | ||
| 97 | - date: e.fulldate, | ||
| 98 | - info: '打卡' | ||
| 99 | - }) | ||
| 100 | - }, | ||
| 101 | - confirm(e) { | ||
| 102 | - console.log('confirm 返回:', e) | ||
| 103 | - }, | ||
| 104 | - monthSwitch(e) { | ||
| 105 | - console.log('monthSwitchs 返回:', e) | ||
| 106 | - } | ||
| 107 | - } | ||
| 108 | - } | ||
| 109 | -</script> | ||
| 110 | - | ||
| 111 | -<style lang="scss"> | ||
| 112 | - .example-body { | ||
| 113 | - /* #ifndef APP-NVUE */ | ||
| 114 | - display: flex; | ||
| 115 | - /* #endif */ | ||
| 116 | - flex-direction: row; | ||
| 117 | - } | ||
| 118 | - .calendar-button { | ||
| 119 | - flex: 1; | ||
| 120 | - font-weight: bold; | ||
| 121 | - font-size: 32rpx; | ||
| 122 | - } | ||
| 123 | -</style> |
pages/extUI/card/card.nvue deleted
| 1 | -<template> | ||
| 2 | - <view class="container"> | ||
| 3 | - <uni-card :is-shadow="false" is-full> | ||
| 4 | - <text class="uni-h6">卡片组件通用来显示完整独立的一段信息，同时让用户理解他的作用。例如一篇文章的预览图、作者信息、时间等，卡片通常是更复杂和更详细信息的入口点。</text> | ||
| 5 | - </uni-card> | ||
| 6 | - <uni-section overflow title="基础卡片" type="line"> | ||
| 7 | - <uni-card :is-shadow="false"> | ||
| 8 | - <text class="uni-body">这是一个基础卡片示例，内容较少，此示例展示了一个没有任何属性不带阴影的卡片。</text> | ||
| 9 | - </uni-card> | ||
| 10 | - </uni-section> | ||
| 11 | - <uni-section overflow title="卡片标题+额外信息" type="line"> | ||
| 12 | - <uni-card title="基础卡片" extra="额外信息"> | ||
| 13 | - <text class="uni-body">这是一个基础卡片示例，此示例展示了一个标题加标题额外信息的标准卡片。</text> | ||
| 14 | - </uni-card> | ||
| 15 | - </uni-section> | ||
| 16 | - | ||
| 17 | - <uni-section overflow title="双标题卡片" type="line"> | ||
| 18 | - <uni-card title="基础卡片" sub-title="副标题" extra="额外信息" :thumbnail="avatar" @click="onClick"> | ||
| 19 | - <text class="uni-body">这是一个带头像和双标题的基础卡片，此示例展示了一个完整的卡片。</text> | ||
| 20 | - </uni-card> | ||
| 21 | - </uni-section> | ||
| 22 | - | ||
| 23 | - <uni-section overflow title="通栏卡片" type="line"> | ||
| 24 | - <uni-card title="基础卡片" :isFull="true" sub-title="副标题" extra="额外信息" :thumbnail="avatar"> | ||
| 25 | - <text class="uni-body">这是一个通栏卡片 ，通栏没有外边距，左右会贴合父元素。</text> | ||
| 26 | - </uni-card> | ||
| 27 | - </uni-section> | ||
| 28 | - | ||
| 29 | - <uni-section overflow title="卡片封面图+操作栏" type="line"> | ||
| 30 | - <uni-card :cover="cover" @click="onClick"> | ||
| 31 | - <!-- <image slot='cover' style="width: 100%;" :src="cover"></image> --> | ||
| 32 | - <text class="uni-body">这是一个带封面和操作栏的卡片示例，此示例展示了封面插槽和操作栏插槽的用法。</text> | ||
| 33 | - <view slot="actions" class="card-actions"> | ||
| 34 | - <view class="card-actions-item" @click="actionsClick('分享')"> | ||
| 35 | - <uni-icons type="pengyouquan" size="18" color="#999"></uni-icons> | ||
| 36 | - <text class="card-actions-item-text">分享</text> | ||
| 37 | - </view> | ||
| 38 | - <view class="card-actions-item" @click="actionsClick('点赞')"> | ||
| 39 | - <uni-icons type="heart" size="18" color="#999"></uni-icons> | ||
| 40 | - <text class="card-actions-item-text">点赞</text> | ||
| 41 | - </view> | ||
| 42 | - <view class="card-actions-item" @click="actionsClick('评论')"> | ||
| 43 | - <uni-icons type="chatbubble" size="18" color="#999"></uni-icons> | ||
| 44 | - <text class="card-actions-item-text">评论</text> | ||
| 45 | - </view> | ||
| 46 | - </view> | ||
| 47 | - </uni-card> | ||
| 48 | - </uni-section> | ||
| 49 | - | ||
| 50 | - <uni-section overflow title="自定义卡片内容" type="line"> | ||
| 51 | - <uni-card title="基础卡片" sub-title="副标题" extra="额外信息" padding="10px 0" :thumbnail="avatar"> | ||
| 52 | - <template v-slot:title> | ||
| 53 | - <uni-list> | ||
| 54 | - <uni-list-item :show-switch="true" title="自定义标题" /> | ||
| 55 | - </uni-list> | ||
| 56 | - </template> | ||
| 57 | - <image style="width: 100%;" :src="cover"></image> | ||
| 58 | - <text | ||
| 59 | - class="uni-body uni-mt-5">卡片组件通用来显示完整独立的一段信息，同时让用户理解他的作用。例如一篇文章的预览图、作者信息、时间等，卡片通常是更复杂和更详细信息的入口点。</text> | ||
| 60 | - <view slot="actions" class="card-actions"> | ||
| 61 | - <view class="card-actions-item" @click="actionsClick('分享')"> | ||
| 62 | - <uni-icons type="pengyouquan" size="18" color="#999"></uni-icons> | ||
| 63 | - <text class="card-actions-item-text">分享</text> | ||
| 64 | - </view> | ||
| 65 | - <view class="card-actions-item" @click="actionsClick('点赞')"> | ||
| 66 | - <uni-icons type="heart" size="18" color="#999"></uni-icons> | ||
| 67 | - <text class="card-actions-item-text">点赞</text> | ||
| 68 | - </view> | ||
| 69 | - <view class="card-actions-item" @click="actionsClick('评论')"> | ||
| 70 | - <uni-icons type="chatbubble" size="18" color="#999"></uni-icons> | ||
| 71 | - <text class="card-actions-item-text">评论</text> | ||
| 72 | - </view> | ||
| 73 | - </view> | ||
| 74 | - </uni-card> | ||
| 75 | - </uni-section> | ||
| 76 | - | ||
| 77 | - <uni-section overflow title="卡片+列表" type="line"> | ||
| 78 | - <uni-card padding="0" spacing="0"> | ||
| 79 | - <template v-slot:cover> | ||
| 80 | - <view class="custom-cover"> | ||
| 81 | - <image class="cover-image" mode="aspectFill" :src="cover"> | ||
| 82 | - </image> | ||
| 83 | - <view class="cover-content"> | ||
| 84 | - <text class="uni-subtitle uni-white">今日新闻热点</text> | ||
| 85 | - </view> | ||
| 86 | - </view> | ||
| 87 | - </template> | ||
| 88 | - <uni-list> | ||
| 89 | - <uni-list-item title="今日新闻" showArrow></uni-list-item> | ||
| 90 | - <uni-list-item title="今日新闻" showArrow></uni-list-item> | ||
| 91 | - </uni-list> | ||
| 92 | - <view slot="actions" class="card-actions no-border"> | ||
| 93 | - <view class="card-actions-item" @click="actionsClick('分享')"> | ||
| 94 | - <uni-icons type="pengyouquan" size="18" color="#999"></uni-icons> | ||
| 95 | - <text class="card-actions-item-text">分享</text> | ||
| 96 | - </view> | ||
| 97 | - <view class="card-actions-item" @click="actionsClick('点赞')"> | ||
| 98 | - <uni-icons type="heart" size="18" color="#999"></uni-icons> | ||
| 99 | - <text class="card-actions-item-text">点赞</text> | ||
| 100 | - </view> | ||
| 101 | - <view class="card-actions-item" @click="actionsClick('评论')"> | ||
| 102 | - <uni-icons type="chatbubble" size="18" color="#999"></uni-icons> | ||
| 103 | - <text class="card-actions-item-text">评论</text> | ||
| 104 | - </view> | ||
| 105 | - </view> | ||
| 106 | - </uni-card> | ||
| 107 | - </uni-section> | ||
| 108 | - | ||
| 109 | - | ||
| 110 | - </view> | ||
| 111 | -</template> | ||
| 112 | - | ||
| 113 | -<script> | ||
| 114 | - export default { | ||
| 115 | - components: {}, | ||
| 116 | - data() { | ||
| 117 | - return { | ||
| 118 | - cover: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/094a9dc0-50c0-11eb-b680-7980c8a877b8.jpg', | ||
| 119 | - avatar: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png', | ||
| 120 | - extraIcon: { | ||
| 121 | - color: '#4cd964', | ||
| 122 | - size: '22', | ||
| 123 | - type: 'gear-filled' | ||
| 124 | - } | ||
| 125 | - } | ||
| 126 | - }, | ||
| 127 | - methods: { | ||
| 128 | - onClick(e) { | ||
| 129 | - console.log(e) | ||
| 130 | - }, | ||
| 131 | - actionsClick(text) { | ||
| 132 | - uni.showToast({ | ||
| 133 | - title: text, | ||
| 134 | - icon: 'none' | ||
| 135 | - }) | ||
| 136 | - } | ||
| 137 | - } | ||
| 138 | - } | ||
| 139 | -</script> | ||
| 140 | - | ||
| 141 | -<style lang="scss"> | ||
| 142 | - .container { | ||
| 143 | - overflow: hidden; | ||
| 144 | - } | ||
| 145 | - | ||
| 146 | - .custom-cover { | ||
| 147 | - flex: 1; | ||
| 148 | - flex-direction: row; | ||
| 149 | - position: relative; | ||
| 150 | - } | ||
| 151 | - | ||
| 152 | - .cover-content { | ||
| 153 | - position: absolute; | ||
| 154 | - bottom: 0; | ||
| 155 | - left: 0; | ||
| 156 | - right: 0; | ||
| 157 | - height: 40px; | ||
| 158 | - background-color: rgba($color: #000000, $alpha: 0.4); | ||
| 159 | - display: flex; | ||
| 160 | - flex-direction: row; | ||
| 161 | - align-items: center; | ||
| 162 | - padding-left: 15px; | ||
| 163 | - font-size: 14px; | ||
| 164 | - color: #fff; | ||
| 165 | - } | ||
| 166 | - | ||
| 167 | - .card-actions { | ||
| 168 | - display: flex; | ||
| 169 | - flex-direction: row; | ||
| 170 | - justify-content: space-around; | ||
| 171 | - align-items: center; | ||
| 172 | - height: 45px; | ||
| 173 | - border-top: 1px #eee solid; | ||
| 174 | - } | ||
| 175 | - | ||
| 176 | - .card-actions-item { | ||
| 177 | - display: flex; | ||
| 178 | - flex-direction: row; | ||
| 179 | - align-items: center; | ||
| 180 | - } | ||
| 181 | - | ||
| 182 | - .card-actions-item-text { | ||
| 183 | - font-size: 12px; | ||
| 184 | - color: #666; | ||
| 185 | - margin-left: 5px; | ||
| 186 | - } | ||
| 187 | - | ||
| 188 | - .cover-image { | ||
| 189 | - flex: 1; | ||
| 190 | - height: 150px; | ||
| 191 | - } | ||
| 192 | - | ||
| 193 | - .no-border { | ||
| 194 | - border-width: 0; | ||
| 195 | - } | ||
| 196 | -</style> |