上传照片

src/components/contact-form/index.vue

@@ -13,10 +13,11 @@ const props = defineProps(['data'])
 
 const contacts = useContactsStore()
 const contact = useContactItemStore()
+contact.setNewAvatar("")
 
 const state = reactive({
   isNickNameSuggestionsShow: false,
-  newAvatar: '',
+  newAvatar: undefined,
   isDateSelectorVisible: false
 });
 
@@ -29,7 +30,7 @@ const closeSwitch = (param) => {
 };
 const setChooseDate = (param) => {
   contact.contact.nextVisitDate = param[3]
-};
+}
 
 function setShowSuggestions(isShow: Boolean) {
   state.isNickNameSuggestionsShow = isShow
@@ -42,6 +43,7 @@ const updateFacePhoto = () => {
     success: function (res) {
       // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
       state.newAvatar = res.tempFilePaths
+      contact.setNewAvatar( res.tempFilePaths[0])
       console.log(state.newAvatar)
     },
   })
@@ -63,7 +65,8 @@ const updateNickName = (value) => {
       <view>
         <view class="d-flex justify-content-center">
           <nut-avatar size="192" @click="updateFacePhoto" class="overflow-hidden">
-            <img  v-if="contact.contact.avatar" :src="contact.contact.avatar" />
+            <img v-if="state.newAvatar" :src="state.newAvatar"/>
+            <img v-else-if="contact.contact.avatar" :src="contact.contact.avatar" />
             <view v-else class="d-flex align-items-center justify-content-center h-100 w-100">
               <Text class="fas fa-user fa-6x"></Text>
             </view>

src/pages/contact-edit/index.vue

@@ -30,11 +30,21 @@ const onSaveClicked = () => {
     })
   }).catch(error => {
     Taro.hideLoading()
-    Taro.showToast({
-      title: '网络异常，请稍候重试',
-      icon: 'none',
-      duration: 2000
-    })
+    if (error) {
+      Taro.showToast({
+        title: error,
+        icon: 'none',
+        duration: 2000
+      })
+    }
+    else {
+      Taro.showToast({
+        title: '网络异常，请稍候重试',
+        icon: 'none',
+        duration: 2000
+      })
+    }
+
     console.log("error", error)
   })
 }

src/stores/contact-item.ts

@@ -1,18 +1,23 @@
 // https://pinia.esm.dev/introduction.html
 import { defineStore } from 'pinia'
-import {GQLRequest} from "../utils";
+import {GQLRequest, Session} from "../utils";
 import {gql} from "graphql-tag";
 import {ContactData} from "./contacts";
 import {ref, Ref, UnwrapRef} from "vue";
+import Taro from "@tarojs/taro";
 
 export const useContactItemStore = defineStore('contact-item', () => {
 
   const contact: Ref<UnwrapRef<ContactData>> = ref(getEmptyContactData())
+  const contactNewAvatar: Ref<UnwrapRef<string>> = ref("")
 
   function setContact(contactItem: ContactData) {
     contact.value = contactItem
     console.log("setContact", contact.value)
   }
+  function setNewAvatar(avatar: string) {
+    contactNewAvatar.value = avatar
+  }
 
   function getEmptyContactData(): ContactData {
     return {
@@ -73,10 +78,29 @@ export const useContactItemStore = defineStore('contact-item', () => {
     const isVIP = contact.value.isVIP
     const flexVisit = contact.value.flexVisit
 
-    return GQLRequest.query(CREATE_VISITOR, { name, nickName, phone, company, isVIP, flexVisit })
+    return new Promise((resolve, reject) => {
+      if (contactNewAvatar.value !== "") {
+        uploadFace().then(r => {
+          console.log(r)
+          const resourceId = r.data.resourceId
+          GQLRequest.query(CREATE_VISITOR, { name, nickName, phone, company, isVIP, flexVisit, resourceId })
+              .then(r=> resolve(r))
+              .catch(e=> reject(e))
+        }).catch(e => {
+          reject(e.msg)
+        })
+      }
+      else {
+        GQLRequest.query(CREATE_VISITOR, { name, nickName, phone, company, isVIP, flexVisit })
+            .then(r=> resolve(r))
+            .catch(e=> reject(e))
+      }
+    })
+
   }
 
   function updateVisitor() {
+
     const id = contact.value.id
     const name = contact.value.name
     const nickName = contact.value.nickName
@@ -85,8 +109,27 @@ export const useContactItemStore = defineStore('contact-item', () => {
     const isVIP = contact.value.isVIP
     const flexVisit = contact.value.flexVisit
 
-    console.log(contact.value)
-    return GQLRequest.query(UPDATE_VISITOR, {id, name, nickName, phone, company, isVIP, flexVisit })
+
+    return new Promise((resolve, reject) => {
+      if (contactNewAvatar.value !== "") {
+        uploadFace().then(r => {
+          console.log(r)
+          const resourceId = r.data.resourceId
+          GQLRequest.query(UPDATE_VISITOR, {id, name, nickName, phone, company, isVIP, flexVisit, resourceId })
+              .then(r=> resolve(r))
+              .catch(e=> reject(e))
+        }).catch(e => {
+          reject(e.msg)
+        })
+      }
+      else {
+        GQLRequest.query(UPDATE_VISITOR, {id, name, nickName, phone, company, isVIP, flexVisit })
+            .then(r=> resolve(r))
+            .catch(e=> reject(e))
+      }
+    })
+
+
   }
 
   function deleteVisitor() {
@@ -95,6 +138,28 @@ export const useContactItemStore = defineStore('contact-item', () => {
     return GQLRequest.query(DELETE_VISITOR, { id })
   }
 
+  function uploadFace() {
+    return new Promise((resolve, reject) => {
+      console.log("aaaaaaaa", contactNewAvatar.value)
+      Taro.uploadFile({
+        url: SERVER_URL + '/system/resources/upload-face',
+        header: {
+          Authorization: 'Bearer ' + Session.get('access_token'),
+        },
+        name: "file",
+        filePath: contactNewAvatar.value,
+        success: result => {
+          const data = JSON.parse(result.data)
+          if (result.statusCode == 200 && data.code !== 500) resolve(data)
+          else reject(data)
+        },
+        fail: res => {
+          reject(res)
+        }
+      })
+    })
+  }
+
 
-  return { contact, setContact, createVisitor, updateVisitor, deleteVisitor, getEmptyContactData}
+  return { contact, setContact, createVisitor, updateVisitor, deleteVisitor, getEmptyContactData, setNewAvatar}
 })