数据产品上架添加选中效果

@@ -790,8 +790,11 @@ const btnClick = (item) => {
   }
 }
 
+const currExchangeGuid = ref('');
+
 const cardBtnClick = (item) => {
   console.log(item, '------------------')
+  currExchangeGuid.value = item.exchangeGuid;
   getTableData(item.exchangeGuid);
 }
 
@@ -920,22 +923,23 @@ const formInfo = ref<any>({
     </div>
     <div v-loading="flowDetailLoading">
       <div class="list-content" v-if="demandListData.length > 0">
-        <div class="card-content" v-for="item in demandListData" :key="item.guid" @click="cardBtnClick(item)">
+        <div class="card-content" v-for="item in demandListData" :key="item.guid" @click="cardBtnClick(item)" :class="{ active: currExchangeGuid == item.exchangeGuid }">
           <div class="header">
             <div class="header-top">
               <img class="left-img"
                 :src="(item.picUrl && typeof item.picUrl == 'string') ? item.picUrl : defaultItemLogo" alt="" />
-              <div class="title">{{ item.exchangeName ?? '--' }}</div>
+              <div class="title">  <ellipsis-tooltip :content="item.exchangeName ?? '--'" class-name="w100f"
+                :refName="'tooltipOver'"></ellipsis-tooltip></div>
             </div>
             <div class="right-main">
               <div class="count-group">
                 <div class="count-item">
                   <div class="item-label">已上架产品数</div>
-                  <div class="item-num">{{ item.listingNum || '--' }}</div>
+                  <div class="item-num">{{ changeNum(item.listingNum || 0) }}</div>
                 </div>
                 <div class="count-item">
                   <div class="item-label">审批中产品数</div>
-                  <div class="item-num">{{ item.underReviewNum || '--' }}</div>
+                  <div class="item-num">{{ changeNum(item.underReviewNum || 0) }}</div>
                 </div>
               </div>
             </div>
@@ -1000,15 +1004,27 @@ const formInfo = ref<any>({
     display: flex;
 
     flex-wrap: wrap;
-    padding: 0 8px;
+    padding: 0 0px 0px 8px;
 
     .card-content {
-      width: 300px;
+      width: 290px;
       // box-shadow: 0 0 0 1px #d9d9d9;
       border: 1px solid #d9d9d9;
       border-radius: 3px;
       margin-right: 12px;
       margin-bottom: 12px;
+      cursor: pointer;
+
+      &:hover {
+        border: 1px solid var(--el-color-primary);
+      }
+
+      &.active {
+        border: 1px solid var(--el-color-primary);
+        .header {
+          background-color: #ebf6f7;
+        }
+      }
 
       .header {
         display: flex;