修改界面缺陷

src/components/dateTime/daterange.picker.vue

@@ -19,10 +19,10 @@ import dayjs from "dayjs";
 export default {
   inheritAttrs: false,
   data() {
-    let data= {
+    let data = {
       start_placeHolder: this.startPlaceholder,
       end_placeHolder: this.endPlaceholder,
-      values:null,
+      values: null,
     };
     return data;
   },
@@ -102,9 +102,7 @@ export default {
   watch: {
     value: {
       handler(v) {
-        if (v && v.length > 0) {
-          this.values = v;
-        }
+        this.values = v;
       },
       immediate: true,
     },
@@ -129,15 +127,15 @@ export default {
       this.$emit("input", v);
     },
     blur() {
-      this.start_placeHolder=this.startPlaceholder;
-      this.end_placeHolder=this.endPlaceholder;
+      this.start_placeHolder = this.startPlaceholder;
+      this.end_placeHolder = this.endPlaceholder;
     },
   },
   mounted() {},
-  mode:{
-    props: 'value',
-    event: 'input'
-  }
+  mode: {
+    props: "value",
+    event: "input",
+  },
 };
 </script>
 <style lang="scss" scoped>

src/utils/util.js

@@ -0,0 +1,54 @@
+export function arabicToChinese(num) {
+  const units = [
+    "",
+    "十",
+    "百",
+    "千",
+    "万",
+    "十万",
+    "百万",
+    "千万",
+    "亿",
+    "十亿",
+    "百亿",
+    "千亿",
+    "万亿",
+    "十万亿",
+    "百万亿",
+    "千万亿",
+  ];
+  const digits = ["", "一", "二", "三", "四", "五", "六", "七", "八", "九"];
+  const tenDigits = [
+    "十",
+    "二十",
+    "三十",
+    "四十",
+    "五十",
+    "六十",
+    "七十",
+    "八十",
+    "九十",
+  ];
+
+  if (num === 0) {
+    return "零";
+  }
+
+  let result = "";
+  let unitIndex = 0;
+
+  while (num > 0) {
+    const digit = num % 10;
+    const isTenDigit =
+      unitIndex > 0 && digit === 1 && result.length > 0 && result[0] !== "零";
+    const unit = isTenDigit ? tenDigits[unitIndex - 1] : units[unitIndex];
+    const digitChinese = digit === 1 && isTenDigit ? "" : digits[digit];
+
+    result = digitChinese + unit + result;
+
+    num = Math.floor(num / 10);
+    unitIndex++;
+  }
+
+  return result;
+}

src/views/resumption/ruleManager/index.vue

@@ -49,7 +49,7 @@
               </el-form-item>
             </el-form>
             <!--    按纽    -->
-            <el-row :gutter="10" >
+            <el-row :gutter="10">
               <el-col :span="1.5">
                 <el-button
                   type="primary"
@@ -93,7 +93,6 @@
               <right-toolbar
                 :showSearch.sync="showSearch"
                 @queryTable="getList"
-
               ></right-toolbar>
             </el-row>
           </div>
@@ -104,6 +103,8 @@
             :default-expand-all="expandAll"
             v-if="fresh"
             style="width: 100%"
+            :cell-style="tableCellStyle"
+            :header-cell-style="tableHeaderCellStyle"
             v-loading="loading"
             height="600"
           >
@@ -111,18 +112,22 @@
               <template slot-scope="props">
                 <el-table
                   :data="props.row.pointDtoList"
-                  border
                   style="width: 100%"
+                  size="small"
+                  :header-cell-style="pointTableHeaderCellStyle"
                 >
+                  <el-table-column type="index"></el-table-column>
                   <el-table-column
                     header-align="center"
                     prop="name"
                     label="履职内容"
                     v-if="columns[3].visible"
                   >
-                  <template slot-scope="scope">
-                    <div style="white-space:pre-wrap">{{scope.row.name}}</div>
-                  </template>
+                    <template slot-scope="scope">
+                      <div style="white-space: pre-wrap">
+                        {{ scope.row.name }}
+                      </div>
+                    </template>
                   </el-table-column>
                   <el-table-column
                     header-align="center"
@@ -154,9 +159,11 @@
             >
               <template slot-scope="scope">
                 {{
-                  (queryParams.pageNum - 1) * queryParams.pageSize +
-                  scope.$index +
-                  1
+                  arabicToChinese(
+                    (queryParams.pageNum - 1) * queryParams.pageSize +
+                      scope.$index +
+                      1
+                  )
                 }}
               </template>
             </el-table-column>
@@ -230,7 +237,7 @@ import { page, treeData, del } from "@/api/resumption/ruleManager.js";
 import { get as getRule } from "@/api/resumption/rule.js";
 import { getLabel } from "./../../commonOption";
 import DialogEdit from "./dialog.editItem.vue";
-
+import { arabicToChinese } from "@/utils/util.js";
 export default {
   name: "resumptionRuleManager",
   props: [],
@@ -318,6 +325,7 @@ export default {
   methods: {
     treeData,
     getLabel,
+    arabicToChinese,
     dakai() {
       this.expandAll = !this.expandAll;
       this.fresh = false;
@@ -428,6 +436,15 @@ export default {
       }
       this.getList();
     },
+    tableCellStyle() {
+      return "border-color:#aaa;";
+    },
+    tableHeaderCellStyle() {
+      return "border-color:#aaa;";
+    },
+    pointTableHeaderCellStyle(){
+      return "background-color:#d7d7d7 !important";
+    }
   },
 };
 </script>
@@ -436,4 +453,10 @@ export default {
   padding: 0;
   padding-left: 47px;
 }
+
+// .el-table-item,  .el-table-item td,el-table-item.th{
+
+//     border:1px solid red
+
+// }
 </style>

src/views/safetycheck/ruleManager/index.vue

@@ -50,7 +50,7 @@
               </el-form-item>
             </el-form>
             <!--    按纽    -->
-            <el-row :gutter="10" >
+            <el-row :gutter="10">
               <el-col :span="1.5">
                 <el-button
                   type="primary"
@@ -94,7 +94,6 @@
               <right-toolbar
                 :showSearch.sync="showSearch"
                 @queryTable="getList"
-
               ></right-toolbar>
             </el-row>
           </div>
@@ -107,6 +106,8 @@
             style="width: 100%"
             v-loading="loading"
             height="600"
+            :cell-style="tableCellStyle"
+            :header-cell-style="tableHeaderCellStyle"
           >
             <el-table-column header-align="center" type="expand">
               <template slot-scope="props">
@@ -114,7 +115,9 @@
                   :data="props.row.pointDtoList"
                   border
                   style="width: 100%"
+                  :header-cell-style="pointTableHeaderCellStyle"
                 >
+                  <el-table-column type="index" />
                   <el-table-column
                     header-align="center"
                     prop="name"
@@ -148,9 +151,11 @@
             >
               <template slot-scope="scope">
                 {{
-                  (queryParams.pageNum - 1) * queryParams.pageSize +
-                  scope.$index +
-                  1
+                  arabicToChinese(
+                    (queryParams.pageNum - 1) * queryParams.pageSize +
+                      scope.$index +
+                      1
+                  )
                 }}
               </template>
             </el-table-column>
@@ -222,6 +227,7 @@ import { get as getRule } from "@/api/safetycheck/rule.js";
 import DialogEdit from "./dialog.editItem.vue";
 import SelectPoint from "./dialog.select.point.vue";
 import OrgTree from "@/components/orgTree/orgQuerySelector.vue";
+import { arabicToChinese } from "@/utils/util.js";
 export default {
   name: "safetycheckRuleManager",
   props: [],
@@ -306,6 +312,7 @@ export default {
 
   methods: {
     treeData,
+    arabicToChinese,
     dakai() {
       this.expandAll = !this.expandAll;
       this.fresh = false;
@@ -414,6 +421,15 @@ export default {
       }
       this.getList();
     },
+    tableCellStyle() {
+      return "border-color:#aaa;";
+    },
+    tableHeaderCellStyle() {
+      return "border-color:#aaa;";
+    },
+    pointTableHeaderCellStyle(){
+      return "background-color:#d7d7d7 !important";
+    }
   },
 };
 </script>

src/views/safetycheck/task/components/checkRegister.vue

@@ -84,20 +84,20 @@
       >
     </div>
     <div class="content">
-      <div class="area_content" v-for="area in info.checkList">
+      <div class="area_content" v-for="area in info.checkList" :key="area.areaId">
         <div>
           {{ area.areaName }}
         </div>
         <div>
-          <div class="safetycheck_item" v-for="(item, index) in area.itemList">
-            <span>{{ index + 1 }}、{{ item.itemName }}</span>
-            <div class="safetycheck_point" v-for="point in item.pointList">
+          <div class="safetycheck_item" v-for="(item, index) in area.itemList" :key="item.itemId">
+            <span>{{arabicToChinese(index + 1)  }}、{{ item.itemName }}</span>
+            <div class="safetycheck_point" v-for="(point,pIndex) in item.pointList" :key="point.pointId">
               <div>
                 <div class="pointName">
-                  <i class="circle" />
-                  <pre>{{ point.pointName }}</pre>
+                  <!-- <i class="circle" /> -->
+                  <pre>{{(pIndex+1)+".   "+ point.pointName }}</pre>
                 </div>
-                <el-radio-group v-model="point.status" style="margin-top: 5px">
+                <el-radio-group v-model="point.status" style="margin-top: 5px;margin-left:20px;">
                   <el-radio :label="0">正常</el-radio>
                   <el-radio :label="1">异常</el-radio>
                 </el-radio-group>
@@ -185,6 +185,7 @@ import imgUpload from "@/components/ImageUpload/index.vue";
 import { getLabel } from "@/views/commonOption.js";
 import { getNamesByOrgId } from "@/api/system/role.js";
 import orgDropDown from "@/components/orgTree/orgDropDown.vue";
+import { arabicToChinese } from "@/utils/util.js";
 export default {
   name: "safetyCheckRegister",
   data() {
@@ -229,6 +230,7 @@ export default {
   methods: {
     dayjs,
     getLabel,
+    arabicToChinese,
     onCheckOrgSelect(node) {
       if (node == null) {
         this.prevCheckOrgType = null;
@@ -394,6 +396,9 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
+.app-container{
+  background-color: white;
+}
 .content {
   max-height: calc(100% - 300px);
   overflow-y: auto;
@@ -418,7 +423,7 @@ export default {
   background-color: #e6e6e6;
   border-right: #b8bdc0 1px solid;
   padding-top: auto;
-  width: 15%;
+  width: 250px;
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -426,7 +431,7 @@ export default {
 }
 
 .area_content > div:nth-child(2) {
-  width: 80%;
+  width: calc(100% - 250px);
   padding-left: 10px;
 }
 
@@ -435,9 +440,15 @@ export default {
   margin-bottom: 20px;
 }
 
+.safetycheck_item>div:not(:last-child){
+  padding-bottom: 10px;
+  border-bottom: #b8bdc0 1px solid;
+}
 .safetycheck_point {
   padding-top: 10px;
   padding-left: 30px;
+  
+  
 
   & > div {
     display: flex;
@@ -445,8 +456,9 @@ export default {
   }
 }
 
+
 .pointName {
-  width: 200px;
+  width: 300px;
   display: flex;
   flex-direction: row;
 }

src/views/safetycheck/task/components/detail.vue

@@ -47,73 +47,80 @@
 
     <div class="itemDetail">
       <div class="extend_mod">
-        
-    
-      <el-table
-        size="small"
-        :data="taskInfo.checkList"
-        row-key="itemId"
-        height="441"
-        style="max-height: 450px; overflow-y: auto"
-        default-expand-all
-        :show-header="false"
-      >
-        <el-table-column type="expand">
-          <template slot-scope="scope">
-            <el-table :data="scope.row.pointList" size="small">
-              <el-table-column
-                header-align="center"
-                prop="pointName"
-                label="检查内容"
-              >
-              </el-table-column>
-              <el-table-column align="center" prop="areaName" label="检查区域">
-              </el-table-column>
-              <el-table-column align="center" prop="status" label="检查结果">
-                <template slot-scope="r">
-                  {{
-                    r.row.status == null
-                      ? "-"
-                      : r.row.status == 0
-                      ? "正常"
-                      : "异常"
-                  }}
-                </template>
-              </el-table-column>
-              <el-table-column align="center" prop="remark" label="问题描述">
-                <template slot-scope="r">
-                  {{ r.row.remark ? r.row.remark : "-" }}
-                </template>
-              </el-table-column>
-              <el-table-column
-                header-align="center"
-                prop="imgData"
-                label="异常图片"
-              >
-                <template slot-scope="r">
-                  <div v-if="r.row.imgData && r.row.imgData.length > 0">
-                    <el-image
-                      style="width: 30px; height: 30px; margin: 0 10px"
-                      v-for="img in r.row.imgData"
-                      :src="img.imgPath"
-                      :preview-src-list="
-                        r.row.imgData ? r.row.imgData.map((r) => r.imgPath) : []
-                      "
-                    ></el-image>
-                  </div>
-                  <span v-else>-</span>
-                </template>
-              </el-table-column>
-            </el-table>
-          </template>
-        </el-table-column>
-        <el-table-column
-          label="检查项"
-          prop="itemName"
-          :show-overflow-tooltip="true"
-        />
-      </el-table>
-    </div>
+        <el-table
+          size="small"
+          :data="taskInfo.checkList"
+          row-key="itemId"
+          height="441"
+          border
+          style="max-height: 450px; overflow-y: auto"
+          default-expand-all
+          :show-header="false"
+        >
+          <el-table-column type="expand">
+            <template slot-scope="scope">
+              <el-table :data="scope.row.pointList" size="small">
+                <el-table-column type="index" />
+                <el-table-column
+                  header-align="center"
+                  prop="pointName"
+                  label="检查内容"
+                >
+                </el-table-column>
+                <el-table-column
+                  align="center"
+                  prop="areaName"
+                  label="检查区域"
+                >
+                </el-table-column>
+                <el-table-column align="center" prop="status" label="检查结果">
+                  <template slot-scope="r">
+                    {{
+                      r.row.status == null
+                        ? "-"
+                        : r.row.status == 0
+                        ? "正常"
+                        : "异常"
+                    }}
+                  </template>
+                </el-table-column>
+                <el-table-column align="center" prop="remark" label="问题描述">
+                  <template slot-scope="r">
+                    {{ r.row.remark ? r.row.remark : "-" }}
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  header-align="center"
+                  prop="imgData"
+                  label="异常图片"
+                >
+                  <template slot-scope="r">
+                    <div v-if="r.row.imgData && r.row.imgData.length > 0">
+                      <el-image
+                        style="width: 30px; height: 30px; margin: 0 10px"
+                        v-for="img in r.row.imgData"
+                        :key="img"
+                        :src="img.imgPath"
+                        :preview-src-list="
+                          r.row.imgData
+                            ? r.row.imgData.map((r) => r.imgPath)
+                            : []
+                        "
+                      ></el-image>
+                    </div>
+                    <span v-else>-</span>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </template>
+          </el-table-column>
+          <el-table-column
+            label="检查项"
+            prop="itemName"
+            :show-overflow-tooltip="true"
+          />
+        </el-table>
+      </div>
     </div>
     <div class="dialog-footer">
       <el-button @click="onClose">关闭</el-button>

src/views/safetycheck/task/components/register.vue

@@ -46,19 +46,18 @@
     </el-row>
 
     <div class="content">
-      <div class="area_content" v-for="area in taskInfo.checkList">
+      <div class="area_content" v-for="area in taskInfo.checkList" :key="area.areaId">
         <div>
           {{ area.areaName }}
         </div>
         <div>
-          <div class="safetycheck_item" v-for="(item, index) in area.itemList">
-            <span>{{ index + 1 }}、{{ item.itemName }}</span>
-            <div class="safetycheck_point" v-for="point in item.pointList">
+          <div class="safetycheck_item" v-for="(item, index) in area.itemList" :key="item.itemId">
+            <span>{{ arabicToChinese (index + 1 )}}、{{ item.itemName }}</span>
+            <div class="safetycheck_point" v-for="(point,pIndex) in item.pointList" :key="point.pointId">
               <div>
                 <div class="pointName">
                   <div style="display: flex; flex-direction: row">
-                    <i class="circle" />
-                    <pre>{{ point.pointName }}</pre>
+                    <pre>{{ (pIndex+1)+".   "+point.pointName }}</pre>
                   </div>
                 </div>
                 <el-radio-group v-model="point.status">
@@ -151,6 +150,7 @@ import UserSelector from "@/components/userSelector/index.vue";
 import { getLabel } from "@/views/commonOption.js";
 import { checkPermi } from "@/utils/permission.js";
 import { deptTreeWithSameTypeUp } from "@/api/system/org.js";
+import { arabicToChinese } from "@/utils/util.js";
 export default {
   name: "safetyCheckRegister",
   data() {
@@ -216,6 +216,7 @@ export default {
     dayjs,
     getLabel,
     deptTreeWithSameTypeUp,
+    arabicToChinese,
     onAddPoint() {
       this.pointIdsWhenAdd = [];
       this.taskInfo.checkList.forEach((a) => {
@@ -387,6 +388,9 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
+.app-container{
+  background-color: white;
+}
 .el-row-button {
   margin-top: 20px;
 }
@@ -421,7 +425,7 @@ export default {
   background-color: #f7f7f7;
   border-right: #b8bdc0 1px solid;
   padding-top: auto;
-  width: 15%;
+  width: 250px;
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -429,7 +433,7 @@ export default {
 }
 
 .area_content > div:nth-child(2) {
-  width: 80%;
+  width: calc(100% - 250px);
   padding-left: 10px;
 }
 
@@ -437,7 +441,10 @@ export default {
   margin: 10px;
   margin-bottom: 20px;
 }
-
+.safetycheck_item>div:not(:last-child){
+  padding-bottom: 10px;
+  border-bottom: #b8bdc0 1px solid;
+}
 .safetycheck_point {
   padding-top: 10px;
   padding-left: 30px;