新页面

src/views/danger/dangerPatrol/dangerPatrolTime/index.vue

+<template>
+    <div>
+        <LHeader :text="text"></LHeader>
+        <!-- 内容列表 -->
+        <div class="title">2022年4月26日</div> 
+        <p class="title-text">系统提示：请依据当日任务完成当日巡查工作。</p> 
+        <div class="con-list">
+            <van-cell-group
+                inset
+                v-for="(item, index) in contentList"
+                :key="index"
+                @click="onClick(item.content)"
+            >
+                <div class="icon-wrap">
+                    <span class="icon-img">
+                        <van-image
+                            width="35"
+                            height="35"
+                            style="margin: 0 10px;overflow: hidden; border-radius: 5px;"
+                            :src="item.imgUrl"
+                        />
+                    </span>
+                    {{ item.content }}
+                </div>
+            </van-cell-group>
+        </div>
+    </div>
+</template>
+
+<script>
+import LHeader from "@/components/header.vue";
+import { postWork } from "@/service/workbench";
+export default {
+    name: "danger-patrol",
+    components: {
+        LHeader
+    },
+    data() {
+        return {
+            text: "隐患巡查",
+            contentList: [
+                {
+                    title: "A1",
+                    imgUrl: require("@/assets/dangerPatrol/patrol-icon.png"),
+                    content: "日查清单"
+                },
+                {
+                    title: "A2",
+                    imgUrl: require("@/assets/dangerPatrol/patrol-icon.png"),
+                    content: "周查清单"
+                },
+                {
+                    title: "A3",
+                    imgUrl: require("@/assets/dangerPatrol/patrol-icon.png"),
+                    content: "月查清单"
+                },
+                {
+                    title: "A4",
+                    imgUrl: require("@/assets/dangerPatrol/patrol-icon.png"),
+                    content: "季查清单"
+                },
+                {
+                    title: "A5",
+                    imgUrl: require("@/assets/dangerPatrol/patrol-icon.png"),
+                    content: "年查清单"
+                }
+            ]
+        };
+    },
+    mounted() {},
+    methods: {
+        // onClick(val) {
+        //     if (val == "执行巡查") {
+        //         this.$router.push({
+        //             name: "implement"
+        //         });
+        //     } else if (val == "取消巡查") {
+        //         this.$router.push({
+        //             name: "cancel-patrol"
+        //         });
+        //     } else if (val == "巡查记录") {
+        //         this.$router.push({
+        //             name: "record-patrol"
+        //         });
+        //     } else if (val == "巡查统计") {
+        //         this.$router.push({
+        //             name: "statistics"
+        //         });
+        //     }
+        // }
+        onClick(val) {
+            this.$router.push({
+                name: "implement"
+            });
+        }
+    }
+};
+</script>
+<style lang="less" scoped>
+/* @import url(); 引入css类 */
+.van-cell-group--inset {
+    // height: 2.266667rem;
+    line-height: 2.266667rem;
+    font-size: 0.4rem;
+    font-weight: bolder;
+    margin: 0.266667rem;
+    padding-left: 0.666667rem;
+    color: #3499ff;
+    .icon-wrap {
+        display: flex;
+        align-items: center;
+        .icon-img {
+            margin-right: 0.533333rem;
+            display: inherit;
+        }
+    }
+}
+.title{
+    text-align: center;
+    font-weight: bolder;
+    margin-top: 0.5rem;
+}
+.title-text{
+    padding-left: 0.666667rem;
+}
+</style>