修改

src/assets/styles/vxe-table.scss

@@ -25,4 +25,7 @@ $vxe-primary-color: #2c9049;
     & + .vxe-body--expanded-row {
         background-color: var(--vxe-table-row-hover-background-color);
     }
+}
+.row-expired {
+    opacity: .5;
 }

src/views/cdt/menus/detail/index.vue

@@ -38,11 +38,11 @@
                         </el-descriptions-item>
                     </el-descriptions>
                     <el-divider />
-                    <div class="info-title mb-16 d-flex">
+                    <div class="info-title mb-16 d-flex a-c">
                         <span>检测项目明细</span>
-                        <span class="f-s-14">（共{{itemsInfo?.length}}项, 合计{{ totalCountPrice }}元）</span>
+                        <span class="f-s-14 mr-10">（共{{itemsInfo?.length}}项, 合计{{ totalCountPrice }}元）</span>
+                        <el-button type="primary" :text="true" @click="expend=!expend">{{ expend?'收起':'展开' }}</el-button>
                     </div>
-                    <el-button type="primary" :text="true" @click="expend=!expend">{{ expend?'收起':'展开' }}</el-button>
                     <vxe-table v-show="expend" ref="tableRightRef" border :data="itemsInfo" :column-config="{ resizable: true }">
                         <vxe-column type="seq" width="60" title="序号" align="center" />
                         <vxe-column title="检测项目" align="center" field="name" min-width="100" :formatter="colNoData" />
@@ -64,6 +64,8 @@
                             <template #default="{ row }">{{ row.price || '-' }}元</template>
                         </vxe-column>
                     </vxe-table>
+                    <el-divider />
+                    <div class="info-title mb-16">销售明细</div>
                 </div>
             </div>
         </div>

src/views/cdt/menus/index.vue

@@ -39,7 +39,7 @@
                 <searchTabs v-model="queryParams.publicFlag" @change="handleQuery" :list="tabs" key-label="name" key-value="type" key-count="num"></searchTabs>
                 <div class="pd-8"></div>
                 <div class="flex1 ov-hd">
-                    <vxe-table :loading="loading" border :data="list" min-height="0" max-height="100%">
+                    <vxe-table :loading="loading" border :data="list" min-height="0" max-height="100%" :row-class-name="rowClassName">
                         <!-- 序号 -->
                         <vxe-column type="seq" fixed="left" width="60" title="序号" align="center" />
                         <vxe-column title="套餐名称" fixed="left" align="center" field="name" min-width="100" :formatter="colNoData" />
@@ -55,9 +55,7 @@
                                 </view>
                                 <view class="d-flex flex-cln" v-if="row?.permitType == '2'">
                                     <view>
-                                        {{ row?.permitCpyNames?.join(',') }}-{{
-                                            NP.times(row?.priceDetail?.length&&row?.priceDetail[0]?.memberDiscount||0, 10)
-                                        }}折
+                                        {{ row?.permitCpyNames?.join(',') }}-{{ NP.times(row?.priceDetail?.length && row?.priceDetail[0]?.memberDiscount || 0, 10)}}折
                                         <span class="c-333 f-w-5">（{{ row?.priceDetail?.length&&row?.priceDetail[0]?.price }}）</span>
                                     </view>
                                 </view>
@@ -67,7 +65,10 @@
                             <template #default="{ row }">
                                 <view v-if="row?.items">
                                     {{ row?.items }}
-                                    <el-button @click="queryRowItems(row)" type="primary" text>点击查看详情{{ '>' }}</el-button>
+                                    <el-button @click="queryRowItems(row)" type="primary" text>
+                                        点击查看详情{{ '>'
+                                        }}
+                                    </el-button>
                                 </view>
                                 <view v-else>-</view>
                             </template>
@@ -85,7 +86,7 @@
                         </vxe-column>
                         <vxe-column title="剩余时间" field="restDay" width="100">
                             <template #default="{ row }">
-                                <span v-if="new Date(row?.validUntil ) > new Date()">{{Math.floor((new Date(row?.validUntil).getTime()-new Date().getTime())/(3600*24*1000))+1 }}天</span>
+                                <span v-if="new Date(row?.validUntil) > new Date()">{{ Math.floor((new Date(row?.validUntil).getTime() - new Date().getTime())/(3600*24*1000))+1 }}天</span>
                                 <span v-else>已过期</span>
                             </template>
                         </vxe-column>
@@ -256,6 +257,12 @@ const download = () => {
     // 触发点击
     a.click()
 }
+const rowClassName = ({ row }) => {
+   console.log(row, '---');
+   if (new Date(row?.validUntil) <= new Date()) {
+      return 'row-expired';
+   }
+}
 onMounted(() => {
     getTabsCount();
     getList();
@@ -265,3 +272,4 @@ onActivated(() => {
     getList();
 });
 </script>
+<style lang="scss" scoped></style>