fix：bug样式修改

2022-10-11 23:29:36 +08:00
parent 96b2fea5cf
commit 34922aa6db
10 changed files with 218 additions and 145 deletions
--- a/.env.dev
+++ b/.env.dev
@@ -2,7 +2,7 @@ NODE_ENV = 'development'
 VUE_APP_CURRENTMODE = 'dev'

 VUE_APP_BASEOSS = 'https://diaoyan-files.automark.cc'
-VUE_APP_BASEURL = 'http://planetg-java.test.automark.cc/'
+VUE_APP_BASEURL = 'https://ylst-api-uat.dctest.digitalyili.com/'

 VUE_APP_DELiVERY_BASEURL='https://javaxq.test.automark.cc/'
 VUE_APP_MESSAGE_CENTER ='http://gtech-gateway.dcin-test.digitalyili.com/apigtech/message-send-center/';
--- a/src/Layouts/BaseLayout.vue
+++ b/src/Layouts/BaseLayout.vue
@@ -48,7 +48,7 @@
                @click.stop="clickEntrance">
        <template #icon>
          <i class="iconfont icon-fenxiang"
-             style="font-size: 18px; margin-right: 6px"></i>
+             style="font-size: 15px; margin-right: 6px"></i>
        </template>
        分享
      </a-button>
@@ -555,9 +555,11 @@ onMounted(() => {
 .download_img {
  width: 16px;
  height: 14px;
+  margin-right: 6px;
 }
 .click {
  width: 18px;
+  font-size: 12px;
  line-height: 18px;
  border-radius: 9px;
  background-color: #70b936;
@@ -567,6 +569,7 @@ onMounted(() => {
 }
 .click2 {
  width: 18px;
+  font-size: 12px;
  line-height: 18px;
  border-radius: 9px;
  background-color: #f5f5f5;
--- a/src/components/LeftMenuBar.vue
+++ b/src/components/LeftMenuBar.vue
@@ -1,8 +1,6 @@
 <template>
  <div class="menu-bar">
-    <div class="menu-bar-item"
-         v-for="(item, i) in menus"
-         :key="i">
+    <div class="menu-bar-item" v-for="(item, i) in menus" :key="i">
      <div class="menu-bar-no-child">
        <!-- <img
          class="menu-bar-item-img"
@@ -11,18 +9,22 @@
          }"
          src="../assets/img/down_circle.png"
        /> -->
-        <div class="menu-bar-item-main"
-             :class="{ 'menu-bar-item-main-active': item.check||index==i }"
-             @click="parentCheck($event, item,i)">
+        <div
+          class="menu-bar-item-main"
+          :class="{ 'menu-bar-item-main-active': item.check || index == i }"
+          @click="parentCheck($event, item, i)"
+        >
          <div class="menu-bar-item-main-icon">
-            <i class="iconfont"
-               v-html="item.icon"></i>
+            <i class="iconfont" v-html="item.icon"></i>
          </div>
          <div class="menu-bar-item-main-text">
            <div>{{ item[property] }}</div>
-            <i v-if="item.children.length > 0"
-               class="iconfont"
-               :class="{ 'iconfont-active': item.unfold }">&#xe675;</i>
+            <i
+              v-if="item.children.length > 0"
+              class="iconfont"
+              :class="{ 'iconfont-active': item.unfold }"
+              >&#xe675;</i
+            >
          </div>
        </div>
        <!-- <img
@@ -34,20 +36,23 @@
        /> -->
      </div>
      <div class="menu-bar-has-child">
-        <div class="menu-bar-item-child"
-             v-for="(child, childIndex) in item.children"
-             :key="childIndex">
-          <div class="menu-bar-item-main"
-               :style="{
+        <div
+          class="menu-bar-item-child"
+          v-for="(child, childIndex) in item.children"
+          :key="childIndex"
+        >
+          <div
+            class="menu-bar-item-main"
+            :style="{
              background: child.check ? 'rgba(112, 185, 54, 0.1)' : '#ffffff',
              color: child.check ? '#70b936' : '#000000',
              height: '51px',
-              borderRadius: '0'
+              borderRadius: '0',
            }"
-               @click="childCheck(child,i)">
+            @click="childCheck(child, i)"
+          >
            <div class="menu-bar-item-main-icon">
-              <i class="iconfont"
-                 v-html="child.icon"></i>
+              <i class="iconfont" v-html="child.icon"></i>
            </div>
            <div class="menu-bar-item-main-text">{{ child[property] }}</div>
          </div>
@@ -72,16 +77,15 @@ export default {
      default: "name",
    },
  },
-  activated () {
+  activated() {
    const route = useRoute();
    const path = route.path;
    this.menus.forEach((x) => {
      x.check = x.path === path;
    });
  },
-  setup (props, context) {
-
-    const index = ref(null)
+  setup(props, context) {
+    const index = ref(null);
    const route = useRoute();
    let menus = props.list.map((first) => {
      const path = route.path;
@@ -97,7 +101,7 @@ export default {
    watch(
      () => route.path,
      () => {
-        console.log('menus', menus);
+        console.log("menus", menus);
        menus = menus.map((first) => {
          const path = route.path;
          first.check = path === first.path;
@@ -111,19 +115,22 @@ export default {
      }
    );
    // 点击一级菜单名称
-    const menuName = ref('')
-    function domHandle (menus, context) {
+    const menuName = ref("");
+    function domHandle(menus, context) {
      // 点击一级菜单
      const parentCheck = (e, item, i) => {
-        if(menuName.value !== item.name) {
+        if (menuName.value !== item.name) {
          menusStatusToFalsefather(menus);
        }
-        menuName.value = item.name
+        menuName.value = item.name;
        if (item.disable) return;
        if (item.children.length > 0) {
          item.unfold = !item.unfold;
          const $checkDom = e.currentTarget.parentElement.nextElementSibling;
-          $checkDom.style.height = item.unfold ? `${$checkDom.scrollHeight}px` : 0;
+          $checkDom.style.height = item.unfold
+            ? `${$checkDom.scrollHeight}px`
+            : 0;
+            $checkDom.style.borderRadius = item.unfold || 0
          return;
        }
        if (item.check) return;
@@ -139,10 +146,11 @@ export default {
        context.emit("menuCheck", child);
        child.check = true;
        index.value = i;
+        menusStatusToFalsefather(menus);
      };
      return {
        parentCheck,
-        childCheck
+        childCheck,
      };
    }
    return {
@@ -154,7 +162,7 @@ export default {
  },
 };

-function menusStatusToFalse (menus) {
+function menusStatusToFalse(menus) {
  menus.forEach((x) => {
    x.check = false;
    if (x.children) {
@@ -162,12 +170,12 @@ function menusStatusToFalse (menus) {
    }
  });
 }
-function menusStatusToFalsefather (menus) {
+function menusStatusToFalsefather(menus) {
  menus.forEach((x) => {
    x.unfold = false;
-    var menubar = document.getElementsByClassName('menu-bar-has-child')
+    var menubar = document.getElementsByClassName("menu-bar-has-child");
    for (var key = 0; key < menubar.length; key++) {
-      menubar[key].style.height = '0px'
+      menubar[key].style.height = "0px";
    }
  });
 }
@@ -201,13 +209,13 @@ function menusStatusToFalsefather (menus) {
      display: flex;
      align-items: center;
      justify-content: center;
-      border-radius: 15px 15px 0 0;
+      border-radius: 8px 8px 0px 0px;
      padding-right: 5px;
      transition: all 0.3s;
      &-active {
        color: $yili-default-color;
        background: #ffffff;
-        box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.1);
+        box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.1);
      }
      &-icon {
        opacity: 0.9;
@@ -246,11 +254,13 @@ function menusStatusToFalsefather (menus) {
    overflow: hidden;
    transition: all 0.3s;
    height: 0;
+    border-radius: 5px 5px 5px 5px;
+    box-shadow: 0px 2px 8px 0px rgb(0 0 0 / 10%);
  }
-  .menu-bar-item:last-child{
+  .menu-bar-item:last-child {
    border-radius: 0px 8px 0px 0px;
  }
-  .menu-bar-item:first-child{
+  .menu-bar-item:first-child {
    border-radius: 8px 0px 0px 0px;
  }
 }
--- a/src/views/DataAnalyse/kndiagram/questions/mxd.vue
+++ b/src/views/DataAnalyse/kndiagram/questions/mxd.vue
@@ -1,8 +1,12 @@
 <template>
  <div class="nanoBox">
    <div class="nanoTitleBox">
-      <div class="nanoTitleBoxL" :style="{ color: analysisNum === 0 ? '#BFBFBF' : '#1890ff' }">
-        正在分析 {{ messageInfo.processing_count }} 条数据, 待分析 {{ messageInfo.pending_count }} 条数据
+      <div
+        class="nanoTitleBoxL"
+        :style="{ color: analysisNum === 0 ? '#BFBFBF' : '#1890ff' }"
+      >
+        正在分析 {{ messageInfo.processing_count }} 条数据, 待分析
+        {{ messageInfo.pending_count }} 条数据
      </div>
      <div class="nanoTitleBoxR">
        <Space>
@@ -18,7 +22,7 @@
                v-for="(item, index) in questionList"
                :value="item.question_index"
                :key="index"
-                :disabled="item.answer_count==0"
+                :disabled="item.answer_count == 0"
                >{{ item.title }}</a-select-option
              >
            </a-select>
@@ -75,7 +79,9 @@
                  @blur="handleSave(record.id)"
                />
              </div>
-              <div class="count">{{ editableData[record.id].title.length }}/20</div>
+              <div class="count">
+                {{ editableData[record.id].title.length }}/20
+              </div>
            </div>
            <div
              v-else
@@ -98,15 +104,13 @@
            type="link"
            @click="showDrawer($event, record)"
            v-if="record.status"
-            :disabled="record.status === 1 || record.status === 2 || record.status === 4"
+            :disabled="
+              record.status === 1 || record.status === 2 || record.status === 4
+            "
            >查看详情</a-button
          >

-          <a-button
-            type="link"
-            @click="delClick(record)"
-            >删除</a-button
-          >
+          <a-button type="link" @click="delClick(record)">删除</a-button>
        </template>
        <template #status_str="{ text, record }">
          <div
@@ -123,15 +127,24 @@
      </a-table>
    </div>
    <div class="noData" v-else>
-      <img style="width: 260px" :src="require('@/assets/img/no_crosstabs.png')" alt="" />
-      <p style="font-weight: bold">你还未对某个MXD题进行联合分析</p>
-      <p>①请选择待分析的MXD以及分析方法 ②点击【分析】</p>
-      <p>即可获得分析数据和报告</p>
+      <div class="noData-main">
+        <img
+          style="width: 260px"
+          :src="require('@/assets/img/no_crosstabs.png')"
+          alt=""
+        />
+        <p style="font-weight: bold">你还未对某个MXD题进行联合分析</p>
+        <p>①请选择待分析的MXD以及分析方法 ②点击【分析】</p>
+        <p>即可获得分析数据和报告</p>
+      </div>
    </div>
- 
  </div>
- 
-  <a-modal v-model:visible="visibleDelete" title="删除分析" @ok="handleDeleteItem">
+
+  <a-modal
+    v-model:visible="visibleDelete"
+    title="删除分析"
+    @ok="handleDeleteItem"
+  >
    <div>
      进行此更改后，原{{
        delQuestionTitle
@@ -147,7 +160,7 @@
      <component
        :is="mxdLcDetail"
        :question_index="question_index"
-        :question_data='question_data'
+        :question_data="question_data"
        :id="question_id"
        :sn="sn"
        v-if="question_type === 2"
@@ -155,7 +168,7 @@
      <component
        :is="maxDetail"
        :question_index="question_index"
-        :question_data='question_data'
+        :question_data="question_data"
        :id="question_id"
        :sn="sn"
        v-if="analysis_type === 3"
@@ -187,7 +200,7 @@ const route = useRoute();
 const router = useRouter();
 const store = useStore();
 const sn = route.query.sn;
-const loading =ref(true);
+const loading = ref(true);
 // 分析方式
 const analysis_type = ref(2);

@@ -208,15 +221,17 @@ const analysis_search_params = ref({
 });

 // 获取分析列表table
-const { data: analysisResults, run: runTableList} = useRequest(getAnalysisResults, {
-  pollingInterval: 10000,
-  loadingDelay: 1000,
-  defaultParams: [sn, { ...analysis_search_params.value }],
-   onSuccess:()=>{
-    loading.value =false;
+const { data: analysisResults, run: runTableList } = useRequest(
+  getAnalysisResults,
+  {
+    pollingInterval: 10000,
+    loadingDelay: 1000,
+    defaultParams: [sn, { ...analysis_search_params.value }],
+    onSuccess: () => {
+      loading.value = false;
+    },
  }
-   
-});
+);
 const analysisNum = computed(() => analysisResults.value?.count ?? 0);
 const tableSource = computed(() => analysisResults.value?.data ?? []);
 const messageInfo = computed(() => analysisResults.value?.other ?? {});
@@ -245,7 +260,12 @@ const columns = [
    defaultSortOrder: "descend",
    align: "center",
  },
-  { title: "操作", key: "action", slots: { customRender: "action" }, align: "center" },
+  {
+    title: "操作",
+    key: "action",
+    slots: { customRender: "action" },
+    align: "center",
+  },
 ];

 const editableData = ref({});
@@ -267,17 +287,25 @@ function handleLeave(record) {
 function handleEdit(status, key) {
  if (status === 3) {
    //已完成
-    editableData.value[key] = cloneDeep(tableSource.value.filter((item) => item.id === key)[0]);
+    editableData.value[key] = cloneDeep(
+      tableSource.value.filter((item) => item.id === key)[0]
+    );
  }
 }
 function handleSave(key) {
  const title = editableData.value[key].title;
-  const oldTitle = analysisResults.value.data.filter((item) => item.id === key)[0].title;
+  const oldTitle = analysisResults.value.data.filter(
+    (item) => item.id === key
+  )[0].title;
  if (title === oldTitle) {
    delete editableData.value[key];
    return;
  }
-  updateTitle(sn, editableData.value[key].id, editableData.value[key].title).then(() => {
+  updateTitle(
+    sn,
+    editableData.value[key].id,
+    editableData.value[key].title
+  ).then(() => {
    runTableList(sn, { ...analysis_search_params.value });
    delete editableData.value[key];
  });
@@ -313,7 +341,9 @@ const handleAnalyse = async () => {
    3: "hb",
  };
  const title = `${
-    questionList.value.find((item) => item.question_index === questionIndex.value).title
+    questionList.value.find(
+      (item) => item.question_index === questionIndex.value
+    ).title
  }_${type[analysis_type.value]}分析`;
  const data = {
    title,
@@ -333,8 +363,10 @@ const pageChange = (page, filters, sorter, { currentDataSource }) => {
  analysis_search_params.value.per_page = page.pageSize;
  analysis_search_params.value.page = page.current;
  if (sorter.order) {
-    if (sorter.order === "ascend") analysis_search_params.value.sort = `${sorter.field},asc`;
-    if (sorter.order === "descend") analysis_search_params.value.sort = `${sorter.field},desc`;
+    if (sorter.order === "ascend")
+      analysis_search_params.value.sort = `${sorter.field},asc`;
+    if (sorter.order === "descend")
+      analysis_search_params.value.sort = `${sorter.field},desc`;
  } else {
    analysis_search_params.value.sort = "finished_at,asc";
  }
@@ -366,10 +398,10 @@ const handleDeleteItem = async () => {
 const visible = ref(false);
 let question_index = ref(-1);
 const question_type = ref("");
-const question_data = ref({})
+const question_data = ref({});
 const showDrawer = (e, data) => {
  visible.value = true;
-  question_data.value = data
+  question_data.value = data;
  question_type.value = data.type;
  question_id.value = data.id;
  question_index.value = data.question_index;
@@ -397,35 +429,37 @@ onMounted(() => {
 .tableBox {
 }
 .noData {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
+  height: 80%;
  display: flex;
-  flex-direction: column;
  align-items: center;
-  > p {
-    margin: 0;
-    color: $yili-default-color;
-    width: 360px;
-    text-align: center;
-    > i {
-      display: inline;
-      font-style: normal;
-      border-radius: 50%;
-      border: 1px solid $yili-default-color;
-      width: 15px;
-      height: 15px;
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      margin-right: 6px;
-      margin-left: 6px;
+  justify-content: center;
+  &-main {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    > p {
+      margin: 0;
+      color: $yili-default-color;
+      width: 360px;
+      text-align: center;
+      > i {
+        display: inline;
+        font-style: normal;
+        border-radius: 50%;
+        border: 1px solid $yili-default-color;
+        width: 15px;
+        height: 15px;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        margin-right: 6px;
+        margin-left: 6px;
+      }
+    }
+    > p.top {
+      font-weight: bold;
+      margin-bottom: 10px;
    }
-  }
-  > p.top {
-    font-weight: bold;
-    margin-bottom: 10px;
  }
 }
 .nanoTitleBox {
--- a/src/views/planetDesign/Design/components/Card.vue
+++ b/src/views/planetDesign/Design/components/Card.vue
@@ -66,7 +66,7 @@ export default {
    background-repeat: no-repeat;
    background-size: 224px 118px;
    background-position: calc(100% - 10px) 24px;
-    margin-top: 15px;
+    margin-top: 26px;
  }
  &-title {
    display: flex;
--- a/src/views/planetDesign/Design/components/config/ConfigTitle.vue
+++ b/src/views/planetDesign/Design/components/config/ConfigTitle.vue
@@ -28,6 +28,7 @@ export default defineComponent({
  align-items: center;
  padding-top: 24px;
  padding-bottom: 24px;
+  padding-left: 10px;
  background: transparent;
 }

--- a/src/views/planetDesign/Design/fragement/EndLangModal.vue
+++ b/src/views/planetDesign/Design/fragement/EndLangModal.vue
@@ -9,7 +9,7 @@
      <span style="margin-left: 6px">提前终止</span>
    </div>
    <div class="end-btn" v-else-if="quotaEnd" @click="show">
-      <i class="iconfont">&#xe752;</i>
+      <i class="iconfont" style="font-size:17px">&#xe752;</i>
      <span style="margin-left: 6px">配额超限</span>
    </div>
    <a-modal
--- a/src/views/planetDesign/Index.vue
+++ b/src/views/planetDesign/Index.vue
@@ -124,7 +124,6 @@ export default {
  padding: 24px;
  &-left {
    // width: 80px;
-    border-right: 1px solid #f5f5f5;
    transition: width .3s ease-in-out;
    min-width: 27px;
    &-active {
--- a/src/views/schedule/index.vue
+++ b/src/views/schedule/index.vue
@@ -54,8 +54,6 @@ export default defineComponent({
  }
  .right {
    flex: 1;
-    padding: 24px;
-    overflow-x: hidden;
    background-color: #ffffff;
    height: calc(100vh - 100px);
  }
--- a/src/views/schedule/recycle.vue
+++ b/src/views/schedule/recycle.vue
@@ -4,7 +4,7 @@
      <div class="section">
        <div class="section-title">回收进度</div>
        <div class="card-wrap">
-          <div class="card" :style="from.num3>0?'width:34%':'width:46%'">
+          <div class="card" :style="from.num3 > 0 ? 'width:34%' : 'width:48%'">
            <div class="imgstyle" style="padding: 10px">
              <img
                style="width: 30px; height: 30px"
@@ -13,11 +13,13 @@
              />
            </div>
            <div class="title">
-              <div >今日回收量</div>
-              <div style="margin-top:15px;font-weight:800;font-size:18px">{{from.num1}}</div>
+              <div style="color: #434343;">今日回收量</div>
+              <div style="margin-top: 15px; font-weight: 800; font-size: 18px">
+                {{ from.num1 }}
+              </div>
            </div>
          </div>
-          <div class="card" :style="from.num3>0?'width:34%':'width:46%'">
+          <div class="card" :style="from.num3 > 0 ? 'width:34%' : 'width:48%'">
            <div class="imgstyle" style="background-color: rgb(78, 125, 255)">
              <img
                style="width: 30px; height: 30px"
@@ -26,17 +28,25 @@
              />
            </div>
            <div class="title">
-              <div >完成回收总量</div>
-              <div style="margin-top:15px;font-weight:800;font-size:18px">{{from.num2}}</div>
+              <div style="color: #434343;">完成回收总量</div>
+              <div style="margin-top: 15px; font-weight: 800; font-size: 18px">
+                {{ from.num2 }}
+              </div>
            </div>
          </div>
-          <div class="card" v-if="from.num3>0">
+          <div class="card" v-if="from.num3 > 0">
            <div class="imgstyle" style="background-color: #2cd076">
-              <img style="width: 30px; height: 30px" src="@/assets/img/listicon.png" alt="" />
+              <img
+                style="width: 30px; height: 30px"
+                src="@/assets/img/listicon.png"
+                alt=""
+              />
            </div>
            <div class="title">
-              <div >发布数量</div>
-              <div style="margin-top:15px;font-weight:800;font-size:18px">{{from.num3}}</div>
+              <div>发布数量</div>
+              <div style="margin-top: 15px; font-weight: 800; font-size: 18px">
+                {{ from.num3 }}
+              </div>
            </div>
          </div>
        </div>
@@ -46,26 +56,40 @@
      <div class="section">
        <div class="section-title">配额进度</div>
        <div class="section-table">
-          <a-table :columns="columns" :dataSource="listdata" :pagination="false">
+          <a-table
+            :columns="columns"
+            :dataSource="listdata"
+            :pagination="false"
+          >
            <template #logic_text="{ record }">
              <a-tooltip placement="right" :title="record.logic_text || ''">
                <div>{{ record.logic_text }}</div>
              </a-tooltip>
            </template>
          </a-table>
-          <a-pagination class="pagination" v-if="listdata.length!=0"
-                        :showTotal="total => `共 ${total} 条`"
-                        show-quick-jumper
-                        show-size-changer
-                        v-model:current="pagination.current"
-                        v-model:pageSize="pagination.pageSize"
-                        :pageSizeOptions="pagination.pageSizeOptions"
-                        v-model:defaultPageSize="pagination.pageSize"
-                        :total="pagination.total"
-                        @change="onPaginationChange"
-                        @showSizeChange="onShowSizeChange" />
+          <a-pagination
+            class="pagination"
+            v-if="listdata.length != 0"
+            :showTotal="(total) => `共 ${total} 条`"
+            show-quick-jumper
+            show-size-changer
+            v-model:current="pagination.current"
+            v-model:pageSize="pagination.pageSize"
+            :pageSizeOptions="pagination.pageSizeOptions"
+            v-model:defaultPageSize="pagination.pageSize"
+            :total="pagination.total"
+            @change="onPaginationChange"
+            @showSizeChange="onShowSizeChange"
+          />
+        </div>
+        <div v-if="listdata.length == 0" style="text-align: center">
+          <img
+            style="width: 160px;height:160px"
+            src="@/assets/img/publish/no-data.png"
+            alt=""
+          />
+          <div style="color: #70b936; margin-top: 10px">您的项目暂无数据</div>
        </div>
-        <div v-if="listdata.length==0" style="text-align:center"><img style="width:15%" src="@/assets/img/publish/no-data.png" alt=""><div style="color:#70b936;margin-top:10px">您的项目暂无数据</div></div>
      </div>
    </div>
  </div>
@@ -96,11 +120,13 @@ export default defineComponent({
        title: "配额序号",
        dataIndex: "id_name",
        key: "id_name",
+        align: 'center'
      },
      {
        title: "配额题目",
        dataIndex: "question_title",
        key: "question_title",
+        align: 'center'
      },
      {
        title: "配额逻辑",
@@ -108,26 +134,31 @@ export default defineComponent({
        key: "logic_text",
        slots: { customRender: "logic_text" },
        className: "logic_text",
+        align: 'center'
      },
      {
        title: "配额类型",
        dataIndex: "skip_question_index_text",
        key: "skip_question_index_text",
+        align: 'center'
      },
      {
        title: "配额数量",
        dataIndex: "sample_number",
        key: "sample_number",
+        align: 'center'
      },
      {
        title: "回收数量",
        dataIndex: "survey_answer_info_count",
        key: "survey_answer_info_count",
+        align: 'center'
      },
      {
        title: "配额进度",
        dataIndex: "percent",
        key: "percent",
+        align: 'center'
      },
    ];
    const listdata = ref([]);
@@ -196,9 +227,8 @@ export default defineComponent({
 .analyse-setting1 {
  overflow: hidden;
  min-height: 200px;
-  background: #f5f5f5;
  margin-bottom: 20px;
-  box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.1);
+  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
 }
 .section {
  border-radius: 6px;
@@ -210,9 +240,8 @@ export default defineComponent({
      display: flex;
      padding: 14px 20px;
      width: 31%;
-      background-color: #f4f6f9;
+      background: #fafafa;
      min-height: 100px;
-      margin: 10px;
      .imgstyle {
        width: 50px;
        height: 50px;
@@ -233,7 +262,7 @@ export default defineComponent({
    position: relative;
    height: 24px;
    line-height: 24px;
-    margin-bottom: 10px;
+    margin-bottom: 24px;
    font-size: 18px;

    color: rgba(0, 0, 0, 0.85);
@@ -254,16 +283,15 @@ export default defineComponent({
 }
 .analyse-setting2 {
  margin-top: 20px;
-  overflow: auto;
-  height: 650px;
-  background: #f5f5f5;box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.1);
+  background: #f5f5f5;
+  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
 }

 .section {
  height: auto;
  min-height: 100%;
  margin-bottom: 24px;
-  padding: 24px 44px 60px;
+  padding: 24px 32px 28px;
  border-radius: 6px;
  background: #ffffff;

@@ -302,12 +330,12 @@ export default defineComponent({
  margin-top: 25px;
  width: 100%;
 }
-:deep(.ant-table-placeholder){
+:deep(.ant-table-placeholder) {
  height: 100px;

-border-bottom: none;
+  border-bottom: none;
 }
-:deep(.ant-empty){
-display: none;
+:deep(.ant-empty) {
+  display: none;
 }
 </style>