放弃vuex改用pinia (#872)

Co-authored-by: bypanghu <bypanghu@163.com>

web/src/components/chooseImg/index.vue

@@ -19,7 +19,7 @@
 </template>
 
 <script setup>
-import { defineEmits, defineProps, ref, defineExpose } from 'vue'
+import { ref } from 'vue'
 import { getFileList } from '@/api/fileUploadAndDownload'
 
 const emit = defineEmits(['chooseImg'])

web/src/components/customPic/index.vue

@@ -1,11 +1,11 @@
 <template>
   <span class="headerAvatar">
     <template v-if="picType === 'avatar'">
-      <el-avatar v-if="userInfo.headerImg" :size="30" :src="avatar" />
+      <el-avatar v-if="userStore.userInfo.headerImg" :size="30" :src="avatar" />
       <el-avatar v-else :size="30" :src="noAvatar" />
     </template>
     <template v-if="picType === 'img'">
-      <img v-if="userInfo.headerImg" :src="avatar" class="avatar">
+      <img v-if="userStore.userInfo.headerImg" :src="avatar" class="avatar">
       <img v-else :src="noAvatar" class="avatar">
     </template>
     <template v-if="picType === 'file'">
@@ -22,10 +22,8 @@ export default {
 
 <script setup>
 import noAvatarPng from '@/assets/noBody.png'
-import { useStore } from 'vuex'
-import { computed, ref, defineProps } from 'vue'
-const store = useStore()
-
+import { useUserStore } from '@/pinia/modules/user'
+import { computed, ref } from 'vue'
 const props = defineProps({
   picType: {
     type: String,
@@ -41,14 +39,15 @@ const props = defineProps({
 
 const path = ref(import.meta.env.VITE_BASE_API + '/')
 const noAvatar = ref(noAvatarPng)
-const userInfo = computed(() => store.getters['user/userInfo'])
+
+const userStore = useUserStore()
 
 const avatar = computed(() => {
   if (props.picSrc === '') {
-    if (userInfo.value.headerImg !== '' && userInfo.value.headerImg.slice(0, 4) === 'http') {
-      return userInfo.value.headerImg
+    if (userStore.userInfo.headerImg !== '' && userStore.userInfo.headerImg.slice(0, 4) === 'http') {
+      return userStore.userInfo.headerImg
     }
-    return path.value + userInfo.value.headerImg
+    return path.value + userStore.userInfo.headerImg
   } else {
     if (props.picSrc !== '' && props.picSrc.slice(0, 4) === 'http') {
       return props.picSrc

web/src/components/upload/image.vue

@@ -3,7 +3,7 @@
   <div>
     <el-upload
       :action="`${path}/fileUploadAndDownload/upload`"
-      :headers="{ 'x-token': token }"
+      :headers="{ 'x-token': userStore.token }"
       :show-file-list="false"
       :on-success="handleImageSuccess"
       :before-upload="beforeImageUpload"
@@ -16,53 +16,53 @@
 
 <script setup>
 import ImageCompress from '@/utils/image'
-import { computed, ref } from 'vue'
-import { useStore } from 'vuex'
+import { ref } from 'vue'
 import { ElMessage } from 'element-plus'
-const store = useStore()
+import { useUserStore } from '@/pinia/modules/user'
 
 const emit = defineEmits(['on-success'])
 const props = defineProps({
-    imageUrl: {
-      type: String,
-      default: ''
-    },
-    fileSize: {
-      type: Number,
-      default: 2048 // 2M 超出后执行压缩
-    },
-    maxWH: {
-      type: Number,
-      default: 1920 // 图片长宽上限
-    }
-  })
+  imageUrl: {
+    type: String,
+    default: ''
+  },
+  fileSize: {
+    type: Number,
+    default: 2048 // 2M 超出后执行压缩
+  },
+  maxWH: {
+    type: Number,
+    default: 1920 // 图片长宽上限
+  }
+})
 
 const path = ref(import.meta.env.VITE_BASE_API)
-const token = computed(()=>store.getters['user/token'])
+
+const userStore = useUserStore()
 
 const beforeImageUpload = (file) => {
-      const isJPG = file.type === 'image/jpeg'
-      const isPng = file.type === 'image/png'
-      if (!isJPG && !isPng) {
-        ElMessage.error('上传头像图片只能是 jpg或png 格式!')
-        return false
-      }
+  const isJPG = file.type === 'image/jpeg'
+  const isPng = file.type === 'image/png'
+  if (!isJPG && !isPng) {
+    ElMessage.error('上传头像图片只能是 jpg或png 格式!')
+    return false
+  }
 
-      const isRightSize = file.size / 1024 < props.fileSize
-      if (!isRightSize) {
-        // 压缩
-        const compress = new ImageCompress(file, props.fileSize, props.maxWH)
-        return compress.compress()
-      }
-      return isRightSize
-    }
+  const isRightSize = file.size / 1024 < props.fileSize
+  if (!isRightSize) {
+    // 压缩
+    const compress = new ImageCompress(file, props.fileSize, props.maxWH)
+    return compress.compress()
+  }
+  return isRightSize
+}
 
-    const handleImageSuccess = (res) => {
-      const { data } = res
-      if (data.file) {
-        emit('on-success',data.file.url)
-      }
-    }
+const handleImageSuccess = (res) => {
+  const { data } = res
+  if (data.file) {
+    emit('on-success', data.file.url)
+  }
+}
 
 </script>
 
@@ -71,7 +71,7 @@ const beforeImageUpload = (file) => {
 export default {
   name: 'UploadImage',
   methods: {
-    
+
   }
 }
 </script>

web/src/components/warningBar/warningBar.vue

@@ -12,7 +12,6 @@
 </template>
 <script setup>
 import { WarningFilled } from '@element-plus/icons'
-import { defineProps } from 'vue'
 defineProps({
   title: {
     type: String,