民宗App待办模块页面调整以及接口测试

src/views/toBeDone/toBeDone.vue

@@ -15,22 +15,20 @@
     <van-tab title="待处理">
       <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
         <van-list
-          v-model:loading="loading1"
-          :finished="finished1"
+          v-model:loading="loading"
+          :finished="finished"
           finished-text="没有更多了"
           @load="onLoad1"
         >
           <van-swipe-cell v-for="item in toBeDoneList" :key="item.id">
             <div class="list-item" @click="goToBeDoneinfo(item)">
-              <van-col span="6" class="list-item-left">
-                <div>
-                  <p style="color: #a3a3a3">
-                    {{ item.createDate.split(" ")[0] }}
-                  </p>
-                  <p style="color: #a3a3a3">
-                    {{ item.createDate.split(" ")[1] }}
-                  </p>
-                </div>
+              <div class="list-item-left">
+                <p style="color: #a3a3a3">
+                  {{ item.createDate.split(" ")[0] }}
+                </p>
+                <p style="color: #a3a3a3">
+                  {{ item.createDate.split(" ")[1] }}
+                </p>
                 <p
                   v-if="item.assignState == 1"
                   style="color: red; margin-top: 10px"
@@ -49,22 +47,14 @@
                 >
                   已超期
                 </p>
-              </van-col>
-              <van-col
-                span="18"
-                style="border-left: 1px solid #e3e3e3"
-                class="list-item-right"
-              >
-                <van-row>
-                  <van-col span="24" style="height: 50px; overflow: hidden">
-                    <span v-html="item.problemContent"></span>
-                  </van-col>
-                </van-row>
-                <van-row justify="space-between">
-                  <van-col span="12">{{ item.areaSelectName }}</van-col>
-                  <van-col span="8">{{ item.assignTypeName }}</van-col>
-                </van-row>
-              </van-col>
+              </div>
+              <div class="list-item-right">
+                <p class="contentText" v-html="item.problemContent"></p>
+                <div class="right-down">
+                  <span>{{ item.areaSelectName }}</span>
+                  <span>{{ item.assignTypeName }}</span>
+                </div>
+              </div>
             </div>
           </van-swipe-cell>
         </van-list>
@@ -80,15 +70,13 @@
         >
           <van-swipe-cell v-for="item in toBeDoneList2" :key="item.id">
             <div class="list-item" @click="goToBeDoneinfo(item)">
-              <van-col span="6" class="list-item-left">
-                <div>
-                  <p style="color: #a3a3a3">
-                    {{ item.createDate.split(" ")[0] }}
-                  </p>
-                  <p style="color: #a3a3a3">
-                    {{ item.createDate.split(" ")[1] }}
-                  </p>
-                </div>
+              <div class="list-item-left">
+                <p style="color: #a3a3a3">
+                  {{ item.createDate.split(" ")[0] }}
+                </p>
+                <p style="color: #a3a3a3">
+                  {{ item.createDate.split(" ")[1] }}
+                </p>
                 <p
                   v-if="item.assignState == 3"
                   style="color: red; margin-top: 10px"
@@ -101,22 +89,14 @@
                 >
                   已归档
                 </p>
-              </van-col>
-              <van-col
-                span="18"
-                style="border-left: 1px solid #e3e3e3"
-                class="list-item-right"
-              >
-                <van-row>
-                  <van-col span="24" style="height: 50px; overflow: hidden">
-                    <span v-html="item.problemContent"></span>
-                  </van-col>
-                </van-row>
-                <van-row justify="space-between">
-                  <van-col span="12">{{ item.areaSelectName }}</van-col>
-                  <van-col span="8">{{ item.assignTypeName }}</van-col>
-                </van-row>
-              </van-col>
+              </div>
+              <div class="list-item-right">
+                <p class="contentText" v-html="item.problemContent"></p>
+                <div class="right-down">
+                  <span>{{ item.areaSelectName }}</span>
+                  <span>{{ item.assignTypeName }}</span>
+                </div>
+              </div>
             </div>
           </van-swipe-cell>
         </van-list>
@@ -135,14 +115,14 @@ export default {
     const toBeDoneList2 = ref([]);
     const loading = ref(false);
     const finished = ref(false);
-    let  index = 0;
+    let index = 0;
     //获取待办列表
     const onLoad1 = () => {
       // 异步更新数据
       new ToBeDone()
         .list({
           current: index + 1,
-          size: 11,
+          size: 10,
         })
         .then(({ records, pages }) => {
           toBeDoneList.value = toBeDoneList.value.concat(records);
@@ -152,7 +132,7 @@ export default {
           if (index + 1 >= pages) {
             finished.value = true;
           }
-          index++
+          index++;
         });
     };
     const loading2 = ref(false);
@@ -228,6 +208,7 @@ html {
   color: #c0c0c0;
   text-align: center;
 }
+
 .van-nav-bar {
   background-color: #36a7f3;
   .van-nav-bar__title {
@@ -237,40 +218,43 @@ html {
     color: #fff;
   }
 }
-.list1 {
-  margin-top: 10px;
-  .list-item {
-    background-color: #fff;
-    padding: 10px 0;
-    margin-bottom: 5px;
-    .list-item-left {
-      margin: auto;
-      text-align: center;
-      font-size: 12px;
-      border-right: 2px solid #f2f2f2;
-      p {
-        margin: 0;
-        padding: 0;
-      }
+.list-item {
+  background-color: #fff;
+  padding: 10px 0;
+  margin-bottom: 5px;
+  overflow: hidden;
+  .list-item-left {
+    box-sizing: border-box;
+    width: 25%;
+    float: left;
+    padding: 10px;
+    text-align: center;
+    font-size: 12px;
+    border-right: 2px solid #f2f2f2;
+  }
+  .list-item-right {
+    float: left;
+    width: 75%;
+    p {
+      width: 100%;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      font-size: 16px;
     }
-    .list-item-right {
-      .van-row {
-        &:nth-child(1) {
-          padding: 0 10px;
-          font-size: 16px;
-          font-weight: 700;
-          letter-spacing: 2px;
+    .right-down {
+      margin-top: 10px;
+      padding: 0 10px;
+      color: #c0c0c0;
+      font-size: 14px;
+      margin-top: 30px;
+      span{
+        display: block;
+        &:nth-child(1){
+          float: left;
         }
-        &:nth-child(2) {
-          margin-top: 10px;
-          padding: 0 10px;
-          color: #c0c0c0;
-          font-size: 14px;
-          .van-col {
-            &:nth-child(2) {
-              text-align: right;
-            }
-          }
+        &:nth-child(2){
+          float: right;
         }
       }
     }