优化等

src/components/admin/dialog/index.vue

@@ -1,12 +1,13 @@
 <template>
   <div>
-    <el-dialog :model-value="modelValue" :show-close="false" :fullscreen="isFullscreen" v-bind="$attrs" :width="width" :close="close" :before-close="beforeClose" draggable>
+    <el-dialog :model-value="modelValue" :align-center="alignCenter" :show-close="false" :style="{ height }"
+      :fullscreen="isFullscreen" v-bind="$attrs" :width="width" :close="close" :before-close="beforeClose" draggable>
       <template #header="{ titleId, titleClass }">
         <div class="flex justify-between w-full">
           <div>
             <h4 :id="titleId" :class="titleClass">{{ title }}</h4>
           </div>
-          <div class="flex w-12 justify-end">
+          <div class="flex justify-end w-12">
             <!--<Icon :name="fullscreenIcon" @click="fullscreen" className="hover:cursor-pointer w-4 h-4" />-->
             <Icon name="x-mark" className="hover:cursor-pointer w-5 h-5" @click="close" />
           </div>
@@ -36,7 +37,15 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
-
+  alignCenter: {
+    type: Boolean,
+    default: false,
+  },
+  height: {
+    type: String,
+    required: false,
+    default: '',
+  },
   width: {
     type: String,
     required: false,
@@ -92,6 +101,7 @@ const getWidth = () => {
 <style scoped lang="scss">
 :deep(.el-dialog) {
   border-radius: 0.5rem;
+
   .el-dialog__header {
     margin-right: 0 !important;
     border-bottom: 1px solid #e2e8f0;

src/views/ordersManage/tabs/rechargeList/index.vue

@@ -49,23 +49,23 @@
             v-model="query.orderTime" type="daterange" :shortcuts="shortcuts" range-separator="To"
             start-placeholder="开始时间" end-placeholder="结束时间" />
         </el-form-item>
-		<el-form-item label="支付名称" prop="pay_merchant_name"  v-if="rolesIdentify.includes('administrator')">
-		  <el-input v-model="query.pay_merchant_name" placeholder="请输入支付名称" clearable />
-		</el-form-item>
-		<el-form-item label="收款主体" prop="payee_name" v-if="rolesIdentify.includes('administrator')">
-		  <el-input v-model="query.payee_name" placeholder="请输入收款主体" clearable />
-		</el-form-item>
-		<el-form-item label="支付商户号" prop="pay_appid"  v-if="rolesIdentify.includes('administrator')">
-		  <el-input v-model="query.pay_appid" placeholder="请输入支付商户号" clearable />
-		</el-form-item>
+        <el-form-item label="支付名称" prop="pay_merchant_name" v-if="rolesIdentify.includes('administrator')">
+          <el-input v-model="query.pay_merchant_name" placeholder="请输入支付名称" clearable />
+        </el-form-item>
+        <el-form-item label="收款主体" prop="payee_name" v-if="rolesIdentify.includes('administrator')">
+          <el-input v-model="query.payee_name" placeholder="请输入收款主体" clearable />
+        </el-form-item>
+        <el-form-item label="支付商户号" prop="pay_appid" v-if="rolesIdentify.includes('administrator')">
+          <el-input v-model="query.pay_appid" placeholder="请输入支付商户号" clearable />
+        </el-form-item>
       </template>
       <template v-slot:extra_button>
-        <exportExcel  v-if="rolesIdentify.includes('administrator')"  api="channel/order_list" sheet_name="订单列表" :title_obj="titlePtObj"
+        <exportExcel v-if="rolesIdentify.includes('administrator')" api="channel/order_list" sheet_name="订单列表"
+          :title_obj="titlePtObj" :extro_params="{ is_export: true, ...query }">
+        </exportExcel>
+        <exportExcel v-else api="channel/order_list" sheet_name="订单列表" :title_obj="titleObj"
           :extro_params="{ is_export: true, ...query }">
         </exportExcel>
-		<exportExcel v-else api="channel/order_list" sheet_name="订单列表" :title_obj="titleObj"
-		  :extro_params="{ is_export: true, ...query }">
-		</exportExcel>
       </template>
     </Search>
     <div class="table-default">
@@ -98,12 +98,15 @@
         </el-table-column>
         <el-table-column prop="pay_name" label="支付方式" show-overflow-tooltip min-width="150px">
         </el-table-column>
-		<el-table-column prop="pay_merchant_name" label="支付名称" show-overflow-tooltip min-width="150px"  v-if="rolesIdentify.includes('administrator')">
-		</el-table-column>
-		<el-table-column prop="payee_name" label="收款主体" show-overflow-tooltip min-width="150px"  v-if="rolesIdentify.includes('administrator')">
-		</el-table-column>
-		<el-table-column prop="pay_appid" label="支付商户号" show-overflow-tooltip min-width="150px"  v-if="rolesIdentify.includes('administrator')">
-		</el-table-column>
+        <el-table-column prop="pay_merchant_name" label="支付名称" show-overflow-tooltip min-width="150px"
+          v-if="rolesIdentify.includes('administrator')">
+        </el-table-column>
+        <el-table-column prop="payee_name" label="收款主体" show-overflow-tooltip min-width="150px"
+          v-if="rolesIdentify.includes('administrator')">
+        </el-table-column>
+        <el-table-column prop="pay_appid" label="支付商户号" show-overflow-tooltip min-width="150px"
+          v-if="rolesIdentify.includes('administrator')">
+        </el-table-column>
         <el-table-column prop="status_txt" label="订单状态" show-overflow-tooltip min-width="150px">
           <template #default="scope">
             <div class="wrapper">
@@ -127,7 +130,7 @@
       </el-table>
       <Paginate />
     </div>
-    <Dialog v-model="userDetailVisible" width="50%" title="用户详情" destroy-on-close>
+    <Dialog v-model="userDetailVisible" width="50%" title="用户详情" :alignCenter="true" destroy-on-close>
       <userDetail @close="closeType('applyVisible')" :primary="userDetailData"></userDetail>
     </Dialog>
     <Dialog v-model="applyVisible" width="50%" title="申请退款" destroy-on-close>
@@ -141,7 +144,7 @@ import { shortcuts } from '@/utils/shortcuts'
 import { useRouter, useRoute } from 'vue-router'
 import { InfoFilled } from '@element-plus/icons-vue';
 import { useGetList } from '@/hook/curd/useGetList';
-import { titleObj,titlePtObj } from "./excelTitle"
+import { titleObj, titlePtObj } from "./excelTitle"
 import userDetail from './userDetail/index.vue'
 import create from './form/create.vue'
 import {
@@ -319,5 +322,4 @@ onMounted(() => {
       font-size: 15px;
     }
   }
-}
-</style>
+}</style>

src/views/pageLayout/channelPageManage/form/config.vue

@@ -26,7 +26,7 @@
       }}</el-button>
     </div>
   </el-form>
-  <Dialog v-model="videoVisible" title="选择短剧" width="50%" destroy-on-close>
+  <Dialog v-model="videoVisible" title="选择短剧" width="90%" :alignCenter="true" destroy-on-close>
     <videoList @confirm="confirm" :primary="formCallback.duanjus"></videoList>
   </Dialog>
 </template>

src/views/pageLayout/channelPageManage/form/videoList.vue

@@ -1,16 +1,23 @@
 <template>
   <div>
-    <div class="flex flex-wrap ml-6">
-      <el-form-item label="所选短剧：" class="font-bold" v-if="multipleSelection.length > 0">
-        <div v-for="(item, index) in multipleSelection" :key="item.id" class="mb-3 mr-3">
-          <el-input type="number" :disabled="false" min="1" v-model.number="sortValues[index]" placeholder="排序"
-            size="default" clearable style="width: 115px;"></el-input>
-          <el-input v-model="item.name" :disabled="true" placeholder="短剧名称" style="width:300px;"
-            class="input-with-select">
-          </el-input>
+    <el-card shadow="always" :body-style="{ padding: '20px' }" v-if="multipleSelection.length > 0">
+      <template #header>
+        <div class="text-base font-bold card-header">
+          <span>所选短剧：</span>
         </div>
-      </el-form-item>
-    </div>
+      </template>
+      <div class="flex flex-wrap items-start ml-6 choose-wrapper">
+        <el-form-item label="" class="font-bold">
+          <div v-for="(item, index) in multipleSelection" :key="item.id" class="mb-3 mr-3">
+            <el-input type="number" :disabled="false" min="1" v-model.number="sortValues[index]" placeholder="排序"
+              size="default" clearable style="width: 115px;"></el-input>
+            <el-input v-model="item.name" :disabled="true" placeholder="短剧名称" style="width:300px;"
+              class="input-with-select">
+            </el-input>
+          </div>
+        </el-form-item>
+      </div>
+    </el-card>
     <Search :search="search" :reset="resetQuery">
       <template v-slot:body>
         <el-form-item label="短剧" prop="name">
@@ -33,7 +40,7 @@
       </template>
     </Search>
     <div class="table-default">
-      <el-table :data="tableData" ref="multipleTableRef" class="mt-3" v-loading="loading" row-key="id"
+      <el-table :data="tableData" ref="multipleTableRef" height="380px" class="mt-3" v-loading="loading" row-key="id"
         @selection-change="handleSelectionChange">
         <el-table-column type="selection" reserve-selection />
         <el-table-column prop="id" label="剧号" />
@@ -239,6 +246,13 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
+.choose-wrapper {
+  height: fit-content;
+  max-height: 150px;
+  overflow: auto;
+}
+
+
 .table-default {
   .set-warpper {
     height: 60px;

src/views/pageLayout/homePageManage/form/config.vue

@@ -26,7 +26,7 @@
       }}</el-button>
     </div>
   </el-form>
-  <Dialog v-model="videoVisible" title="选择短剧" width="50%" destroy-on-close>
+  <Dialog v-model="videoVisible" title="选择短剧" width="90%" :alignCenter="true" destroy-on-close>
     <videoList @confirm="confirm" :primary="formCallback.duanjus"></videoList>
   </Dialog>
 </template>

src/views/pageLayout/homePageManage/form/videoList.vue

@@ -1,16 +1,23 @@
 <template>
   <div>
-    <div class="flex flex-wrap ml-6">
-      <el-form-item label="所选短剧：" class="font-bold" v-if="multipleSelection.length > 0">
-        <div v-for="(item, index) in multipleSelection" :key="item.id" class="mb-3 mr-3">
-          <el-input type="number" :disabled="false" min="1" v-model.number="sortValues[index]" placeholder="排序"
-            size="default" clearable style="width: 115px;"></el-input>
-          <el-input v-model="item.name" :disabled="true" placeholder="短剧名称" style="width:300px;"
-            class="input-with-select">
-          </el-input>
+    <el-card shadow="always" :body-style="{ padding: '20px' }" v-if="multipleSelection.length > 0">
+      <template #header>
+        <div class="text-base font-bold card-header">
+          <span>所选短剧：</span>
         </div>
-      </el-form-item>
-    </div>
+      </template>
+      <div class="flex flex-wrap items-start ml-6 choose-wrapper">
+        <el-form-item label="" class="font-bold">
+          <div v-for="(item, index) in multipleSelection" :key="item.id" class="mb-3 mr-3">
+            <el-input type="number" :disabled="false" min="1" v-model.number="sortValues[index]" placeholder="排序"
+              size="default" clearable style="width: 115px;"></el-input>
+            <el-input v-model="item.name" :disabled="true" placeholder="短剧名称" style="width:300px;"
+              class="input-with-select">
+            </el-input>
+          </div>
+        </el-form-item>
+      </div>
+    </el-card>
     <Search :search="search" :reset="resetQuery">
       <template v-slot:body>
         <el-form-item label="短剧" prop="name">
@@ -33,7 +40,7 @@
       </template>
     </Search>
     <div class="table-default">
-      <el-table :data="tableData" ref="multipleTableRef" class="mt-3" v-loading="loading" row-key="id"
+      <el-table :data="tableData" ref="multipleTableRef" height="380px" class="mt-3" v-loading="loading" row-key="id"
         @selection-change="handleSelectionChange">
         <el-table-column type="selection" reserve-selection />
         <el-table-column prop="id" label="剧号" />
@@ -239,6 +246,12 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
+.choose-wrapper {
+  height: fit-content;
+  max-height: 150px;
+  overflow: auto;
+}
+
 .table-default {
   .set-warpper {
     height: 60px;

src/views/pageLayout/viewpagerPageManage/form/create.vue

@@ -37,7 +37,7 @@
       }}</el-button>
     </div>
   </el-form>
-  <Dialog v-model="videoVisible" title="选择短剧" width="50%" destroy-on-close>
+  <Dialog v-model="videoVisible" title="选择短剧" width="90%" :alignCenter="true" destroy-on-close>
     <videoList @confirm="confirm" :primary="formCallback.duanjus"></videoList>
   </Dialog>
 </template>

src/views/pageLayout/viewpagerPageManage/form/videoList.vue

@@ -1,12 +1,19 @@
 <template>
   <div>
-    <div class="flex flex-wrap ml-6">
-      <el-form-item label="所选短剧：" class="font-bold" v-if="multipleSelection.name">
-        <el-input v-model="multipleSelection.name" :disabled="true" placeholder="短剧名称" style="width:300px;"
-          class="input-with-select">
-        </el-input>
-      </el-form-item>
-    </div>
+    <el-card shadow="always" :body-style="{ padding: '20px' }" v-if="multipleSelection.name">
+      <template #header>
+        <div class="text-base font-bold card-header">
+          <span>所选短剧：</span>
+        </div>
+      </template>
+      <div class="flex flex-wrap items-start ml-6 choose-wrapper">
+        <el-form-item label="" class="font-bold">
+          <el-input v-model="multipleSelection.name" :disabled="true" placeholder="短剧名称" style="width:300px;"
+            class="input-with-select">
+          </el-input>
+        </el-form-item>
+      </div>
+    </el-card>
     <Search :search="search" :reset="resetQuery">
       <template v-slot:body>
         <el-form-item label="短剧" prop="name">
@@ -29,8 +36,8 @@
       </template>
     </Search>
     <div class="table-default">
-      <el-table :data="tableData" ref="multipleTableRef" highlight-current-row class="mt-3" v-loading="loading"
-        row-key="id" @current-change="handleCurrentChange">
+      <el-table :data="tableData" ref="multipleTableRef" height="380px" highlight-current-row class="mt-3"
+        v-loading="loading" row-key="id" @current-change="handleCurrentChange">
         <el-table-column>
           <template #default="scope">
             <el-radio class="radio" v-model="selVal" :label="scope.row.id"><span></span></el-radio>
@@ -190,6 +197,12 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
+.choose-wrapper {
+  height: fit-content;
+  max-height: 150px;
+  overflow: auto;
+}
+
 .table-default {
   .set-warpper {
     height: 60px;