From a28d0135ee42809b2c5863609da37155d3ecba5b Mon Sep 17 00:00:00 2001
From: yangan <yangan0921@163.com>
Date: 星期二, 29 四月 2025 15:11:39 +0800
Subject: [PATCH] feat:增加类型显示
---
pages/password/face.vue | 388 +++++++++++++++++++++++++++++-------------------------
1 files changed, 208 insertions(+), 180 deletions(-)
diff --git a/pages/password/face.vue b/pages/password/face.vue
index 370b8ef..7f68dc8 100644
--- a/pages/password/face.vue
+++ b/pages/password/face.vue
@@ -1,187 +1,215 @@
<template>
- <view class="addTo-freightForwarder-drvier">
- <view class="addForm">
- <u--form labelPosition="top"
- :model="form">
- <u-form-item labelWidth="25%"
- label=""
- @click="beforeRead"
- required>
- <view class="deleteImg" v-if="fileList1.length>0" @click="deletePic">
- <u-icon
- name="close"
- color="#000000"
- size="30"
- ></u-icon>
- </view>
- <view class="upload">
- <u-upload :fileList="fileList1"
- @afterRead="afterRead"
- @delete="deletePic"
- name="1"
- multiple
- :maxCount="1"
- width="180"
- height="180"
- customStyle="margin-left:8px;margin-top:8px;"
- :previewFullImage="true"></u-upload>
- </view>
- </u-form-item>
- </u--form>
- </view>
- <view class="addBtn"><u-button text="纭"load__butto
- type="primary"
- @click="addToHuoDaiOrDriver"
- :loading="loading"></u-button></view>
- </view>
+ <view class="addTo-freightForwarder-drvier">
+ <view class="addForm">
+ <u--form labelPosition="top" :model="form">
+ <u-form-item labelWidth="25%" label="" @click="beforeRead" required>
+ <view class="views">
+ <view class="upload">
+ <u-upload
+ :fileList="fileList1"
+ @afterRead="afterRead"
+ @delete="deletePic"
+ name="1"
+ :maxCount="1"
+ previewFullImage
+ ></u-upload>
+ </view>
+ <view class="deleteImg" v-if="fileList1.length" @click="deletePic">
+ <u-icon name="close" color="#000000" ></u-icon>
+ </view>
+ </view>
+ </u-form-item>
+ </u--form>
+ </view>
+ <view class="addBtn"
+ ><u-button
+ text="纭"
+ type="primary"
+ @click="addToHuoDaiOrDriver"
+ :loading="loading"
+ ></u-button
+ ></view>
+ </view>
</template>
<script>
- import { BaseUrl } from '@/api/publicInterface.js';
- import { mapMutations, mapState } from 'vuex';
- export default {
- data() {
- return {
- form:{
- userId:"",
- imgPath:"",
- username:""
- },
- loading:false,
- fileList1: [],
- };
- },
- onLoad(params) {
- let that=this
- if (params.id) {
- this.form.userId = params.id
- }
- if (params.username) {
- this.form.username = params.username
- }
- if(params.imgPath){
- this.form.imgPath = params.imgPath
- if (this.fileList1.length == 0 && params.imgPath) {
- this.fileList1.push({
- url: `${BaseUrl}${params.imgPath}`
- });
- }
- }
- },
- onShow() {
- this.init();
- },
- methods: {
- ...mapMutations(['changeisUploadimg']),
- init() {
- },
- addToHuoDaiOrDriver() {
- this.loading=true
- if(this.form.imgPath){
- this.$reqPut('faceEdit', this.form, 'json').then(result => {
- if (result.code == 0) {
- this.loading=false
- this.$u.toast('涓婁紶鎴愬姛');
- let timer = setTimeout(() => {
- uni.navigateBack({
- delta: 1
- });
- }, 500);
- } else {
- this.$u.toast(result.msg ? result.msg : '涓婁紶澶辫触');
- }
- });
- }
- },
- beforeRead() {
- this.changeisUploadimg(true);
- },
- // 鏂板鍥剧墖
- async afterRead(event) {
- // 褰撹缃� mutiple 涓� true 鏃�, file 涓烘暟缁勬牸寮忥紝鍚﹀垯涓哄璞℃牸寮�
- let lists = [].concat(event.file);
- let fileListLen = this[`fileList${event.name}`].length;
- lists.map(item => {
- this[`fileList${event.name}`].push({
- ...item,
- status: 'uploading',
- message: '涓婁紶涓�'
- });
- });
- for (let i = 0; i < lists.length; i++) {
- const result = await this.uploadFilePromise(lists[i].url, event.name);
- let item = this[`fileList${event.name}`][fileListLen];
- this[`fileList${event.name}`].splice(
- fileListLen,
- 1,
- Object.assign(item, {
- status: 'success',
- message: '涓婁紶鎴愬姛',
- url: result
- })
- );
- fileListLen++;
- }
- },
- // 鍒犻櫎
- deletePic(event) {
- this.fileList1.splice(0, 1);
- },
- uploadFilePromise(url, num) {
- return new Promise((resolve, reject) => {
- let a = uni.uploadFile({
- url: BaseUrl + '/admin/sys-file/uploadUnToken',
- filePath: url,
- name: 'file',
- success: res => {
- this.form.imgPath = JSON.parse(res.data).data.url;
- resolve(`${BaseUrl}${JSON.parse(res.data).data.url}`);
- }
- });
- });
- },
- },
- };
+// #ifdef H5
+const BaseUrl = window.location.origin;
+//#endif
+//#ifdef MP-WEIXIN
+import { BaseUrl } from "@/api/publicInterface.js";
+//#endif
+import { mapMutations, mapState } from "vuex";
+export default {
+ data() {
+ return {
+ form: {
+ userId: "",
+ imgPath: "",
+ username: "",
+ },
+ loading: false,
+ fileList1: [],
+ };
+ },
+ onLoad(params) {
+ let that = this;
+ if (params.id) {
+ this.form.userId = params.id;
+ }
+ if (params.username) {
+ this.form.username = params.username;
+ }
+ if (params.imgPath) {
+ this.form.imgPath = params.imgPath;
+ if (this.fileList1.length == 0 && params.imgPath) {
+ this.fileList1.push({
+ url: `${BaseUrl}${params.imgPath}`,
+ });
+ }
+ }
+ },
+ onShow() {
+ this.init();
+ },
+ methods: {
+ ...mapMutations(["changeisUploadimg"]),
+ init() {},
+ addToHuoDaiOrDriver() {
+ this.loading = true;
+ if (this.form.imgPath) {
+ this.$reqPut("faceEdit", this.form, "json").then((result) => {
+ if (result.code == 0) {
+ this.loading = false;
+ this.$u.toast("涓婁紶鎴愬姛");
+ let timer = setTimeout(() => {
+ uni.navigateBack({
+ delta: 1,
+ });
+ }, 500);
+ } else {
+ this.$u.toast(result.msg ? result.msg : "涓婁紶澶辫触");
+ }
+ });
+ }
+ },
+ beforeRead() {
+ this.changeisUploadimg(true);
+ },
+ // 鏂板鍥剧墖
+ async afterRead(event) {
+ // 褰撹缃� mutiple 涓� true 鏃�, file 涓烘暟缁勬牸寮忥紝鍚﹀垯涓哄璞℃牸寮�
+ let lists = [].concat(event.file);
+ console.log(this.fileList1, event)
+ let fileListLen = this[`fileList${event.name}`].length;
+ lists.map((item) => {
+ this[`fileList${event.name}`].push({
+ ...item,
+ status: "uploading",
+ message: "涓婁紶涓�",
+ });
+ });
+ for (let i = 0; i < lists.length; i++) {
+ const result = await this.uploadFilePromise(lists[i].url, event.name);
+ let item = this[`fileList${event.name}`][fileListLen];
+ this[`fileList${event.name}`].splice(
+ fileListLen,
+ 1,
+ Object.assign(item, {
+ status: "success",
+ message: "涓婁紶鎴愬姛",
+ url: result,
+ })
+ );
+ fileListLen++;
+ }
+ },
+ // 鍒犻櫎
+ deletePic(event) {
+ this.fileList1.splice(0, 1);
+ },
+ uploadFilePromise(url, num) {
+ return new Promise((resolve, reject) => {
+ let a = uni.uploadFile({
+ url: BaseUrl + "/admin/sys-file/uploadUnToken",
+ filePath: url,
+ name: "file",
+ success: (res) => {
+ this.form.imgPath = JSON.parse(res.data).data.url;
+ resolve(`${BaseUrl}${JSON.parse(res.data).data.url}`);
+ },
+ });
+ });
+ },
+ },
+};
</script>
<style lang="scss" scoped>
- /deep/.u-form-item__body__right__content__slot{
- width: 100%;
- display: flex;
- justify-content: center;
- align-items: center;
- /deep/u-view.u-upload__button[data-v-69e2a36e]{
- margin: 0 !important;
- }
- .deleteImg{
- width: 20px;
- height:20px;
- background-color: #ffffff;
- display: flex;
- justify-content: center;
- align-items: center;
- border-radius: 50%;
- position: relative;
- right: -80px;
- top: -25px;
- z-index: 999;
- }
- .upload{
- width: 80px;
- height: 77px;
- margin:0;
- display: flex;
- justify-content: center;
- align-items: center;
- border-radius: 50%;
- overflow: hidden;
- }
- }
- .addBtn{
- width: 120px;
- position: absolute;
- top: 80%;
- left: 50%;
- transform: translate(-50%, -50%);
- }
-</style>
\ No newline at end of file
+/deep/.u-form-item__body__right__content__slot {
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ /deep/u-view.u-upload__button[data-v-69e2a36e] {
+ margin: 0 !important;
+ }
+ .views{
+ width: 30vh;
+ height: 30vh;
+ .deleteImg {
+ width: 5vh;
+ height: 5vh;
+ background-color: #ffffff;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border-radius: 50%;
+ position: relative;
+ left: 80%;
+ bottom: 28vh;
+ z-index: 999;
+ }
+ }
+
+ .upload {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border-radius: 50%;
+ overflow: hidden;
+ font-size: 3vh;
+ }
+}
+
+.addBtn {
+ width: 40vw;
+ position: absolute;
+ top: 80%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+}
+/deep/ .u-upload__button{
+ margin: 0 !important;
+}
+/deep/ .u-upload{
+ width: 30vh;
+ height: 30vh;
+}
+/deep/ .u-upload__wrap__preview__image{
+ width: 30vh !important;
+ height: 30vh !important;
+}
+/deep/ .u-upload__button{
+ width: 30vh !important;
+ height: 30vh !important;
+}
+
+/deep/ .u-icon__icon {
+ font-size: 4vh !important;
+ font-weight: bold;
+}
+/deep/ .uicon-camera-fill{
+ font-size: 6vh !important;
+}
+</style>
--
Gitblit v1.9.1