jiliangxiaochengxu/pages/assay/index.vue

<!-- @format -->

<template>
  <view class="container">
    <view @click="handleApplicat" class="createFixed">
      <u-icon name="plus" color="#fff" size="23"></u-icon>
    </view>

    <view style="margin: 15rpx 0" v-if="activeContent == '我的申请'">
      <view style="background: #fff; padding: 10rpx 0; margin-bottom: 15rpx">
        <u-search
          @custom="sousuo"
          shape="square"
          placeholder="请输入备案单编号"
          style="width: 95%; margin: 0rpx auto"
        ></u-search>
      </view>
      <view
        class="contentItems"
        @click="handleDetails(item)"
        v-for="item in ledgerList"
        :key="item.id"
      >
        <view class="content">
          <!-- <view class="title">器具名称</view> -->
          <view
            style="color: black; font-size: 36rpx; font-weight: 700"
            class="message"
            >{{ item.instrName }}
          </view>
        </view>
        <view class="content">
          <view class="title"
            >备案单编号：
            <text
              class="message"
              style="
                margin-left: 10rpx;
                color: red;
                font-weight: 700;
                font-size: 30rpx;
              "
            >
              {{ item.filingNo }}
            </text>
          </view>
        </view>

        <!-- <view class="content">
					<view class="title">备案状态</view>
					<view :style="{
			    color: recordColor[recordStatus(item)],
			  }">{{ recordStatus(item) }}</view>
				</view> -->
        <!-- 		<view class="content">
					<view class="title">行政部门</view>
					<view style="font-weight: 700;color: black;" class="message">{{item.useOrgName}}</view>
				</view> -->
        <view style="display: flex; justify-content: space-between" class="">
          <view class="content">
            <view class="title">发起人： </view>
            <view style="width: 120rpx" class="message">{{
              item.userName
            }}</view>
          </view>
          <view class="content">
            <view class="title">发起时间：</view>
            <view style="padding-top: 5rpx" class="message">{{
              item.createTime
            }}</view>
          </view>
        </view>
        <view style="display: flex; justify-content: space-between" class="">
          <view style="display: flex" class="content">
            <view class="title">联系电话：</view>
            <view style="padding-top: 5rpx" class="message">{{
              item.userMobile
            }}</view>
          </view>
          <view style="display: flex; align-items: center" class="content">
            <view class="title">器具数量：</view>
            <view style="padding-top: 5rpx" class="message">{{
              item.instrCount
            }}</view>
          </view>
        </view>
      </view>
    </view>

    <!-- 	<view v-else>
			<view>
				<view class="createNew">选择器具进行申请</view>
				<view class="contentItems" @click="handleCurrentForm">
					<view class="content">
						<view class="title">出厂编号</view>
						<view class="message">123478654</view>
					</view>
					<view class="content">
						<view class="title">器具名称</view>
						<view class="message">血压计和血压表</view>
					</view>
					<view class="content">
						<view class="title">规格型号</view>
						<view class="message">153430587834</view>
					</view>
				</view>
				<view class="contentItems">
					<view class="content">
						<view class="title">出厂编号</view>
						<view class="message">123478654</view>
					</view>
					<view class="content">
						<view class="title">器具名称</view>
						<view class="message">燃油加油机</view>
					</view>
					<view class="content">
						<view class="title">规格型号</view>
						<view class="message">20kg*10</view>
					</view>
				</view>
				<view class="contentItems">
					<view></view>
					<view class="content">
						<view class="title">出厂编号</view>
						<view class="message">123478654</view>
					</view>
					<view class="content">
						<view class="title">器具名称</view>
						<view class="message">汽车发动机检测仪</view>
					</view>
					<view class="content">
						<view class="title">规格型号</view>
						<view class="message">BJL</view>
					</view>
				</view>
			</view>
		</view> -->
  </view>
</template>

<script>
import { getMiAuditApplyList } from "@/api/assay";
import { useDict, paraseDict } from "@/utils/index";
export default {
  data() {
    return {
      recordColor: {
        已撤回: "#fa3534",
        已接收: "#2979ff",
        待提交: "#2979ff",
        备案中: "#2979ff",
        已拒绝: "#fa3534",
        勿备案: "#fa3534",
        未备案: "#909399",
        免备案: "#909399",
        已退回: "#fa3534",
      },
      record: [], //备案字典
      activeContent: "我的申请",
      tabsList: [
        {
          name: "我的申请",
        },
      ],
      ledgerList: [],
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        filingNo: "",
        orderByColumn: "createTime",
        isAsc: "Desc",
      },
      total: 0,
    };
  },
  async onLoad() {
    // useDict("ejian_instrCheckStatus").then((res) => {
    //   this.verification = res;
    // });
    // useDict("ejian_instrCheckRecordStatusV2").then((res) => {
    //   this.application = res;
    // });
    useDict("ejian_instrFillingStatus").then((res) => {
      this.record = res;
    });
    this.getList();
    uni.startPullDownRefresh();
  },
  onPullDownRefresh() {
    this.getList();
    console.log("refresh");
    setTimeout(function () {
      uni.stopPullDownRefresh();
    }, 800);
  },
  onShow() {
    uni.$on("query", (query) => {
      if (query.a == "one") {
        console.log("query", query);
        console.log("11111111111111111111111");
        uni.startPullDownRefresh();
        setTimeout(() => {
          this.queryParams.pageNum = 1;
          this.queryParams.pageSize = 10;
          this.getList();
        }, 1500);
      }
    });
  },
  computed: {
    // //检定状态
    // verificationStatus() {
    // 	return (row) => {
    // 		return paraseDict(this.verification, row);
    // 	};
    // },
    // //申请状态
    // applicationStatus() {
    // 	return (row) => {
    // 		return paraseDict(this.application, row);
    // 	};
    // },
    //备案状态
    recordStatus() {
      return (row) => {
        return paraseDict(this.record, row);
      };
    },
  },
  methods: {
    sousuo(val) {
      console.log(val);
      this.queryParams.filingNo = val;
      this.getList();
    },
    getList() {
      getMiAuditApplyList({
        ...this.queryParams,
      }).then((res) => {
        this.ledgerList = res.rows;
        this.total = res.total;
      });
    },
    onReachBottom() {
      //触底事件
      if (this.queryParams.pageNum * this.queryParams.pageSize >= this.total) {
        uni.showToast({
          title: "没有更多数据了",
          icon: "none",
          duration: 1000,
        });
        setTimeout(() => {
          uni.hideLoading();
        }, 500);
      } else {
        if (this.queryParams.pageNum <= this.queryParams.pageNum - 1) {
          setTimeout(() => {
            uni.hideLoading();
          }, 500);
        } else {
          uni.showLoading({
            title: "加载中",
          });
          this.queryParams.pageNum++;

          getMiAuditApplyList({
            ...this.queryParams,
          }).then(({ rows, total }) => {
            this.ledgerList = [...this.ledgerList, ...rows];
            this.total = total;
          });
        }
        setTimeout(() => {
          uni.hideLoading();
        }, 500);
      }
    },
    //备案申请
    handleApplicat() {
      uni.navigateTo({
        // url: "/pages/assay/assayList",
        url: "/pages/assay/deptList",
        success: (res) => {},
        fail: () => {},
        complete: () => {},
      });
    },
    handleChange(row) {
      this.activeContent = row.name;
    },
    handleCurrentForm() {},
    handleDetails(item) {
      uni.navigateTo({
        url:
          "/pages/assay/details?id=" +
          item.id +
          "&danwei=" +
          item.useOrgName +
          "&applypeople=" +
          item.userName +
          "&userMobile=" +
          item.userMobile +
          "&createTime=" +
          item.createTime,
        success: (res) => {},
        fail: () => {},
        complete: () => {},
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.createFixed {
  background: #2979ff;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 90rpx;
  height: 90rpx;
  border-radius: 50%;
  position: fixed;
  right: 30rpx;
  bottom: 200rpx;
}

.createNew {
  font-size: 30rpx;
  margin: 10rpx 0 10rpx 10rpx;
  color: #3c9ff3;
}

.container {
  height: 100vh;
  background: rgb(243, 244, 249);

  .contentItems {
    width: 93%;
    border-radius: 6px;
    background: #fff;
    margin: 20rpx auto 10rpx;
    padding: 10rpx 30rpx 10rpx;

    .content {
      // border-bottom: 1px solid rgb(242, 242, 242);
      padding: 10rpx 0;
      display: flex;

      // justify-content: space-between;
    }

    .content:last-child {
      border-bottom: none;
    }

    .title {
      font-size: 28rpx;
      color: rgb(146, 146, 146);
      letter-spacing: 3rpx;
    }

    .message {
      font-size: 28rpx;
      color: rgb(146, 146, 146);
    }
  }
}
</style>