jiangping
2024-06-07 73af3ed9fbcc616cdecc739fc4307163c19c5764
h5/pages/staff/task/index.vue
@@ -4,62 +4,128 @@
      <view class="box_head_search">
        <view class="box_head_search_ipt">
          <image src="@/static/n/ic_search@2x.png" mode="widthFix"></image>
          <input type="text" placeholder="搜索任务名称" />
          <input
            v-model="search.title"
            @blur="querylist"
            type="text"
            placeholder="搜索任务名称"
          />
        </view>
        <view class="box_head_search_sha" @click="show = true">
        <view class="box_head_search_sha" @click="showFilter = true">
          <image src="@/static/n/ic_shaixuan@2x.png" mode="widthFix"></image>
          <text>筛选</text>
        </view>
      </view>
      <view class="box_head_list">
        <view class="box_head_item active">待处理 12</view>
        <view class="box_head_item">已处理</view>
        <view class="box_head_item">我发起的</view>
        <view class="box_head_item">抄送我的</view>
        <view
          @click="statusClick(0)"
          :class="{ active: search.queryType === 0 }"
          class="box_head_item"
          >待处理 {{ headData.noticeWaitNum }}</view
        >
        <view
          @click="statusClick(1)"
          :class="{ active: search.queryType === 1 }"
          class="box_head_item"
          >已处理 {{ headData.noticeDealNum }}</view
        >
        <view
          @click="statusClick(2)"
          :class="{ active: search.queryType === 2 }"
          class="box_head_item"
          >我发起的 {{ headData.noticeCreateNum }}</view
        >
        <view
          @click="statusClick(3)"
          :class="{ active: search.queryType === 3 }"
          class="box_head_item"
          >抄送我的 {{ headData.noticeCopyNum }}</view
        >
      </view>
    </scroll-view>
    <view class="box_list">
      <view class="box_list_item" v-for="(item, index) in 3" :key="index">
      <view class="chaosong" v-if="search.queryType === 3">
        <view class="left">
          <image
            @click="readySearch(0)"
            v-if="search.noRead && search.noRead == 1"
            src="@/static/meeting/icon/ic_choose_sel@2x.png"
            class="checked"
          />
          <image
            @click="readySearch(1)"
            v-else
            src="@/static/meeting/icon/ic_choose@2x.png"
            class="checked"
          />
          <text>仅看未读</text>
        </view>
        <view class="right">全部标记已读</view>
      </view>
      <view
        class="box_list_item"
        v-for="(item, index) in dataList"
        :key="index"
      >
        <view class="box_list_item_head">
          <text>丁恩凯的劳务入厂申请</text>
          <text class="loading">待审核</text>
          <view class="df_ac">
            <text v-if="item.readed == 0" class="readed"></text>
            <text class="tt">{{ item.title }}</text>
          </view>
          <view class="info loading">{{ item.info }}</view>
        </view>
        <view class="box_list_item_nr">
          <view class="box_list_item_nr_item">
            <text>被访问人:</text>
            <text>人事部-王亚蓝</text>
          <view v-if="item.param1.name" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.name }}</text>
          </view>
          <view class="box_list_item_nr_item">
            <text>进厂时间:</text>
            <text>12-12 09:00</text>
          <view v-if="item.param1.area" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.area }}</text>
          </view>
          <view class="box_list_item_nr_item">
            <text>离厂时间:</text>
            <text>12-12 12:00</text>
          <view v-if="item.param1.cate" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.cate }}</text>
          </view>
          <view class="box_list_item_nr_item">
            <text>来访事由:</text>
            <text>业务来往</text>
          <view v-if="item.param1.sTime" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.sTime }}</text>
          </view>
          <view class="box_list_item_nr_item">
            <text>随行车辆:</text>
            <text>皖A88888</text>
          <view v-if="item.param1.eTime" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.eTime }}</text>
          </view>
          <view v-if="item.param1.usrNum" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.usrNum }}</text>
          </view>
          <view v-if="item.param1.reason" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.reason }}</text>
          </view>
          <view v-if="item.param1.carNos" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.carNos }}</text>
          </view>
          <view v-if="item.param1.mdd" class="box_list_item_nr_item">
            <text></text>
            <text>{{ item.param1.mdd }}</text>
          </view>
          <view class="box_list_item_nr_x"></view>
          <view class="box_list_item_nr_text">
            <text class="time">2023-12-12 09:00提交</text>
            <text class="btn" @click="handleAppr()">去处理</text>
            <text class="time">{{ item.createDate }}提交</text>
            <text class="btn" @click="handleAppr(item)">去处理</text>
          </view>
        </view>
      </view>
    </view>
    <!-- 筛选 -->
    <u-popup
      :show="show"
      :show="showFilter"
      mode="bottom"
      :round="10"
      :closeable="true"
      @close="show = false"
      @close="showFilter = false"
    >
      <view class="search">
        <view class="search_head">任务筛选</view>
@@ -70,15 +136,19 @@
              <view
                class="search_list_item_val_row"
                @click="tiemShow = true"
                :style="{ color: search.startTime ? '#000' : '' }"
                >{{ search.startTime ? search.startTime : "开始日期" }}</view
                :style="{ color: modelParam.startDate ? '#000' : '' }"
                >{{
                  modelParam.startDate ? modelParam.startDate : "开始日期"
                }}</view
              >
              <view class="search_list_item_val_z">-</view>
              <view
                class="search_list_item_val_row"
                @click="tiemShow1 = true"
                :style="{ color: search.endTime ? '#000' : '' }"
                >{{ search.endTime ? search.endTime : "结束日期" }}</view
                :style="{ color: modelParam.endDate ? '#000' : '' }"
                >{{
                  modelParam.endDate ? modelParam.endDate : "结束日期"
                }}</view
              >
            </view>
          </view>
@@ -87,11 +157,11 @@
            <view class="search_list_item_cates">
              <view
                :class="
                  index === i
                  item.id === modelParam.type
                    ? 'search_list_item_cates_row active'
                    : 'search_list_item_cates_row'
                "
                v-for="(item, index) in cate"
                v-for="(item, index) in cateList"
                :key="index"
                @click="clickItem(index)"
              >
@@ -101,22 +171,24 @@
          </view>
        </view>
        <view class="search_footer">
          <view class="search_footer_item" @click="show = false">取消</view>
          <view class="search_footer_item t">提交</view>
          <view class="search_footer_item" @click="showFilter = false"
            >取消</view
          >
          <view class="search_footer_item t" @click="modalSub">提交</view>
        </view>
      </view>
    </u-popup>
    <u-datetime-picker
      :show="tiemShow"
      v-model="time"
      mode="datetime"
      v-model="modelParam.startDate"
      mode="date"
      @confirm="confirmLeft"
      @cancel="tiemShow = false"
    ></u-datetime-picker>
    <u-datetime-picker
      :show="tiemShow1"
      v-model="time1"
      mode="datetime"
      v-model="modelParam.endDate"
      mode="date"
      @confirm="confirmRight"
      @cancel="tiemShow1 = false"
    ></u-datetime-picker>
@@ -124,57 +196,136 @@
</template>
<script>
import { taskCenter } from '@/api'
import { stagingHead, stagingTaskPage } from '@/api'
import dayjs from 'dayjs'
export default {
  data() {
    return {
      show: false,
      showFilter: false,
      search: {
        queryType: 0
      },
      modelParam: {
        startDate: dayjs().format('YYYY-MM-DD'),
        endDate: dayjs().format('YYYY-MM-DD'),
      },
      tiemShow: false,
      tiemShow1: false,
      time: '',
      i: null,
      time: '',
      time1: '',
      search: {
        startTime: '',
        endTime: ''
      pagination: {
        capacity: 20,
        page: 0
      },
      pagination: {},
      headData: {},
      dataList: [],
      cate: [
        { name: '访客申请', id: 1 },
        { name: '劳务申请', id: 2 },
        { name: '用车申请', id: 3 }
      cateList: [
        { name: '访客申请', id: 0 },
        { name: '访客报备', id: 1 },
        { name: '用车申请', id: 2 },
        { name: '隐患随手拍', id: 3 },
        { name: '物流车申请', id: 4 },
      ]
    }
  },
  onLoad() {
    this.getHeadList()
    this.pagination.page = 0
    this.getList()
  },
  onReachBottom() {
    // this.pagination.page = 0
    // this.dataList = []
    this.getList()
  },
  onShow() {
    this.pagination.page = 0
    this.dataList = []
    this.getHeadList()
    this.getList()
  },
  methods: {
    statusClick(val) {
      this.pagination.page = 0
      this.dataList = []
      this.$set(this.search, 'queryType', val)
      this.getList()
    },
    readySearch(val) {
      this.pagination.page = 0
      this.dataList = []
      this.$set(this.search, 'noRead', val)
      this.getList()
    },
    modalSub() {
      this.search = { ...this.search, ...this.modelParam }
      this.pagination.page = 0
      this.dataList = []
      this.getList()
      this.showFilter = false
    },
    querylist() {
      this.pagination.page = 0
      this.dataList = []
      this.getList()
    },
    getList() {
      const { pagination } = this
      taskCenter({
        model: {}
      const { pagination, search } = this
      pagination.page++
      stagingTaskPage({
        ...pagination,
        model: {
          ...search
        }
      }).then(res => {
        this.dataList = res.data.records
        this.dataList = [...this.dataList, ...res.data.records]
        this.dataList.forEach(i => {
          i.param1 = JSON.parse(i.param1)
        })
        console.log('dataList', this.dataList)
      })
    },
    getHeadList() {
      stagingHead({
        isDetail: '1'
      }).then(res => {
        this.headData = res.data
      })
    },
    handleAppr(item) {
      const { objType, objId } = item
      if (objType === 2) {
      uni.navigateTo({
        url: '/pages/staff/task/visitorApprove'
          url: `/pages/staff/vehicle/sendACarDetail?id=${objId}&appr=1`
      })
      } else if (objType === 1) {
        uni.navigateTo({
          url: `/pages/staff/task/visitorReport?id=${objId}&objType=${objType}`
        })
      } else if (objType === 3) {
        uni.navigateTo({
          url: `/pages/staff/task/vDangetAppr?id=${objId}&objType=${objType}`
        })
      } else {
        uni.navigateTo({
          url: `/pages/staff/task/visitorApprove?id=${objId}&objType=${objType}`
        })
      }
    },
    clickItem(index) {
      this.i = index
      this.$set(this.modelParam, 'type', this.cateList[index].id)
    },
    confirmLeft(e) {
      console.log(uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss'))
      this.search.startTime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
      console.log(uni.$u.timeFormat(e.value, 'yyyy-mm-dd'))
      setTimeout(() => {
        this.modelParam.startDate = uni.$u.timeFormat(e.value, 'yyyy-mm-dd')
      })
      this.tiemShow = false
    },
    confirmRight(e) {
      this.search.endTime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
      // this.modelParam.endDate = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
      setTimeout(() => {
        this.modelParam.endDate = uni.$u.timeFormat(e.value, 'yyyy-mm-dd')
      })
      this.tiemShow1 = false
    }
  }
@@ -275,6 +426,23 @@
    width: 100%;
    padding: 30rpx;
    box-sizing: border-box;
    .chaosong {
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #666666;
      font-size: 24rpx;
      margin-bottom: 20rpx;
      .left {
        display: flex;
        align-items: center;
        .checked {
          width: 32rpx;
          height: 32rpx;
          margin-right: 10rpx;
        }
      }
    }
    .box_list_item {
      width: 100%;
      margin-bottom: 20rpx;
@@ -291,6 +459,12 @@
        display: flex;
        align-items: center;
        justify-content: space-between;
        .readed {
          width: 12rpx;
          height: 12rpx;
          border-radius: 50%;
          background-color: #e0312a;
        }
        .loading {
          color: #4c99a8;
        }
@@ -300,16 +474,14 @@
        .error {
          color: #e0312a;
        }
        text {
          &:nth-child(1) {
        .tt {
            font-size: 32rpx;
            font-weight: 500;
            color: #222222;
          }
          &:nth-child(2) {
        .info {
            font-size: 26rpx;
            font-weight: 400;
          }
        }
      }
      .box_list_item_nr {
@@ -410,6 +582,7 @@
            font-size: 26rpx;
            font-weight: 400;
            color: #333333;
            margin-bottom: 20rpx;
            &:last-child {
              margin: 0;
            }