feat(审批): 审批列表接口对接2

components/base-data-approval.vue

@@ -44,7 +44,6 @@ export default {
         rows: 10,
         mesType: '1',
         processGroup: '1',
-        running: true,
         completeStatus: false
       },
       defaultPageSize: 10,

components/base-data-start.vue

+<template>
+  <scroll-view
+      class="scroll-view"
+      scroll-y="true"
+      @scrolltolower="scrolltolower"
+      :scroll-with-animation="true">
+    <view v-for="(item,key) in noticeList" :key="key" style="display: flex;background-color: #ffffff">
+      <!-- 原消息卡片模板 -->
+      <view class="noticeCard">
+        <view class="noticeTop">
+          <view class="titleClass">基础数据审批</view>
+          <view class="timeClass">
+            {{ parseTimeA(item.createDate,'{m}-{d} {h}:{i}:{s}') }}
+          </view>
+        </view>
+        <view class="subTitleClass">{{ item.message }}</view>
+      </view>
+    </view>
+    <!--底部加载-->
+    <view v-show="total > 0 && loadStatus !== 'loading'" style="text-align: center;padding-bottom: 5rpx;">
+      <u-loadmore
+          :status="loadStatus"
+          :loadmore-text="loadText.loadmore"
+          :loading-text="loadText.loading"
+          :nomore-text="loadText.nomore"
+      />
+    </view>
+    <view v-show="loadStatus === 'loading'" style="text-align: center">
+      <!-- <image src="../../static/images/home/loading.gif"  style="width: 50rpx;height: 60rpx;" /> -->
+    </view>
+  </scroll-view>
+</template>
+
+<script>
+import {queryInstanceListAeByPage} from '../api/system/approve'
+import { parseTime } from '../api/utils/ruoyi'
+
+export default {
+  props: ['queryParams'],
+  data() {
+    return {
+      queryNotice: {
+        page: 1,
+        rows: 10,
+        mesType: '1',
+        processGroup: '1',
+      },
+      defaultPageSize: 10,
+      // 底部加载
+      loadStatus: 'loadmore',
+      loadText: {
+        loadmore: '上滑加载更多',
+        loading: '努力加载中',
+        nomore: '没有更多了'
+      },
+      noticeList: [],
+      loading: true,
+      total: 0,
+    }
+  },
+  mounted() {
+    this.loadData()
+  },
+  computed: {
+    // 计算属性
+    parseTimeA() {
+      return (time) => {
+        return parseTime(time, '{m}-{d} {h}:{i}:{s}')
+      }
+    },
+  },
+  methods: {
+    async loadData() {
+      this.loading = true
+      const res = await queryInstanceListAeByPage({
+        ...this.queryNotice,
+      })
+      this.noticeList = [...res.data.records]
+      this.total = res.data.total
+      if (this.queryNotice.rows * this.queryNotice.page >= this.total) {
+        this.loadStatus = 'nomore'
+      }
+      this.loading = false
+    },
+    // 处理滚动加载
+    scrolltolower() {
+      this.loadStatus = 'loading'
+      if (this.queryNotice.rows * this.queryNotice.page >= this.total) {
+        this.loadStatus = 'nomore'
+      } else {
+        this.queryNotice.rows += this.defaultPageSize
+        this.loadData()
+        this.loadStatus = 'loadmore'
+      }
+    }
+  },
+}
+</script>
+<style scoped lang="scss">
+.scroll-view{
+  height: 960rpx;
+}
+.no-message{
+  text-align: center;
+  height: calc(100vh - 350rpx);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.topTips {
+  width: 100%;
+  height: 80rpx;
+  background-color: #ff9900;
+  font-size: 26rpx;
+  font-family: PingFang SC-Medium, PingFang SC;
+  font-weight: 500;
+  color: #FFF;
+  text-align: center;
+  padding-top: 20rpx;
+}
+.notice-container {
+  width: 100%;
+  margin-top: 542rpx;
+  background-color: #fff;
+  overflow-y: hidden;
+}
+.topContent {
+  display: flex;
+  padding-top: 32rpx;
+  padding-bottom: 32rpx;
+  padding-left: 32rpx;
+  background-color: #f0f0f0;
+  .topSelect {
+    width: 588rpx;
+    height: 88rpx;
+  }
+  .topButton {
+    margin-left: 32rpx;
+    margin-top: 22rpx;
+    font-size: 34rpx;
+    font-family: Source Han Sans CN-Regular, Source Han Sans CN;
+    font-weight: 400;
+    color: #343744;
+  }
+}
+.topContent_read {
+  display: flex;
+  padding: 34rpx 32rpx;
+  background-color: #f0f0f0;
+  font-size: 34rpx;
+  font-family: Source Han Sans CN-Bold, Source Han Sans CN;
+  font-weight: bold;
+  line-height: 40rpx;
+  .fontColor {
+    background-image: -webkit-linear-gradient(top, #02A7BA,#62AE79);
+    -webkit-background-clip:text;
+    -webkit-text-fill-color:transparent;
+  }
+}
+.noticeCard {
+  width: 100%;
+  background-color: #F9F9F9;
+  margin: 20rpx 22rpx 0 20rpx;
+  padding-bottom: 32rpx;
+  border-radius: 15rpx;
+  .noticeTop{
+    display: flex;
+    justify-content: space-between;
+    border-bottom: 2rpx solid  #F2F2F2;
+    padding: 22rpx 34rpx 24rpx 32rpx;
+  }
+  .titleClass {
+    font-family: PingFangSC, PingFang SC;
+    font-weight: 500;
+    font-size: 30rpx;
+    color: #333399;
+    text-align: left;
+    font-style: normal;
+    text-transform: none;
+  }
+  .subTitleClass {
+    font-family: PingFangSC, PingFang SC;
+    font-weight: 400;
+    font-size: 28rpx;
+    color: #9A9A9A;
+    text-align: left;
+    font-style: normal;
+    text-transform: none;
+    padding: 28rpx 32rpx 0 32rpx;
+  }
+  .timeClass {
+    font-family: PingFangSC, PingFang SC;
+    font-weight: 400;
+    font-size: 28rpx;
+    color: #666666;
+    text-align: right;
+    font-style: normal;
+    text-transform: none;
+  }
+}
+// 有导航栏后 防止滑到最上面
+.scroll-y {
+  height: calc(100vh - 88px)
+}
+::v-deep .u-line {
+  border-bottom-width: 3px !important;
+}
+::v-deep .u-subsection {
+  background-color: #fff
+}
+.checkView {
+  width: 76rpx;
+  align-content: center;
+  margin-bottom: 32rpx;
+  //border-radius: 10rpx;
+  //margin-top: 20rpx;
+  //position: absolute;
+}
+::v-deep .u-checkbox-group {
+  //background-color: red;
+  //padding-left: 16rpx;
+  height: 80rpx;
+  position: relative;
+  top: 50%; /*偏移*/
+  transform: translateY(-50%);
+}
+::v-deep .u-checkbox {
+  margin: auto;
+  width: 64rpx;
+  height: 64rpx;
+}
+::v-deep .u-checkbox__icon-wrap {
+  margin-left: 25rpx;
+  margin-right: 0 !important;
+}
+
+// 顶部选择样式
+::v-deep .u-subsection__bar {
+  background: linear-gradient(180deg, #02A7BA 0%, #62AE79 100%);
+}
+::v-deep .u-subsection__item {
+  border: none !important;
+  //border-color: none;
+}
+::v-deep .u-subsection {
+  height: 88rpx !important;
+  border-radius: 16rpx 16rpx 16rpx 16rpx;
+}
+::v-deep .u-subsection__item__text {
+  font-size: 34rpx !important;
+  font-family: Source Han Sans CN-Bold, Source Han Sans CN;
+  font-weight: 400;
+}
+
+// 卡片前单选
+::v-deep .u-checkbox {
+  margin-right: 0 !important;
+}
+
+
+
+::v-deep .u-loading-page__warpper__loading-icon__img{
+  width: 90rpx !important;
+  height: 90rpx !important;
+}
+::v-deep .u-tabs__wrapper__nav__item__text{
+  font-family: PingFangSC, PingFang SC;
+  font-weight: 500;
+  font-size: 28rpx;
+}
+.top-tabs{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-top: 20rpx;
+  border-bottom: 2rpx solid #F2F2F2;
+  ::v-deep .u-tabs{
+    width: 60%;
+  }
+}
+//::v-deep .u-subsection {
+//  background: black;
+//}
+</style>
\ No newline at end of file

pages/index.vue

@@ -18,7 +18,7 @@
 
       <!-- 动态加载子组件 -->
       <component
-          :is="queryNotice.mesType === '1' ? 'BaseDataApproval' : 'ProductionApproval'"
+          :is="mesTypeMap[queryNotice.mesType]"
           :key="queryNotice.mesType"
           :queryParams="queryNotice"
       />
@@ -29,6 +29,7 @@
 <script>
 // 新增子组件导入
 import BaseDataApproval from '../components/base-data-approval'
+import BaseDataStart from '../components/base-data-start'
 import ProductionApproval from '../components/production-approval'
 import MineNavbar from "../components/mine-navbar/mineNavbar";
 export default {
@@ -36,14 +37,25 @@ export default {
   components: {
     MineNavbar,
     BaseDataApproval,
+    BaseDataStart,
     ProductionApproval },
   data() {
     return {
+      mesTypeMap: {
+        '1': 'BaseDataApproval',
+        '2': 'BaseDataStart',
+        '3': 'ProductionApproval'
+      },
       list1: [{
-        name: '基础数据审批',
+        name: '基础数据审批·由我发起',
+        value: '1'
+      },{
+        name: '基础数据审批·由我审批',
+        value: '2'
       }, {
         name: '生产信息审批',
-      }, ],
+        value: '3'
+      } ],
       tipsShow: false,
       loading: true,
       checkShow: false,
@@ -93,13 +105,9 @@ export default {
   methods: {
     clickTabs(item) {
       console.log('点击了', item)
-      this.$set(this.queryNotice, 'mesType', item.name === '基础数据审批'? '1' : '2')
+      this.$set(this.queryNotice, 'mesType', item.value)
       // 清空原有数据
       this.noticeList = []
-    },
-    // 处理滚动加载
-    onReachBottom() {
-      console.log('哒哒哒哒哒哒多多多多多多多多多多多多多多')
     }
   },
 
@@ -282,7 +290,7 @@ export default {
   margin-top: 20rpx;
   border-bottom: 2rpx solid #F2F2F2;
   ::v-deep .u-tabs{
-    width: 60%;
+    width: 100%;
   }
 }
 //::v-deep .u-subsection {