底部

src/components/page/PersonalCenter.vue

@@ -2,7 +2,8 @@
     <div class="wrap">
         <!-- 头像部分 -->
         <div class="header">
-            <img :src="this.$store.state.avatar" class="HeadPortrait" />
+            <!-- <img :src="this.$store.state.avatar" class="HeadPortrait" /> -->
+            <el-avatar :size="80" :src="this.$store.state.avatar" class="Headtop"></el-avatar>
             <div style="color:#9278FF;font-size:14px;font-family:MicrosoftYaHei;margin-top:5px;">
                 <el-upload
                     class="upload-demo"
@@ -156,7 +157,7 @@
             </div>
 
             <div class="information" style="margin-top: 20px;">
-                <div class="archives" v-for="(archive,index) in archivesList" :key="index" v-show="index == 0 || showArch || archive.isNew">
+                <div class="archives" v-for="(archive,index) in archivesList" :key="index" v-show="index == 0 || showArch">
                     <div class="line">
                         <div class="item">
                             <span>职业</span>
@@ -260,7 +261,7 @@
             </div>
 
             <div class="fold" v-if="archivesList.length > 1">
-                <img style="width: 21px;height: 17px;" src="../../assets/img/open.png" alt="" @click="foldArch">
+                <img :class="{ 'arrowTransform': showArch, 'arrowTransformReturn': !showArch}" style="width: 21px;height: 17px;" src="../../assets/img/open.png" alt="" @click="foldArch">
             </div>
         </div>
 
@@ -1002,6 +1003,16 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.arrowTransform{
+    transition: 0.5s;
+    transform-origin: center;
+    transform: rotateZ(180deg);
+}
+.arrowTransformReturn{
+    transition: 0.5s;
+    transform-origin: center;
+    transform: rotateZ(0deg);
+}
 .wrap{
     // height: calc(100vh - 60px);
     margin: -20px;
@@ -1044,12 +1055,12 @@ input:focus {
 .openfile {
     cursor: pointer;
 }
-.HeadPortrait {
+.Headtop {
     margin-top: 10px;
-    width: 80px;
-    height: 80px;
+    // width: 80px;
+    // height: 80px;
     // background: url('../../assets/img/img.jpg');
-    border-radius: 50%;
+    // border-radius: 50%;
 
     .head {
         width: 34px;