feat:更新朋友圈UI

pnpm-lock.yaml

@@ -22,7 +22,7 @@ importers:
         version: 3.5.17(typescript@5.8.3)
       vue3-common:
         specifier: git+https://gitee.com/Cxx0822/vue3-common
-        version: git+https://gitee.com/Cxx0822/vue3-common#4cabccc268f404bef9fd13078ff88fc2830b7461(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint@7.32.0)(typescript@5.8.3))(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint-config-standard@16.0.3(eslint-plugin-import@2.32.0(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint@7.32.0))(eslint-plugin-node@11.1.0(eslint@7.32.0))(eslint-plugin-promise@5.2.0(eslint@7.32.0))(eslint@7.32.0))(eslint-plugin-import@2.32.0(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint@7.32.0))(eslint-plugin-node@11.1.0(eslint@7.32.0))(eslint-plugin-promise@5.2.0(eslint@7.32.0))(eslint-plugin-vue@8.7.1(eslint@7.32.0))(eslint@7.32.0)(pinia@2.3.1(typescript@5.8.3)(vue@3.5.17(typescript@5.8.3)))(vue-router@4.5.1(vue@3.5.17(typescript@5.8.3)))(vue@3.5.17(typescript@5.8.3))
+        version: git+https://gitee.com/Cxx0822/vue3-common#0d4a3beb7b1bfb068fe6672c25839997cd8d2129(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint@7.32.0)(typescript@5.8.3))(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint-config-standard@16.0.3(eslint-plugin-import@2.32.0(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint@7.32.0))(eslint-plugin-node@11.1.0(eslint@7.32.0))(eslint-plugin-promise@5.2.0(eslint@7.32.0))(eslint@7.32.0))(eslint-plugin-import@2.32.0(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint@7.32.0))(eslint-plugin-node@11.1.0(eslint@7.32.0))(eslint-plugin-promise@5.2.0(eslint@7.32.0))(eslint-plugin-vue@8.7.1(eslint@7.32.0))(eslint@7.32.0)(pinia@2.3.1(typescript@5.8.3)(vue@3.5.17(typescript@5.8.3)))(vue-router@4.5.1(vue@3.5.17(typescript@5.8.3)))(vue@3.5.17(typescript@5.8.3))
       vue3-emoji-picker:
         specifier: ^1.1.8
         version: 1.1.8(typescript@5.8.3)
@@ -1220,8 +1220,8 @@ packages:
     resolution: {integrity: sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==}
     engines: {node: '>= 0.4'}
 
-  form-data@4.0.3:
+  form-data@4.0.4:
-    resolution: {integrity: sha512-qsITQPfmvMOSAdeyZ+12I1c+CKSstAFAwu+97zrnWAbIr5u8wfsExUzCesVLC8NgHuRUqNN4Zy6UPWUTRGslcA==}
+    resolution: {integrity: sha512-KrGhL9Q4zjj0kiUt5OO4Mr/A/jlI2jDYs5eHBpYHPcBEVSiipAvn2Ko2HnPe20rmcuuvMHNdZFp+4IlGTMF0Ow==}
     engines: {node: '>= 6'}
 
   fs.realpath@1.0.0:
@@ -2022,8 +2022,8 @@ packages:
     peerDependencies:
       typescript: '>=5.0.0'
 
-  vue3-common@git+https://gitee.com/Cxx0822/vue3-common#4cabccc268f404bef9fd13078ff88fc2830b7461:
+  vue3-common@git+https://gitee.com/Cxx0822/vue3-common#0d4a3beb7b1bfb068fe6672c25839997cd8d2129:
-    resolution: {commit: 4cabccc268f404bef9fd13078ff88fc2830b7461, repo: https://gitee.com/Cxx0822/vue3-common, type: git}
+    resolution: {commit: 0d4a3beb7b1bfb068fe6672c25839997cd8d2129, repo: https://gitee.com/Cxx0822/vue3-common, type: git}
     version: 1.0.0
     peerDependencies:
       pinia: ^2.3.0
@@ -2727,7 +2727,7 @@ snapshots:
   axios@1.10.0:
     dependencies:
       follow-redirects: 1.15.9
-      form-data: 4.0.3
+      form-data: 4.0.4
       proxy-from-env: 1.1.0
     transitivePeerDependencies:
       - debug
@@ -3284,7 +3284,7 @@ snapshots:
     dependencies:
       is-callable: 1.2.7
 
-  form-data@4.0.3:
+  form-data@4.0.4:
     dependencies:
       asynckit: 0.4.0
       combined-stream: 1.0.8
@@ -4119,7 +4119,7 @@ snapshots:
       '@vue/language-core': 2.2.10(typescript@5.8.3)
       typescript: 5.8.3
 
-  vue3-common@git+https://gitee.com/Cxx0822/vue3-common#4cabccc268f404bef9fd13078ff88fc2830b7461(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint@7.32.0)(typescript@5.8.3))(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint-config-standard@16.0.3(eslint-plugin-import@2.32.0(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint@7.32.0))(eslint-plugin-node@11.1.0(eslint@7.32.0))(eslint-plugin-promise@5.2.0(eslint@7.32.0))(eslint@7.32.0))(eslint-plugin-import@2.32.0(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint@7.32.0))(eslint-plugin-node@11.1.0(eslint@7.32.0))(eslint-plugin-promise@5.2.0(eslint@7.32.0))(eslint-plugin-vue@8.7.1(eslint@7.32.0))(eslint@7.32.0)(pinia@2.3.1(typescript@5.8.3)(vue@3.5.17(typescript@5.8.3)))(vue-router@4.5.1(vue@3.5.17(typescript@5.8.3)))(vue@3.5.17(typescript@5.8.3)):
+  vue3-common@git+https://gitee.com/Cxx0822/vue3-common#0d4a3beb7b1bfb068fe6672c25839997cd8d2129(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint@7.32.0)(typescript@5.8.3))(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint-config-standard@16.0.3(eslint-plugin-import@2.32.0(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint@7.32.0))(eslint-plugin-node@11.1.0(eslint@7.32.0))(eslint-plugin-promise@5.2.0(eslint@7.32.0))(eslint@7.32.0))(eslint-plugin-import@2.32.0(@typescript-eslint/parser@5.62.0(eslint@7.32.0)(typescript@5.8.3))(eslint@7.32.0))(eslint-plugin-node@11.1.0(eslint@7.32.0))(eslint-plugin-promise@5.2.0(eslint@7.32.0))(eslint-plugin-vue@8.7.1(eslint@7.32.0))(eslint@7.32.0)(pinia@2.3.1(typescript@5.8.3)(vue@3.5.17(typescript@5.8.3)))(vue-router@4.5.1(vue@3.5.17(typescript@5.8.3)))(vue@3.5.17(typescript@5.8.3)):
     dependencies:
       '@fortawesome/fontawesome-free': 6.7.2
       '@popperjs/core': 2.11.8

src/components/Moment/MomentCard.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="moment-card card-item">
-    <el-avatar :src="avatarUrl" fit="contain" @click="viewProfileClick"/>
+    <el-avatar :src="avatarUrl" :size="35" fit="contain" @click="viewProfileClick"/>
 
     <div class="moment-content">
       <span class="username">{{ props.item.username }}</span>
@@ -9,6 +9,7 @@
       <div class="moment-image-list">
         <el-image v-for="(item, index) in props.item.imageList" :key="index"
                   :src="serviceFileRootPath + item" fit="cover"
+                  :initial-index="index"
                   :preview-src-list=previewList />
       </div>
 

src/store/app.ts

@@ -15,7 +15,7 @@ export const useAppStore = defineStore('ipp', {
     isDark: false,
     isWebSocket: false,
     serverIp: '14.103.235.151',
-    version: 'v1.0.0.2025070201'
+    version: 'v1.0.0.2025071801'
   }),
   actions: {
     initApp() {

src/styles/moment.module.scss

@@ -12,8 +12,8 @@
       padding: 10px;
 
       display: grid;
-      grid-template-columns: 50px 1fr;
+      grid-template-columns: 35px 1fr;
-      gap: 10px;
+      gap: 5px;
 
       .moment-content {
         display: flex;
@@ -31,7 +31,7 @@
 
         .moment-image-list {
           display: grid;
-          grid-template-columns: repeat(2, 1fr);
+          grid-template-columns: repeat(3, 1fr);
           gap: 10px;
         }
 

src/views/moment/form.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="moment-form common-mobile-view">
     <el-form ref="formRef" :model="foodStore.currentMoment"
-             :rules="rules" label-width="60">
+             :rules="rules" label-width="55">
       <el-form-item label="内容" prop="content">
         <el-input v-model="foodStore.currentMoment.content"
                   type="textarea" :rows="3"
@@ -12,7 +12,8 @@
       <el-form-item label="图片">
         <upload-image v-model="foodStore.currentMoment.imageList"
                       :service-url="fileServiceUrl"
-                      :image-limit="4"
+                      :image-limit="9"
+                      :multiple="true"
                       :service-file-root-path="serviceFileRootPath"
                       :image-path="foodStore.imagePath"/>
       </el-form-item>