修改智能推荐过渡动画

src/views/center/demand.vue

@@ -64,28 +64,30 @@
             </template>
           </custom-form>
         </el-col>
-        <el-col :span="24" v-if="dialog.type == '2'" class="dialog">
-          <div class="list" v-for="(item, index) in supplyList" :key="index" @click="toView(item)">
-            <h2 class="name textMore">
-              <span>{{ item.name || '暂无' }}</span>
-            </h2>
-            <div class="other">
-              <span class="other_1">{{ getDict(item.urgent, 'urgent') || '暂无' }}</span>
-              <div class="other_2">
-                <span>应用行业：</span>
-                {{ item.field || '暂无' }}
-              </div>
-              <div class="other_2">
-                <span>所属产业：</span>
-                {{ item.industry || '暂无' }}
-              </div>
-              <div class="other_2">
-                <span>来源：</span>
-                {{ item.source || '暂无' }}
+        <transition name="why">
+          <el-col :span="24" v-if="dialog.type == '2'" class="dialog">
+            <div class="list" v-for="(item, index) in supplyList" :key="index" @click="toView(item)">
+              <h2 class="name textMore">
+                <span>{{ item.name || '暂无' }}</span>
+              </h2>
+              <div class="other">
+                <span class="other_1">{{ getDict(item.urgent, 'urgent') || '暂无' }}</span>
+                <div class="other_2">
+                  <span>应用行业：</span>
+                  {{ item.field || '暂无' }}
+                </div>
+                <div class="other_2">
+                  <span>所属产业：</span>
+                  {{ item.industry || '暂无' }}
+                </div>
+                <div class="other_2">
+                  <span>来源：</span>
+                  {{ item.source || '暂无' }}
+                </div>
               </div>
             </div>
-          </div>
-        </el-col>
+          </el-col>
+        </transition>
       </el-row>
     </el-dialog>
   </div>
@@ -347,6 +349,22 @@ const sizeChange = (limits) => {
     margin: 20px 0 0 0;
   }
 }
+.why-enter-from,
+.why-leave-to {
+  opacity: 0;
+  transform: scale(0.6);
+}
+
+.why-enter-to,
+.why-leave-from {
+  opacity: 1;
+  transform: scale(1);
+}
+
+.why-enter-active,
+.why-leave-active {
+  transition: all 2s ease;
+}
 .dialog {
   display: flex;
   flex-wrap: wrap;

src/views/center/index.vue

@@ -23,7 +23,6 @@ onMounted(async () => {
   if (str) {
     ElMessageBox.confirm(str, '用户异常', {
       confirmButtonText: '重新登录',
-      // cancelButtonText: i18n.global.t('common.reload'),
       type: 'error'
     })
       .then(() => {

src/views/center/project.vue

@@ -72,29 +72,31 @@
             </template>
           </custom-form>
         </el-col>
-        <el-col :span="24" v-if="dialog.type == '2'" class="dialog">
-          <div class="list" v-for="(item, index) in demandList" :key="index" @click="toView(item)">
-            <h2 class="name textMore">
-              <span>{{ item.name || '暂无' }}</span>
-            </h2>
-            <div class="other">
-              <span class="other_1">{{ getDict(item.urgent, 'urgent') || '暂无' }}</span>
-              <div class="other_2">
-                <span>应用行业：</span>
-                {{ item.field || '暂无' }}
-              </div>
-              <div class="other_2">
-                <span>资金预算：</span>
-                {{ item.money || '面议' }}
-              </div>
-              <div class="other_2 textOne">
-                <el-icon color="#0085f5"><Location /></el-icon>
-                {{ getArea(item.area) }}
-                <span class="state">{{ getDict(item.status, 'status') || '未解决' }}</span>
+        <transition name="why">
+          <el-col :span="24" v-if="dialog.type == '2'" class="dialog">
+            <div class="list" v-for="(item, index) in demandList" :key="index" @click="toView(item)">
+              <h2 class="name textMore">
+                <span>{{ item.name || '暂无' }}</span>
+              </h2>
+              <div class="other">
+                <span class="other_1">{{ getDict(item.urgent, 'urgent') || '暂无' }}</span>
+                <div class="other_2">
+                  <span>应用行业：</span>
+                  {{ item.field || '暂无' }}
+                </div>
+                <div class="other_2">
+                  <span>资金预算：</span>
+                  {{ item.money || '面议' }}
+                </div>
+                <div class="other_2 textOne">
+                  <el-icon color="#0085f5"><Location /></el-icon>
+                  {{ getArea(item.area) }}
+                  <span class="state">{{ getDict(item.status, 'status') || '未解决' }}</span>
+                </div>
               </div>
             </div>
-          </div>
-        </el-col>
+          </el-col>
+        </transition>
       </el-row>
     </el-dialog>
   </div>
@@ -317,6 +319,7 @@ const getArea = (data) => {
 }
 const toClose = () => {
   form.value = { file: [] }
+  width.value = '50%'
   dialog.value = { show: false }
 }
 // 分页
@@ -354,6 +357,22 @@ const sizeChange = (limits) => {
     margin: 20px 0 0 0;
   }
 }
+.why-enter-from,
+.why-leave-to {
+  opacity: 0;
+  transform: scale(0.6);
+}
+
+.why-enter-to,
+.why-leave-from {
+  opacity: 1;
+  transform: scale(1);
+}
+
+.why-enter-active,
+.why-leave-active {
+  transition: all 2s ease;
+}
 .dialog {
   display: flex;
   flex-wrap: wrap;

src/views/center/supply.vue

@@ -64,29 +64,31 @@
             </template>
           </custom-form>
         </el-col>
-        <el-col :span="24" v-if="dialog.type == '2'" class="dialog">
-          <div class="list" v-for="(item, index) in demandList" :key="index" @click="toView(item)">
-            <h2 class="name textMore">
-              <span>{{ item.name || '暂无' }}</span>
-            </h2>
-            <div class="other">
-              <span class="other_1">{{ getDict(item.urgent, 'urgent') || '暂无' }}</span>
-              <div class="other_2">
-                <span>应用行业：</span>
-                {{ item.field || '暂无' }}
-              </div>
-              <div class="other_2">
-                <span>资金预算：</span>
-                {{ item.money || '面议' }}
-              </div>
-              <div class="other_2 textOne">
-                <el-icon color="#0085f5"><Location /></el-icon>
-                {{ getArea(item.area) }}
-                <span class="state">{{ getDict(item.status, 'status') || '未解决' }}</span>
+        <transition name="why">
+          <el-col :span="24" v-if="dialog.type == '2'" class="dialog">
+            <div class="list" v-for="(item, index) in demandList" :key="index" @click="toView(item)">
+              <h2 class="name textMore">
+                <span>{{ item.name || '暂无' }}</span>
+              </h2>
+              <div class="other">
+                <span class="other_1">{{ getDict(item.urgent, 'urgent') || '暂无' }}</span>
+                <div class="other_2">
+                  <span>应用行业：</span>
+                  {{ item.field || '暂无' }}
+                </div>
+                <div class="other_2">
+                  <span>资金预算：</span>
+                  {{ item.money || '面议' }}
+                </div>
+                <div class="other_2 textOne">
+                  <el-icon color="#0085f5"><Location /></el-icon>
+                  {{ getArea(item.area) }}
+                  <span class="state">{{ getDict(item.status, 'status') || '未解决' }}</span>
+                </div>
               </div>
             </div>
-          </div>
-        </el-col>
+          </el-col>
+        </transition>
       </el-row>
     </el-dialog>
   </div>
@@ -345,6 +347,22 @@ const sizeChange = (limits) => {
     margin: 20px 0 0 0;
   }
 }
+.why-enter-from,
+.why-leave-to {
+  opacity: 0;
+  transform: scale(0.6);
+}
+
+.why-enter-to,
+.why-leave-from {
+  opacity: 1;
+  transform: scale(1);
+}
+
+.why-enter-active,
+.why-leave-active {
+  transition: all 2s ease;
+}
 .dialog {
   display: flex;
   flex-wrap: wrap;

src/views/detail/expertDetail.vue

@@ -41,22 +41,7 @@
           <div class="infoOther">
             <div class="title">合作信息</div>
             <div class="content">
-              <el-table
-                :data="tableData"
-                stripe
-                style="width: 100%"
-                :header-cell-style="{
-                  backgroundColor: 'rgba(194, 209, 225, 0.5)',
-                  color: '#ffffff',
-                  fontSize: '16px',
-                  textAlign: 'center'
-                }"
-                :cell-style="{
-                  fontSize: '16px',
-                  textAlign: 'center'
-                }"
-                :row-style="{ fontSize: '16px', textAlign: 'center' }"
-              >
+              <el-table :data="tableData" stripe style="width: 100%" :header-cell-style="{ backgroundColor: 'rgba(194, 209, 225, 0.5)', color: '#ffffff', fontSize: '16px', textAlign: 'center' }" :cell-style="{ fontSize: '16px', textAlign: 'center' }" :row-style="{ fontSize: '16px', textAlign: 'center' }">
                 <el-table-column prop="company" label="合作单位" />
                 <el-table-column prop="num" label="合作论文数量" />
               </el-table>
@@ -81,7 +66,7 @@
                 </div>
               </div>
               <div class="content_2">
-                <div class="scientific">
+                <div class="brief">
                   {{ info.brief || '暂无' }}
                 </div>
               </div>
@@ -118,8 +103,6 @@ const tableData = ref([
 ])
 const active = ref('1')
 const info = ref({})
-const scientific = ref([])
-// const scientific = ref(['面向等离子体材料用先进钨复合材料的改性研究进展与趋势', '湿化学法W-Re合金制备与性能', '低能高通量氨离子辐照下W28Ta28V28Zr8Sc8高熵合金损伤行为研究', '配位聚合物衍生的硒化锡@多孔碳纳米棒及其储钠性能研究'])
 // 请求
 onMounted(async () => {
   loading.value = true
@@ -300,7 +283,7 @@ const toCollect = async () => {
           }
           .content_2 {
             margin: 10px 0;
-            .scientific {
+            .brief {
               margin: 10px 0;
             }
           }