好多样式

src/views/audit/bean/beanAudit.vue

@@ -1,10 +1,10 @@
 <template>
-  <el-card style="margin-bottom: 0.5vh;width:82.8vw">
+  <el-card style="margin-bottom: 0.5vh;width:82vw">
     <div style="margin-bottom: 1vh">
       <el-text size="large">精网号：</el-text>
       <el-input v-model="searchForm.jwcode" placeholder="请输入精网号" style="width: 12vw;margin-right:1vw" clearable />
 
-      <el-text class="mx-1" size="large">所属地区：</el-text>
+      <el-text size="large">所属地区：</el-text>
       <el-cascader v-model="selectedMarkets" :options="marketOptions" placeholder="请选择所属地区" clearable
         style="width: 12vw" @change="handleMarketChange" />
     </div>

src/views/audit/gold/audit.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <div style="height:2vw;">
+    <div style="height:4vh;width:82vw;">
     <el-button-group>
       <el-button :type="activeTab === 'rechargeAudit' ? 'primary' : 'default'" @click="navigateTo('rechargeAudit')"
         :disabled="!hasRecharge">

src/views/audit/gold/rechargeAudit.vue

@@ -47,7 +47,7 @@
         免费金币：{{ format3(stats.freeGolds.toFixed(2)) }}金币    
       </div>
     </el-tabs>
-    <el-table :data="tableData" style="width: 100vw;height:55vh" @sort-change="handleSortChange"
+    <el-table :data="tableData" style="width: 82vw;height:54vh" @sort-change="handleSortChange"
       :row-style="{ height: '50px' }">
       <el-table-column type="index" label="序号" width="100px" fixed="left">
         <template #default="scope">

src/views/audit/gold/refundAudit.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-card style="margin-bottom: 0.5vh;width:82.8vw">
+  <el-card style="margin-bottom: 0.5vh;width:82vw">
     <el-col style="margin-bottom: 0.5vh">
       <el-text size="large">精网号：</el-text>
       <el-input v-model="searchForm.jwcode" placeholder="请输入精网号" style="width: 12vw;margin-right:1vw" clearable/>
@@ -50,7 +50,7 @@
       任务金币：{{ format3(stats.taskGolds.toFixed(2)) }}金币
     </div>
 
-    <el-table :data="tableData" style="height:55vh" @sort-change="handleSortChange">
+    <el-table :data="tableData" style="height:54vh;width:82vw" @sort-change="handleSortChange">
       <el-table-column type="index" label="序号" width="60"/>
       <el-table-column prop="name" label="姓名" width="120" show-overflow-tooltip/>
       <el-table-column prop="jwcode" label="精网号" width="120"/>

src/views/consume/bean/beanConsume.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="father">
     <el-button-group>
       <el-button
           :type="activeTab === 'addBeanConsume' ? 'primary' : 'default'"
@@ -111,8 +111,11 @@ onMounted(() => {
 });
 </script>
 <style scoped>
+.father{
+  width:82vw;
+  height:4vh;
+}
 .content{
-  width: 90%;
-  height: 90%;
+  flex:1;
 }
 </style>

src/views/consume/bean/dieHardFan.vue

@@ -468,7 +468,7 @@ const getTagText = (state) => {
 </script>
 
 <template>
-  <el-card style="margin-bottom: 20px;margin-top:10px">
+  <el-card style="margin-bottom: 1vh;">
     <el-col style="margin-bottom: 10px">
       <el-text>精网号：</el-text>
       <el-input v-model="beanConsumeFan.jwcode" placeholder="请输入精网号" style="width: 200px;margin-right: 20px"
@@ -506,7 +506,7 @@ const getTagText = (state) => {
           免费金豆数：{{ format3(Math.abs(freeBean)) }}
         </div>
         <div style="overflow-y: auto">
-          <el-table :data="tableData" style="width: 100%" height="550px" @sort-change="handleSortChange">
+          <el-table :data="tableData" style="width: 82vw" height="55vh" @sort-change="handleSortChange">
             <el-table-column type="index" label="序号" width="80px" fixed="left">
               <template #default="scope">
                 <span>{{

src/views/consume/bean/liveStream.vue

@@ -502,37 +502,42 @@ const getTagText = (state) => {
 </script>
 
 <template>
-  <el-card style="margin-bottom: 20px;margin-top:10px">
-    <el-col style="margin-bottom: 10px">
+  <el-card style="margin-bottom: 1vh;width:80vw;">
+    <div style="margin-bottom: 1vh;display: flex;">
+      <div style="width: 18vw;margin-right: 1vw;display: flex;align-items: center;">
         <el-text>精网号：</el-text>
-      <el-input v-model="beanConsumeLive.jwcode" placeholder="请输入精网号" style="width: 200px;margin-right: 20px"
-        clearable />
-
+        <el-input v-model="beanConsumeLive.jwcode" style="width:10vw;" placeholder="请输入精网号" clearable />
+      </div>
+      <div style="margin-bottom: 1vh;width:18vw;display: flex;align-items: center;">
         <el-text>地区：</el-text>
-      <el-select v-model="beanConsumeLive.dept" placeholder="请选择地区" style="width: 200px;margin-right: 20px" clearable>
+        <el-select v-model="beanConsumeLive.dept" placeholder="请选择地区" style="width:10vw" clearable>
           <el-option v-for="(item, index) in dept" :key="index" :label="item" :value="item" />
         </el-select>
-
+      </div>
+      <div style="margin-bottom: 1vh;width:18vw;display: flex;align-items: center;">
         <el-text>礼物名称：</el-text>
-      <el-select v-model="beanConsumeLive.gift" placeholder="请选择礼物名称" style="width: 200px;margin-right: 20px" clearable
-        filterable allow-create default-first-option>
+        <el-select v-model="beanConsumeLive.gift" placeholder="请选择礼物名称" style="width:10vw"
+          clearable filterable allow-create default-first-option>
           <el-option v-for="(item, index) in gifts" :key="index" :label="item" :value="item" />
         </el-select>
-
+      </div>
+      <div style="margin-bottom: 1vh;width:18vw;display: flex;align-items: center;">
         <el-text>频道：</el-text>
-      <el-select v-model="beanConsumeLive.liveChannel" placeholder="请选择频道" style="width: 200px;margin-right: 20px"
+        <el-select v-model="beanConsumeLive.liveChannel" placeholder="请选择频道" style="width:10vw"
           clearable filterable allow-create default-first-option>
           <el-option v-for="(item, index) in channels" :key="index" :label="item" :value="item" />
         </el-select>
-
+      </div>
+      <div style="margin-bottom: 1vh;width:18vw;display: flex;align-items: center;">
         <el-text>直播间：</el-text>
-      <el-input v-model="beanConsumeLive.liveName" placeholder="请输入直播间" style="width: 200px;margin-right: 20px"
+        <el-input v-model="beanConsumeLive.liveName" placeholder="请输入直播间" style="width:10vw"
           clearable />
-    </el-col>
-    <el-col>
+      </div>
+    </div>
+    <div>
       <el-text>消费时间：</el-text>
       <el-date-picker v-model="getTime" type="datetimerange" range-separator="至" start-placeholder="起始时间"
-        end-placeholder="结束时间" style="width: 400px;margin-right: 20px;" @change="handleDatePickerChange"
+        end-placeholder="结束时间" style="width: 20vw;margin-right: 1vw;" @change="handleDatePickerChange"
         :default-time="defaultTime" />
 
       <el-button @click="getToday()" :type="activeTimeRange === 'today' ? 'primary' : ''"> 今</el-button>
@@ -543,7 +548,7 @@ const getTagText = (state) => {
       <el-button type="primary" @click="search()">查询</el-button>
       <el-button type="primary" @click="exportExcel()">导出excel</el-button>
       <el-button type="primary" @click="openExportList">查看导出列表</el-button>
-    </el-col>
+    </div>
   </el-card>
   <el-card>
     <div>
@@ -553,7 +558,7 @@ const getTagText = (state) => {
     </div>
     <!-- 设置表格容器的高度和滚动样式 -->
     <div style="overflow-y: auto">
-          <el-table :data="tableData" style="width: 100%" height="550px" @sort-change="handleSortChange">
+      <el-table :data="tableData" style="width: 82vw" height="55vh" @sort-change="handleSortChange">
         <el-table-column type="index" label="序号" width="80px" fixed="left">
           <template #default="scope">
             <span>{{

src/views/history/history.vue

@@ -22,7 +22,7 @@
     </el-card>
 
     <el-card style="margin-top:10px" v-show="tableData.length > 0">
-        <el-table :data="tableData" style="width: 100%" height="600">
+        <el-table :data="tableData" style="width: 82vw;height:60vh">
             <el-table-column type="index" label="序号" width="100" header-align="center" align="center">
                 <template #default="scope">
                     {{ scope.$index + 1 + (pagination.pageNum - 1) * pagination.pageSize }}

src/views/managerecharge/rate.vue

@@ -242,7 +242,7 @@ onMounted(async function () {
 </script>
 
 <template>
-  <el-card style="width:82.8vw;height:85vh">
+  <el-card style="width:82vw;height:85vh">
     <el-table :data="tableData" v-if="(tableData.flag = 1)">
       <el-table-column type="index" label="序号" width="100px" fixed="left">
         <template #default="scope">

src/views/permissions/permissions.vue

@@ -1,24 +1,17 @@
 <template>
-  <div>
-    <!-- 这里放置标签切换的按钮 -->
+  <div class="father">
     <el-button-group>
-      <!-- 切换后状态显示 primary 样式否则是默认样式 -->
-      <el-button
-          :type="activeTab === 'userPermission' ? 'primary' : 'default'"
-          @click="navigateTo('userPermission')"
-          :disabled="!hasDetail"
-      >
+      <el-button :type="activeTab === 'userPermission' ? 'primary' : 'default'" @click="navigateTo('userPermission')"
+        :disabled="!hasDetail">
         用户管理
       </el-button>
-      <el-button
-          :type="activeTab === 'rolePermission' ? 'primary' : 'default'"
-          @click="navigateTo('rolePermission')"
-          :disabled="!hasBalance"
-      >
+      <el-button :type="activeTab === 'rolePermission' ? 'primary' : 'default'" @click="navigateTo('rolePermission')"
+        :disabled="!hasBalance">
         角色管理
       </el-button>
     </el-button-group>
-    <!-- 渲染子路由组件 -->
+  </div>
+  <div>
     <router-view></router-view>
   </div>
 </template>
@@ -29,7 +22,6 @@ import {useRoute, useRouter} from 'vue-router';
 import { storeToRefs } from "pinia";
 import { useAdminStore } from "@/store/index.js";
 import { hasMenuPermission, permissionMapping } from "@/utils/menuTreePermission.js";
-
 const router = useRouter();
 const route = useRoute();
 const adminStore = useAdminStore();
@@ -87,3 +79,10 @@ onMounted(() => {
   }
 });
 </script>
+<style>
+.father{
+  width:82vw;
+  height:4vh;
+  background-color: antiquewhite;
+}
+</style>

src/views/permissions/rolePermission.vue

@@ -580,7 +580,7 @@ onMounted(async function () {
 </script>
 <template>
   <div>
-    <el-card style="margin-bottom: 20px;margin-top:10px">
+    <el-card style="margin-bottom: 1vh;">
       <div style="display: flex;">
         <el-text size="large">角色名称：</el-text>
         <el-input v-model="role.name" style="width: 240px" placeholder="请输入角色名称" clearable />

src/views/permissions/userPermission.vue

@@ -897,7 +897,7 @@ onMounted(async function () {
 
 <template>
   <div>
-    <el-card style="margin-bottom: 20px;margin-top:10px">
+    <el-card style="margin-bottom: 1vh;">
       <div class="head-card">
         <div class="head-card-element">
           <el-text class="mx-1" size="large">OA号：</el-text>
@@ -929,7 +929,7 @@ onMounted(async function () {
       </div>
 
       <div>
-        <el-table :data="tableData" style="width: 100%" show-overflow-tooltip>
+        <el-table :data="tableData" style="width: 82vw;height:60vh" show-overflow-tooltip>
           <el-table-column type="index" label="序号" width="100px" fixed="left">
             <template #default="scope">
               <span>{{
@@ -981,14 +981,12 @@ onMounted(async function () {
             </template>
           </el-table-column>
         </el-table>
-      </div>
-
-      <!-- 分页 -->
-      <div class="pagination" style="margin-top: 20px">
+        <div class="pagination" style="margin-top: 1vh;">
           <el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]"
             layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handlePageSizeChange"
             @current-change="handleCurrentChange"></el-pagination>
         </div>
+      </div>
     </el-card>
   </div>
 

src/views/recharge/bean/beanSystemRecharge.vue

@@ -337,7 +337,7 @@ onMounted(async function () {
                 <el-option v-for="item in market" :key="item" :label="item" :value="item" />
             </el-select>
         </div>
-        <div style="margin-top: 10px;">
+        <div style="margin-top: 1vh;">
             <el-text size="large">充值时间：</el-text>
             <el-date-picker v-model="getTime" type="datetimerange" range-separator="至" start-placeholder="起始时间"
                 end-placeholder="结束时间" style="width: 20vw" @change="handleDatePickerChange"
@@ -357,8 +357,6 @@ onMounted(async function () {
             <el-button type="primary" style="width: 80px;" @click="exportExcel()">导出Excel</el-button>
             <el-button type="primary" style="width: 95px;" @click="openExportList">查看导出列表</el-button>
         </div>
-
-
     </el-card>
     <el-card>
         <div>
@@ -367,7 +365,7 @@ onMounted(async function () {
             免费金豆数：{{ format3(freeBean) }}
         </div>
         <div>
-            <el-table :data="tableData" style="width: 82.8vw;height:60vh;" @sort-change="handleSortChange">
+            <el-table :data="tableData" style="width: 82vw;height:55vh;" @sort-change="handleSortChange">
                 <el-table-column type="index" label="序号" width="80px" fixed="left">
                     <template #default="scope">
                         <span>{{
@@ -428,4 +426,13 @@ onMounted(async function () {
         </template>
     </el-dialog>
 </template>
-<style scoped></style>
+<style scoped>
+.condition {
+    width: 82vw;
+    height: 6vw;
+    margin-bottom: 0.5vh;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+</style>

src/views/refund/gold/coinRefund.vue

@@ -1,24 +1,20 @@
 <template>
-  <div>
+  <div class="father">
     <!-- 这里放置标签切换的按钮 -->
     <el-button-group>
       <!-- 切换后状态显示 primary 样式否则是默认样式 -->
-      <el-button
-          :type="activeTab === 'addCoinRefund' ? 'primary' : 'default'"
-          @click="navigateTo('addCoinRefund')"
-          :disabled="!hasAdd"
-      >
+      <el-button :type="activeTab === 'addCoinRefund' ? 'primary' : 'default'" @click="navigateTo('addCoinRefund')"
+        :disabled="!hasAdd">
         新增退款
       </el-button>
-      <el-button
-          :type="activeTab === 'coinRefundDetail' ? 'primary' : 'default'"
-          @click="navigateTo('coinRefundDetail')"
-          :disabled="!hasDetail"
-      >
+      <el-button :type="activeTab === 'coinRefundDetail' ? 'primary' : 'default'"
+        @click="navigateTo('coinRefundDetail')" :disabled="!hasDetail">
         金币退款明细
       </el-button>
     </el-button-group>
     <!-- 渲染子路由组件 -->
+  </div>
+  <div>
     <router-view></router-view>
   </div>
 </template>
@@ -87,3 +83,9 @@ onMounted(() => {
   }
 });
 </script>
+<style lang="css">
+.father {
+  width: 82vw;
+  height: 4vh;
+}
+</style>

src/views/refund/gold/coinRefundDetail.vue

@@ -515,8 +515,8 @@ const getMarket = async function () {
 </script>
 
 <template>
-      <el-card style="margin-bottom: 20px;margin-top:10px">
-        <el-row style="margin-bottom: 10px">
+      <el-card style="margin-bottom: 1vh;">
+        <el-row style="margin-bottom: 1vh">
           <el-col :span="5">
             <div class="head-card-element">
               <el-text>精网号：</el-text>
@@ -585,8 +585,8 @@ const getMarket = async function () {
           任务金币：{{ format3(Math.abs(taskGolds).toFixed(2)) }}
         </div>
         <!-- 设置表格容器的高度和滚动样式 -->
-        <div style="height: 520px; overflow-y: auto;margin-top:10px">
-          <el-table :data="tableData" style="width: 100%" @sort-change="handleSortChange" height="520px">
+        <div style="height: 55vh; overflow-y: auto;">
+          <el-table :data="tableData" style="width: 82vw" @sort-change="handleSortChange" height="520px">
             <el-table-column type="index" label="序号" width="80px" fixed="left">
               <template #default="scope">
                 <span>{{

src/views/usergold/bean/userbean.vue

@@ -1,5 +1,5 @@
 <template>
-    <el-card style="margin-bottom: 20px;">
+    <el-card style="margin-bottom: 1vh;">
         <el-text size="large">精网号：</el-text>
         <el-input v-model="searchObj.jwcode" placeholder="请输入精网号" style="width: 240px" clearable />
         <el-text size="large" style="margin-left:20px">地区：</el-text>
@@ -10,7 +10,6 @@
         <div style="float: right;">
             <el-button type="success" @click="reset">重置</el-button>
             <el-button type="primary" @click="search">查询</el-button>
-
         </div>
     </el-card>
 
@@ -21,7 +20,7 @@
             免费金豆数：{{ format3(stats.freeBean) }}金豆&nbsp;&nbsp;&nbsp;&nbsp;
             消费金豆总数：{{ format3(stats.consumeSum) }}金豆&nbsp;&nbsp;&nbsp;&nbsp;
         </div>
-        <el-table :data="tableData" height="650px" @sort-change="handleSortChange" :row-style="{ height: '60px' }">
+        <el-table :data="tableData" height="65vh" @sort-change="handleSortChange" :row-style="{ height: '60px' }">
             <el-table-column type="index" label="序号" width="100px" fixed="left">
               <template #default="scope">
                 <span>{{

src/views/usergold/gold/clientCount.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="father">
     <!-- 这里放置标签切换的按钮 -->
     <el-button-group>
       <!-- 切换后状态显示 primary 样式否则是默认样式 -->
@@ -19,6 +19,8 @@
       </el-button>
     </el-button-group>
     <!-- 渲染子路由组件 -->
+     </div>
+     <div>
     <router-view></router-view>
   </div>
 </template>
@@ -87,3 +89,9 @@ onMounted(() => {
   }
 });
 </script>
+<style>
+.father{
+  width:82vw;
+  height:4vh;
+}
+</style>

src/views/usergold/gold/clientCountBalance.vue

@@ -386,9 +386,7 @@ const format3 = (num) => {
 </script>
 
 <template>
-  <el-row>
-    <el-col>
-      <el-card style="margin-bottom: 20px;margin-top: 10px">
+      <el-card style="margin-bottom: 1vh;">
         <div class="head-card">
           <div class="head-card-element">
             <el-text class="mx-1" size="large">精网号：</el-text>
@@ -415,10 +413,6 @@ const format3 = (num) => {
         </div>
         <!-- </div> -->
       </el-card>
-    </el-col>
-  </el-row>
-  <el-row>
-    <el-col>
       <el-card>
         <div>
           金币总数：{{ format3(goldtotal || 0) }}&nbsp;&nbsp;&nbsp;&nbsp;
@@ -427,8 +421,8 @@ const format3 = (num) => {
           任务金币：{{ format3(taskGold  || 0) }}
         </div>
         <!-- 设置表格容器的高度和滚动样式 -->
-        <div style="height: 626px; overflow-y: auto">
-          <el-table :data="tableData" @cellClick="cellClick" style="width: 100%" height="626px"
+        <div style="height: 60vh; overflow-y: auto">
+          <el-table :data="tableData" @cellClick="cellClick" style="width: 82vw;"height="60vh"
                     @sort-change="handleSortChange">
             <el-table-column type="index" label="序号" width="100px" fixed="left">
               <template #default="scope">
@@ -450,12 +444,12 @@ const format3 = (num) => {
                   }}</span>
               </template> -->
             </el-table-column>
-            <el-table-column prop="currentPermanentGold" label="永久金币" sortable="custom" width="160">
+            <el-table-column prop="currentPermanentGold" label="永久金币" sortable="custom" width="150">
               <template #default="scope">
                 <span>{{ (scope.row.currentPermanentGold || 0)  }}</span>
               </template>
             </el-table-column>
-            <el-table-column prop="currentFreeJune" label="6月份到期免费金币" sortable="custom" width="170">
+            <el-table-column prop="currentFreeJune" label="6月份到期免费金币" sortable="custom" width="150">
               <template #default="scope">
                 <span>{{ (scope.row.currentFreeJune || 0)  }}</span>
               </template>
@@ -527,8 +521,6 @@ const format3 = (num) => {
                          @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-card>
-    </el-col>
-  </el-row>
   <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
     <el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
       <el-table-column prop="fileName" label="文件名"/>

src/views/usergold/gold/clientCountDetail.vue

@@ -493,7 +493,7 @@ const format3 = (num) => {
 </script>
 <template>
   <div>
-    <el-card style="margin-bottom: 20px;margin-top: 10px;">
+    <el-card style="margin-bottom: 1vh;">
       <el-row style="margin-bottom: 10px">
         <el-col :span="5">
           <div class="head-card-element">
@@ -567,8 +567,8 @@ const format3 = (num) => {
         任务金币：{{ format3(totalTaskGold || 0) }}&nbsp;&nbsp;
         <a style="color:#b1b1b1; font-size: small;">当前合计仅显示筛选范围内的金币净变化（充值总额 - 消费总额 + 退款总额)</a>
       </div>
-      <div style="height: 584px; overflow-y: auto">
-        <el-table :data="tableData" style="width: 100%" @sort-change="handleSortChange" height="584px">
+      <div style="height: 55vh; overflow-y: auto">
+        <el-table :data="tableData" style="width: 82vw" @sort-change="handleSortChange" height="55vh">
           <el-table-column type="index" label="序号" width="100px" fixed="left">
             <template #default="scope">
                   <span>{{

src/views/workspace/index.vue

@@ -701,7 +701,7 @@ const updateChart = (chartData) => {
       grid: {
         left: '3%',
         right: '4%',
-        bottom: '15%',
+        bottom: '10%',
         containLabel: true
       },
       xAxis: {