提交app

pages/index/comp/transient.vue

@@ -0,0 +1,179 @@
+<template>
+    <view class="dateReport">
+        <view class="pd20">
+            <uni-segmented-control
+                :current="curSub"
+                class="subsection"
+                active-color="#376cf3"
+                :values="subsectionList"
+                @clickItem="sectionChange"
+            />
+        </view>
+
+        <!-- 申请报表 -->
+        <view v-if="curSub == 0">
+            <!-- apply -->
+            <Apply :navHeight="navHeight"/>
+        </view>
+
+        <!-- 申请记录 -->
+        <view v-if="curSub == 1">
+            <view
+                class="record event-list"
+                v-if="eventList.length != 0"
+                :style="{ height: 'calc(100vh - ' + (navHeight + 56) + 'px)', overflow: 'auto' }"
+            >
+                <!-- 循环渲染事件项 -->
+                <uni-card class="event-item" :class="item.type" v-for="(item, index) in eventList" :key="index">
+                    <view class="title" :class="item.status == 1 ? 'completed' : 'incomplete'">
+                        <view> {{ item.status == 1 ? '已完成' : '未完成' }} </view>
+                    </view>
+                    <!-- 头部：图标 + 信息 + 操作 -->
+                    <view class="event-header">
+                        <view class="event-info">
+                            <view class="event-title">
+                                <text class="event-id">{{ item.id }}</text>
+                                <text class="event-tags">{{ item.tag }}</text>
+                            </view>
+                        </view>
+                    </view>
+                    <!-- 详情区域 -->
+                    <view class="event-detail">
+                        <text>申请人：xxx</text>
+                        <text>电话号码：18888888888</text>
+                    </view>
+                    <view class="downloadReport">
+                        <!-- <u-icon :name="item.status == 1 ? 'download' : 'upload'" color="#376cf3" size="40"></u-icon> -->
+                        <uni-icons
+                            :type="item.status == 1 ? 'download' : 'upload'"
+                            size="16"
+                            color="#376cf3"
+                        ></uni-icons>
+
+                        {{ item.status == 1 ? '下载报告' : '生成报告' }}
+                    </view>
+                </uni-card>
+                <uni-load-more :status="status"></uni-load-more>
+            </view>
+            <Cn-empty v-else></Cn-empty>
+        </view>
+    </view>
+</template>
+<script>
+import Apply from './apply.vue'
+export default {
+    components: { Apply },
+    props: {
+        indexList: {
+            type: Array,
+            default: () => [],
+        },
+        total: {
+            type: Number,
+            default: 0,
+        },
+        // status: {
+        //     type: String,
+        //     default: 'more',
+        // },
+        navHeight: {
+            type: Number,
+            default: 0,
+        },
+    },
+    data() {
+        return {
+            value: ['0'],
+            content: 123,
+            curSub: 0,
+            subsectionList: ['申请报表', '申请记录'],
+            form: {
+                type: 0,
+                lindId: '',
+            },
+            status: 'noMore',
+            eventList: [
+                {
+                    id: '测试监测点',
+                    tag: '2026-01-23至2026-01-23',
+                    status: '1',
+                },
+                {
+                    id: '测试监测点',
+                    tag: '2026-01-23至2026-01-23',
+                    status: '0',
+                },
+            ],
+        }
+    },
+    created() {},
+    mounted() {},
+    computed: {},
+    methods: {
+        scrolltolower() {
+            this.$emit('scrolltolower')
+        },
+        getHeight() {},
+
+        sectionChange(index) {
+            this.curSub = index.currentIndex
+        },
+    },
+    watch: {},
+}
+</script>
+<style lang="scss" scoped>
+@import '@/pages/message1/index.scss';
+.event-title {
+    justify-content: space-between;
+}
+.event-tags {
+    font-size: 24rpx;
+}
+
+.event-detail {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+}
+.downloadReport {
+    width: 100%;
+    background: #376cf320;
+    height: 60rpx;
+    line-height: 60rpx;
+    color: #376cf3;
+    font-weight: 600;
+    border-radius: 15rpx;
+    margin-top: 10rpx;
+    display: flex;
+    justify-content: center;
+}
+
+.title {
+    position: absolute;
+    left: 0px;
+    width: calc(100% - 36rpx);
+    // margin: 0 10px;
+    top: 0;
+    border-radius: 4px 4px 0 0;
+    padding: 2px 10px;
+    font-size: 24rpx;
+    font-weight: 600px;
+    display: flex;
+    justify-content: space-between;
+    font-weight: 700;
+}
+.completed {
+    background: #e1f3d8;
+    color: #67c23a;
+}
+.incomplete {
+    background: #fde2e2;
+    color: #f56c6c;
+}
+
+/deep/ .record {
+    .uni-card__content {
+        padding: 55rpx 20rpx 20rpx !important;
+    }
+}
+</style>