Skip to content

A
account-book
Commit ac820aa5 authored by 刘文虎's avatar 刘文虎
Browse files
Options

权限弹框

parent 9da1cb75
Pipeline #7945 canceled with stages
      Expand all Hide whitespace changes
      Inline Side-by-side
      Showing with 1337 additions and 1236 deletions
      components/auth-popup/index.vue
      View file @ ac820aa5
      ...@@ -10,6 +10,9 @@ ...@@ -10,6 +10,9 @@
      </template> </template>
      <script> <script>
      import {
      appName
      } from "@/utils/config.js"
      export default { export default {
      name: 'auth-popup', name: 'auth-popup',
      props: { props: {
      ...@@ -38,6 +41,7 @@ ...@@ -38,6 +41,7 @@
      }, },
      data() { data() {
      return { return {
      systemInfo: null,
      ani: '', ani: '',
      showPopup: false, showPopup: false,
      StatusBar: '', StatusBar: '',
      ...@@ -45,37 +49,42 @@ ...@@ -45,37 +49,42 @@
      authList: { authList: {
      'WRITE_EXTERNAL_STORAGE': { 'WRITE_EXTERNAL_STORAGE': {
      scopeText: "存储空间/照片", scopeText: "存储空间/照片",
      title: "扳手记账对存储空间/照片权限申请说明", title: appName + "对存储空间/照片权限申请说明",
      content: "便于您使用该功能上传您的照片/图片/视频/文件及用于更换头像、意见反馈、保存相册、上传资料/分享、下载、与客服沟通等场景中读取和写入相册和文件内容。" content: "便于您使用该功能上传您的照片/图片/视频/文件及用于更换头像、意见反馈、保存相册、上传资料/分享、下载、与客服沟通等场景中读取和写入相册和文件内容。"
      }, },
      'READ_EXTERNAL_STORAGE': { 'READ_EXTERNAL_STORAGE': {
      scopeText: "读取设备上的照片及文件", scopeText: "读取设备上的照片及文件",
      title: "扳手记账对读取设备上的照片及文件权限申请说明", title: appName + "对读取设备上的照片及文件权限申请说明",
      content: "便于您使用该功能上传您的照片/图片/视频/文件及用于更换头像、意见反馈、保存相册、上传资料/分享、下载、与客服沟通等场景中读取相册和文件内容。" content: "便于您使用该功能上传您的照片/图片/视频/文件及用于更换头像、意见反馈、保存相册、上传资料/分享、下载、与客服沟通等场景中读取相册和文件内容。"
      }, },
      'READ_MEDIA_IMAGES': {
      scopeText: "读取设备上的照片",
      title: appName + "对读取设备上的照片权限申请说明",
      content: "便于您使用该功能上传您的照片/图片/视频及用于更换头像、意见反馈、保存相册、上传图片、与客服沟通等场景中读取相册内容。"
      },
      'ACCESS_FINE_LOCATION': { 'ACCESS_FINE_LOCATION': {
      scopeText: "地理位置", scopeText: "地理位置",
      title: "扳手记账对地理位置权限申请说明", title: appName + "对地理位置权限申请说明",
      content: "便于应用程序可以提供基于位置的服务、定位导航、附近搜索等功能。" content: "便于应用程序可以提供基于位置的服务、定位导航、附近搜索等功能。"
      }, },
      'CAMERA': { 'CAMERA': {
      scopeText: "相机/摄像头", scopeText: "相机/摄像头",
      title: "扳手记账对相机/摄像头权限申请说明", title: appName + "对相机/摄像头权限申请说明",
      content: "便于您使用该功能拍照上传您的照片/视频及用于更换头像、意见反馈、保存相册、上传资料/动态、下载与客服沟通等场景中使用" content: "便于您使用该功能拍照上传您的照片/视频及用于更换头像、意见反馈、保存相册、上传资料/动态、量角尺、下载与客服沟通等场景中使用"
      }, },
      'RECORD_AUDIO': { 'RECORD_AUDIO': {
      scopeText: "麦克风", scopeText: "麦克风",
      title: "扳手记账对麦克风权限申请说明", title: appName + "对麦克风权限申请说明",
      content: "便于您使用该功能进行录音、语音通话、发布语音、与客服语音沟通等场景中使用" content: "便于您使用该功能进行录音、录相、语音通话、发布语音、量角尺、与客服语音沟通等场景中使用"
      }, },
      'CALL_PHONE': { 'CALL_PHONE': {
      scopeText: "拨打/管理电话", scopeText: "拨打/管理电话",
      title: "扳手记账对拨打/管理电话权限申请说明", title: appName + "对拨打/管理电话权限申请说明",
      content: "便于您使用该功能联系客服、讲师等场景下使用" content: "便于您使用该功能联系讲师、客户、客服等场景下使用"
      }, },
      'WRITE_CONTACTS':{ 'WRITE_CONTACTS': {
      scopeText: "通讯录", scopeText: "通讯录",
      title: "扳手记账对通讯录权限申请说明", title: appName + "对通讯录权限申请说明",
      content: "便于您使用该功能保存到通讯录、使用通讯录等场景下使用" content: "便于您使用该功能保存到通讯录、使用通讯录等场景下使用"
      } }
      } }
      ...@@ -92,8 +101,9 @@ ...@@ -92,8 +101,9 @@
      let _this = this; let _this = this;
      uni.getSystemInfo({ uni.getSystemInfo({
      success: function(e) { success: function(e) {
      _this.systemInfo = e
      _this.StatusBar = 44 + e.statusBarHeight + _this.StatusBar = 44 + e.statusBarHeight +
      'px'; //用于自定义头部时，给手机状态栏留出位置,可通过isNativeHead这个参数控制 'px'; //用于自定义头部时，给手机状态栏留出位置,可通过isNativeHead这个参数控制
      } }
      }) })
      }, },
      ...@@ -112,9 +122,28 @@ ...@@ -112,9 +122,28 @@
      requestPermissions(permissionID) { requestPermissions(permissionID) {
      let _this = this; let _this = this;
      // #ifdef APP-PLUS // #ifdef APP-PLUS
      //判断安卓与ios设备 //判断安卓与ios设备
      if (plus.os.name == 'Android') { if (plus.os.name == 'Android') {
      let {
      osAndroidAPILevel
      } = _this.systemInfo
      // 安卓13之后 内部存储(应用内存储)不再需要权限 直接保存
      if (osAndroidAPILevel >= 33) {
      if (permissionID === 'WRITE_EXTERNAL_STORAGE') {
      _this.$emit('changeAuth');
      _this.$nextTick(() => {
      setTimeout(() => {
      _this.ani = 'uni-' + _this.type
      }, 30)
      })
      return false;
      }
      }
      // "<uses-permission android:name=\"android.permission.WRITE_EXTERNAL_STORAGE\" android:maxSdkVersion=\"32\" />",
      // "<uses-permission android:name=\"android.permission.MANAGE_EXTERNAL_STORAGE\" android:minSdkVersion=\"33\" />",
      let _permissionID = 'android.permission.' + permissionID; let _permissionID = 'android.permission.' + permissionID;
      plus.android.checkPermission(_permissionID, plus.android.checkPermission(_permissionID,
      granted => { granted => {
      if (granted.checkResult == -1) { if (granted.checkResult == -1) {
      ...@@ -145,7 +174,12 @@ ...@@ -145,7 +174,12 @@
      //当前查询权限已授权，此时可以通知页面执行接下来的操作 //当前查询权限已授权，此时可以通知页面执行接下来的操作
      _this.$emit('changeAuth'); _this.$emit('changeAuth');
      } }
      if (e.deniedPresent.length > 0) {
      //当前拒绝权限，此时可以通知页面执行接下来的操作
      _this.$emit('reject');
      }
      if (e.deniedAlways.length > 0) { if (e.deniedAlways.length > 0) {
      uni.hideLoading()
      //当前查询权限已被永久禁用，此时需要引导用户跳转手机系统设置去开启 //当前查询权限已被永久禁用，此时需要引导用户跳转手机系统设置去开启
      uni.showModal({ uni.showModal({
      title: '温馨提示', title: '温馨提示',
      ...@@ -158,6 +192,9 @@ ...@@ -158,6 +192,9 @@
      success: (res) => { success: (res) => {
      if (res.confirm) { if (res.confirm) {
      _this.goSetting(); _this.goSetting();
      } else {
      //当前拒绝权限，此时可以通知页面执行接下来的操作
      _this.$emit('reject');
      } }
      } }
      }) })
      ...@@ -224,6 +261,7 @@ ...@@ -224,6 +261,7 @@
      //当前查询权限已授权，此时可以通知页面执行接下来的操作 //当前查询权限已授权，此时可以通知页面执行接下来的操作
      that.$emit('changeAuth') that.$emit('changeAuth')
      } else { } else {
      uni.hideLoading()
      //当前查询的权限已禁用,引导用户跳转手机系统设置去开启 //当前查询的权限已禁用,引导用户跳转手机系统设置去开启
      uni.showModal({ uni.showModal({
      title: '温馨提示', title: '温馨提示',
      ......
      components/upload/chooseImage.vue 0 → 100644
      View file @ ac820aa5
      <template>
      <UploadImages ref="upload-images" :max-count="maxCount" :width="width" :height="height" custom-btn
      :file-list="fileList" :auto-upload="autoUpload" :show-progress="false" :show-add="showAdd"
      :isNativeHead="isNativeHead" :show-upload-list="showUploadList" :sourceType="sourceType"
      @openSource="openSource" @on-list-change="handleListChange" @on-choose-fail="onChooseFail">
      <view slot="addBtn">
      <view v-if="$slots.addBtn" class="slot-view" hover-class="slot-btn__hover">
      <slot name="addBtn" />
      </view>
      <view v-else class="slot-btn" hover-class="slot-btn__hover" :style="slotStyle" hover-stay-time="150">
      <u-icon name="plus" :size="addSize" color="#D8D8D8"></u-icon>
      </view>
      <BottomChoose ref="bottom-choose" @change="sourceTypeChange" />
      </view>
      <PopInput title="提醒" type="text" sureText="前往设置" cancelText="返回" :showCancel="true" :content="uploadConent"
      :visible.sync="showConfirm" @cancel="handleCancel" @click="handleConfirm" />
      </UploadImages>
      </template>
      <script>
      import PopInput from '@/components/pop-input-view';
      import BottomChoose from '@/components/bottom-choose'
      import UploadImages from '@/components/upload/u-upload';
      import permision from '@/js_sdk/wa-permission/permission.js';
      import {
      mapGetters
      } from 'vuex';
      import {
      showModal
      } from '@/utils/auth.js';
      export default {
      components: {
      UploadImages,
      PopInput,
      BottomChoose
      },
      props: {
      // 给fileList赋初始值用
      list: {
      type: Array,
      default () {
      return [];
      }
      },
      // 最大上传数量
      maxCount: {
      type: [String, Number],
      default: 9
      },
      // 是否自动上传
      autoUpload: {
      type: Boolean,
      default: false
      },
      // 内部预览图片区域和选择图片按钮的区域宽度
      width: {
      type: [String, Number],
      default: 160
      },
      // 内部预览图片区域和选择图片按钮的区域高度
      height: {
      type: [String, Number],
      default: 160
      },
      addSize: {
      type: [String, Number],
      default: 48
      },
      uploading: {
      type: Boolean,
      default: false
      },
      showAdd: {
      type: Boolean,
      default: true
      },
      isNativeHead: {
      type: Boolean,
      default: true
      }
      },
      data() {
      return {
      fileList: [],
      qiniuToken: '',
      showUploadList: false,
      uploadConent: '需要使用相机权限,请前往设置。',
      showConfirm: false,
      sourceType: ['album', 'camera']
      };
      },
      computed: {
      ...mapGetters(['platform', 'isIOS']),
      slotStyle() {
      return ` width:${this.width}rpx;height:${this.height}rpx;`;
      }
      },
      methods: {
      openSource() {
      this.$refs['bottom-choose'].open()
      },
      sourceTypeChange(source) {
      this.sourceType = [source]
      this.$nextTick(()=>{ this.$refs['upload-images'].appStratChoose(this.sourceType) })
      },
      handleListChange(lists, name) {
      if (!lists || !lists.length) {
      return false;
      }
      this.$emit('update:uploading', true);
      this.$emit('on-list-change', lists);
      this.$refs['upload-images'].clear();
      },
      selectFile() {
      // 触发选择图片；不能改文件名，外部要调
      this.$refs['upload-images'].selectFile();
      },
      onChooseFail(error) {
      console.log("onChooseFail:", error);
      this.$emit('on-choose-fail');
      },
      handleConfirm() {
      permision.gotoAppPermissionSetting();
      },
      handleCancel() {}
      }
      };
      </script>
      <style lang="scss" scoped>
      /deep/.u-add-tips {
      height: 0 !important;
      margin-top: 0 !important;
      overflow: hidden;
      }
      .slot-btn {
      width: 160rpx;
      height: 160rpx;
      display: flex;
      justify-content: center;
      align-items: center;
      background: #f6f7fa;
      border-radius: 10rpx;
      // margin: 10rpx;
      }
      .slot-btn__hover {
      background-color: rgb(235, 236, 238);
      }
      </style>
      \ No newline at end of file
      components/upload/index.vue
      View file @ ac820aa5
      <template> <template>
      <UploadImages ref="upload-images" :max-count="maxCount" :width="width" :height="height" custom-btn <UploadImages ref="upload-images" :max-count="maxCount" :width="width" :height="height" custom-btn
      :file-list="fileList" :auto-upload="autoUpload" :isNativeHead="isNativeHead" :show-progress="false" :show-add="showAdd" :sourceType="sourceType" @openSource="openSource" :file-list="fileList" :auto-upload="autoUpload" :isNativeHead="isNativeHead" :show-progress="false" :show-add="showAdd" :sourceType="sourceType" @openSource="openSource"
      @on-list-change="handleListChange"> @on-list-change="handleListChange" @on-choose-fail="onChooseFail">
      <view slot="addBtn" class="slot-btn" hover-class="slot-btn__hover" :style="slotStyle" hover-stay-time="150"> <view slot="addBtn" class="slot-btn" hover-class="slot-btn__hover" :style="slotStyle" hover-stay-time="150">
      <u-icon name="plus" :size="addSize" color="#D8D8D8"></u-icon> <u-icon name="plus" :size="addSize" color="#D8D8D8"></u-icon>
      <BottomChoose ref="bottom-choose" @change="sourceTypeChange" /> <BottomChoose ref="bottom-choose" @change="sourceTypeChange" />
      </view> </view>
      </UploadImages> </UploadImages>
      </template> </template>
      <script> <script>
      import BottomChoose from '@/components/bottom-choose' import BottomChoose from '@/components/bottom-choose'
      import upload from '@/utils/upload' import upload from '@/utils/upload'
      import UploadImages from '@/components/upload/u-upload' import UploadImages from '@/components/upload/u-upload'
      import { import {
      getQiNiuToken getQiNiuToken
      } from '@/api/common/index.js'; } from '@/api/common/index.js';
      import { import {
      UPLOAD_FILE_HOST UPLOAD_FILE_HOST
      } from '@/utils/config.js'; } from '@/utils/config.js';
      export default { export default {
      components: { components: {
      UploadImages, UploadImages,
      BottomChoose BottomChoose
      }, },
      props: { props: {
      // 给fileList赋初始值用 // 给fileList赋初始值用
      list: { list: {
      type: Array, type: Array,
      default () { default () {
      return [] return []
      }, },
      }, },
      // 最大上传数量 // 最大上传数量
      maxCount: { maxCount: {
      type: [String, Number], type: [String, Number],
      default: 9, default: 9,
      }, },
      // 是否自动上传 // 是否自动上传
      autoUpload: { autoUpload: {
      type: Boolean, type: Boolean,
      default: false, default: false,
      }, },
      // 内部预览图片区域和选择图片按钮的区域宽度 // 内部预览图片区域和选择图片按钮的区域宽度
      width: { width: {
      type: [String, Number], type: [String, Number],
      default: 160, default: 160,
      }, },
      // 内部预览图片区域和选择图片按钮的区域高度 // 内部预览图片区域和选择图片按钮的区域高度
      height: { height: {
      type: [String, Number], type: [String, Number],
      default: 160, default: 160,
      }, },
      addSize: { addSize: {
      type: [String, Number], type: [String, Number],
      default: 48, default: 48,
      }, },
      uploading: { uploading: {
      type: Boolean, type: Boolean,
      default: false default: false
      }, },
      showAdd: { showAdd: {
      type: Boolean, type: Boolean,
      default: true default: true
      }, },
      isNativeHead:{ isNativeHead:{
      type: Boolean, type: Boolean,
      default: true default: true
      } }
      }, },
      data() { data() {
      return { return {
      fileList: [], fileList: [],
      qiniuToken: '', qiniuToken: '',
      sourceType: ['album', 'camera'] sourceType: ['album', 'camera']
      } }
      }, },
      computed: { computed: {
      keyList() { keyList() {
      let list = [] let list = []
      if (this.fileList.length) { if (this.fileList.length) {
      for (var item of this.fileList) { for (var item of this.fileList) {
      if (item.key) { if (item.key) {
      list.push(item.key) list.push(item.key)
      } }
      } }
      } }
      return list return list
      }, },
      slotStyle() { slotStyle() {
      return ` width:${this.width}rpx;height:${this.height}rpx;` return ` width:${this.width}rpx;height:${this.height}rpx;`
      } }
      }, },
      watch: { watch: {
      list(val) { list(val) {
      if (val && !this.fileList.length) { if (val && !this.fileList.length) {
      this.fileList = [] this.fileList = []
      for (var item of val) { for (var item of val) {
      this.fileList.push({ this.fileList.push({
      key: item, key: item,
      url: item, url: item,
      }) })
      } }
      } }
      }, },
      }, },
      created() { created() {
      this.getQiniuToken() this.getQiniuToken()
      }, },
      methods: { methods: {
      openSource() { openSource() {
      this.$refs['bottom-choose'].open() this.$refs['bottom-choose'].open()
      }, },
      sourceTypeChange(source) { sourceTypeChange(source) {
      this.sourceType = [source] this.sourceType = [source]
      this.$refs['upload-images'].appStratChoose(this.sourceType) this.$nextTick(()=>{ this.$refs['upload-images'].appStratChoose(this.sourceType) })
      }, },
      filterList(listA, listB) { onChooseFail(error) {
      listA = listA || [] console.log("onChooseFail:", error);
      listB = listB || [] this.$emit('on-choose-fail');
      let list = [] },
      for (var item of listA) { filterList(listA, listB) {
      for (var obj of listB) { listA = listA || []
      if (obj.url == item.url) { listB = listB || []
      item.key = obj.key let list = []
      } for (var item of listA) {
      } for (var obj of listB) {
      list.push(item) if (obj.url == item.url) {
      } item.key = obj.key
      return list }
      }, }
      handleListChange(lists, name) { list.push(item)
      this.fileList = this.filterList(lists, this.fileList) }
      let newImages = this.fileList.filter((item) => { return list
      return item.key == undefined },
      }) handleListChange(lists, name) {
      if (newImages && newImages.length > 0) { this.fileList = this.filterList(lists, this.fileList)
      this.$emit('update:uploading', true) let newImages = this.fileList.filter((item) => {
      upload return item.key == undefined
      .uploads(newImages, this.qiniuToken) })
      .then((res) => { if (newImages && newImages.length > 0) {
      let list = [] this.$emit('update:uploading', true)
      if (res) { upload
      for (var item of res) { .uploads(newImages, this.qiniuToken)
      list.push({ .then((res) => {
      url: item.url, let list = []
      key: UPLOAD_FILE_HOST + item.key if (res) {
      }) for (var item of res) {
      } list.push({
      } url: item.url,
      key: UPLOAD_FILE_HOST + item.key
      this.fileList = this.filterList(this.fileList, list) })
      this.$emit('on-list-change', this.keyList) }
      console.log('upload:', this.fileList.length, this.keyList.length) }
      this.$emit('update:uploading', this.fileList.length != this.keyList.length)
      }) this.fileList = this.filterList(this.fileList, list)
      .catch((msg) => { this.$emit('on-list-change', this.keyList)
      console.log(msg) console.log('upload:', this.fileList.length, this.keyList.length)
      }) this.$emit('update:uploading', this.fileList.length != this.keyList.length)
      } else { })
      this.$emit('on-list-change', this.keyList) .catch((msg) => {
      } console.log(msg)
      }, })
      getQiniuToken() { } else {
      getQiNiuToken().then((res) => { this.$emit('on-list-change', this.keyList)
      if (res.data) { }
      this.qiniuToken = res.data },
      } getQiniuToken() {
      }) getQiNiuToken().then((res) => {
      }, if (res.data) {
      selectFile() { // 触发选择图片；不能改文件名，外部要调 this.qiniuToken = res.data
      this.$refs['upload-images'].selectFile() }
      } })
      }, },
      } selectFile() { // 触发选择图片；不能改文件名，外部要调
      </script> this.$refs['upload-images'].selectFile()
      }
      <style lang="scss" scoped> },
      /deep/.u-add-tips { }
      height: 0 !important; </script>
      margin-top: 0 !important;
      overflow: hidden; <style lang="scss" scoped>
      } /deep/.u-add-tips {
      height: 0 !important;
      .slot-btn { margin-top: 0 !important;
      width: 160rpx; overflow: hidden;
      height: 160rpx; }
      display: flex;
      justify-content: center; .slot-btn {
      align-items: center; width: 160rpx;
      background: #F6F7FA; height: 160rpx;
      border-radius: 10rpx; display: flex;
      margin: 10rpx; justify-content: center;
      } align-items: center;
      background: #F6F7FA;
      .slot-btn__hover { border-radius: 10rpx;
      background-color: rgb(235, 236, 238); margin: 10rpx;
      } }
      .slot-btn__hover {
      background-color: rgb(235, 236, 238);
      }
      </style> </style>
      \ No newline at end of file
      ......
      components/upload/single.vue
      View file @ ac820aa5
      This diff is collapsed.
      components/upload/u-upload.vue
      View file @ ac820aa5
      This diff is collapsed.
      manifest.json
      View file @ ac820aa5
      ...@@ -46,8 +46,6 @@ ...@@ -46,8 +46,6 @@
      "permissions" : [ "permissions" : [
      "<uses-feature android:name=\"android.hardware.camera\"/>", "<uses-feature android:name=\"android.hardware.camera\"/>",
      "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>", "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
      "<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
      "<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
      "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>", "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
      "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>", "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
      "<uses-permission android:name=\"android.permission.CAMERA\"/>", "<uses-permission android:name=\"android.permission.CAMERA\"/>",
      ...@@ -78,10 +76,6 @@ ...@@ -78,10 +76,6 @@
      "request" : "none", "request" : "none",
      "prompt" : "为保证您正常、安全地使用，需要获取设备识别码（部分手机提示为获取手机号码）使用权限，请允许。" "prompt" : "为保证您正常、安全地使用，需要获取设备识别码（部分手机提示为获取手机号码）使用权限，请允许。"
      }, },
      "permissionAccessFineLocation" : {
      "request" : "none",
      "prompt" : "为获取当地天气信息，需要获取 位置信息 使用权限，请允许。"
      },
      "schemes" : "com.shenjiying.jizhang", "schemes" : "com.shenjiying.jizhang",
      "minSdkVersion" : 21, "minSdkVersion" : 21,
      "targetSdkVersion" : 30 "targetSdkVersion" : 30
      ......
      pages/mine/u-avatar-cropper/u-avatar-cropper.vue
      View file @ ac820aa5
      ...@@ -15,27 +15,26 @@ ...@@ -15,27 +15,26 @@
      </view> </view>
      <view class="cropper-buttons safe-area-padding" :style="{ height: bottomNavHeight + 'px' }"> <view class="cropper-buttons safe-area-padding" :style="{ height: bottomNavHeight + 'px' }">
      <!-- #ifdef H5 --> <!-- #ifdef H5 -->
      <view class="upload" @tap="selectFile">选择图片</view> <view class="upload" @tap="chooseImage">选择图片</view>
      <!-- #endif --> <!-- #endif -->
      <!-- #ifndef H5 --> <!-- #ifndef H5 -->
      <view class="upload" @tap="selectFile">重新选择</view> <view class="upload" @tap="chooseImage">重新选择</view>
      <!-- #endif --> <!-- #endif -->
      <view class="getCropperImage" @tap="getCropperImage(false)">确定</view> <view class="getCropperImage" @tap="getCropperImage(false)">确定</view>
      </view> </view>
      <BottomChoose ref="bottom-choose" @change="sourceTypeChange" /> <view class="choose-image-view">
      <AuthPopup ref="authpup" type="top" @changeAuth="changeAuth" :permissionID="permissionID" /> <ChooseImage ref="choose-image" :max-count="1" :width="144" :height="144"
      @on-list-change="handlePicturesChange" />
      </view>
      </view> </view>
      </template> </template>
      <script> <script>
      import BottomChoose from '@/components/bottom-choose' import ChooseImage from '@/components/upload/chooseImage.vue';
      import AuthPopup from '@/components/auth-popup'
      import {getSetting} from '@/utils/common.js'
      import WeCropper from './weCropper.js'; import WeCropper from './weCropper.js';
      export default { export default {
      components: { components: {
      BottomChoose, ChooseImage,
      AuthPopup
      }, },
      props: { props: {
      // 裁剪矩形框的样式，其中可包含的属性为lineWidth-边框宽度(单位rpx)，color: 边框颜色， // 裁剪矩形框的样式，其中可包含的属性为lineWidth-边框宽度(单位rpx)，color: 边框颜色，
      ...@@ -84,7 +83,6 @@ ...@@ -84,7 +83,6 @@
      }, },
      data() { data() {
      return { return {
      sourceType: ['album', 'camera'],
      // 底部导航的高度 // 底部导航的高度
      bottomNavHeight: 50, bottomNavHeight: 50,
      originWidth: 200, originWidth: 200,
      ...@@ -118,17 +116,8 @@ ...@@ -118,17 +116,8 @@
      // 输出的图片类型，如果'png'类型发现裁剪的图片太大，改成"jpg"即可 // 输出的图片类型，如果'png'类型发现裁剪的图片太大，改成"jpg"即可
      fileType: 'jpg', fileType: 'jpg',
      src: '', // 选择的图片路径，用于在点击确定时，判断是否选择了图片 src: '', // 选择的图片路径，用于在点击确定时，判断是否选择了图片
      isIOS:false,
      permissionID:''
      }; };
      }, },
      mounted() {
      let res = uni.getSystemInfoSync();
      let {
      platform
      } = res
      this.isIOS=platform === 'ios'
      },
      onLoad(option) { onLoad(option) {
      let rectInfo = uni.getSystemInfoSync(); let rectInfo = uni.getSystemInfoSync();
      this.width = rectInfo.windowWidth; this.width = rectInfo.windowWidth;
      ...@@ -168,9 +157,10 @@ ...@@ -168,9 +157,10 @@
      frontColor: '#ffffff', frontColor: '#ffffff',
      backgroundColor: '#000000' backgroundColor: '#000000'
      }); });
      }, },
      onReady() { onReady() {
      this.selectFile() this.chooseImage()
      }, },
      methods: { methods: {
      touchStart(e) { touchStart(e) {
      ...@@ -211,68 +201,14 @@ ...@@ -211,68 +201,14 @@
      } }
      }); });
      }, },
      openSource() { chooseImage() {
      this.$refs['bottom-choose'].open() this.$refs['choose-image'].selectFile()
      },
      sourceTypeChange(source) {
      this.sourceType = [source]
      this.appStratChoose()
      },
      //打开自定义权限目的弹框
      openAuth(permissionID) {
      // this.permissionID = permissionID; //这个是对应的权限 ACCESS_FINE_LOCATION 位置权限 / WRITE_EXTERNAL_STORAGE 存储空间/照片权限 / CAMERA相机权限 / CALL_PHONE 拨打电话
      setTimeout(() => {
      this.$refs['authpup'].open();
      }, 500)
      }, },
      //用户授权权限后的回调 handlePicturesChange(lists) {
      changeAuth() { this.src = lists[0].url;
      //这里是权限通过后执行自己的代码逻辑 // 获取裁剪图片资源后，给data添加src属性及其值
      console.log('权限已授权，可执行自己的代码逻辑了'); this.cropper.pushOrign(this.src);
      this.stratChoose()
      },
      // 选择图片
      selectFile() {
      // #ifdef APP-PLUS
      this.openSource()
      // #endif
      // #ifdef MP-TOUTIAO
      getSetting('scope.camera', '检测到您没打开相机权限，是否去设置打开？', res => {
      this.stratChoose();
      });
      // #endif
      // #ifndef APP-PLUS || MP-TOUTIAO
      // 小程序直接打开相机
      this.stratChoose();
      // #endif
      },
      appStratChoose() {
      let permissionID = "CAMERA"
      if (this.sourceType.findIndex(e => e === 'camera') !== -1) {
      permissionID = "CAMERA"
      } else if (this.sourceType.findIndex(e => e === 'album') !== -1) {
      permissionID = "WRITE_EXTERNAL_STORAGE"
      }
      this.permissionID = permissionID
      if (this.isIOS) {
      this.stratChoose();
      } else {
      this.openAuth()
      }
      }, },
      stratChoose() {
      uni.chooseImage({
      count: 1, // 默认9
      sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
      sourceType: this.sourceType, // 可以指定来源是相册还是相机，默认二者都有
      success: (res) => {
      this.src = res.tempFilePaths[0];
      // 获取裁剪图片资源后，给data添加src属性及其值
      this.cropper.pushOrign(this.src);
      }
      });
      }
      } }
      }; };
      </script> </script>
      ...@@ -282,6 +218,7 @@ ...@@ -282,6 +218,7 @@
      .content { .content {
      background: rgba(255, 255, 255, 1); background: rgba(255, 255, 255, 1);
      overflow: hidden;
      } }
      .cropper { .cropper {
      ...@@ -335,4 +272,11 @@ ...@@ -335,4 +272,11 @@
      text-align: right; text-align: right;
      padding-right: 50rpx; padding-right: 50rpx;
      } }
      .choose-image-view {
      top: -200%;
      left: -200%;
      position: absolute;
      z-index: 99;
      }
      </style> </style>
      \ No newline at end of file
      utils/config.js
      View file @ ac820aa5
      ...@@ -8,6 +8,7 @@ export const userinfo = "USERINFO" ...@@ -8,6 +8,7 @@ export const userinfo = "USERINFO"
      export const headName = 'admin-token'; export const headName = 'admin-token';
      export const temperature = 'TEMPERATURE'; export const temperature = 'TEMPERATURE';
      export const appid = "wx55e75ad85611191f" export const appid = "wx55e75ad85611191f"
      export const appName = "扳手记账"
      export const API_HOST = ''; // 测试服 export const API_HOST = ''; // 测试服
      export const baseUrl = process.uniEnv.qn_base_url; // 七牛云对象存储图片地址 export const baseUrl = process.uniEnv.qn_base_url; // 七牛云对象存储图片地址
      ......
      Markdown is supported
      0% or
      You are about to add 0 people to the discussion. Proceed with caution.
      Finish editing this message first!
      Please register or to comment