增加监控点每日抓图

wangrong

10 天以前 cdddff9312554b48ad44a1c63ff187af4c74fe68

增加监控点每日抓图

 src/modules/monitor/views/capturetask.vue

New file
@@ -0,0 +1,183 @@
<template>
    <cl-crud ref="Crud">
        <cl-row>
            <!-- 刷新按钮 -->
            <cl-refresh-btn />
            <!-- 新增按钮 -->
            <cl-add-btn />
            <!-- 删除按钮 -->
            <cl-multi-delete-btn />
            <cl-flex1 />
            <!-- 条件搜索 -->
            <cl-search ref="Search" />
        </cl-row>

        <cl-row>
            <!-- 数据表格 -->
            <cl-table ref="Table" />
        </cl-row>

        <cl-row>
            <cl-flex1 />
            <!-- 分页控件 -->
            <cl-pagination />
        </cl-row>

        <!-- 新增、编辑 -->
        <cl-upsert ref="Upsert" />
    </cl-crud>
</template>

<script lang="ts" setup>
    defineOptions({
        name: "monitor-capturetask"
    });

    import { useCrud, useTable, useUpsert, useSearch } from "@cool-vue/crud";
    import { useCool } from "/@/cool";
    import { useI18n } from "vue-i18n";
    import { reactive } from "vue";

    const { service } = useCool();
    const { t } = useI18n();

    // 选项
    const options = reactive({
        status: [
            { label: t('PENDING'), value: 0 },
            { label: t('SUCCESS'), value: 1 },
            { label: t('FAILED'), value: 2 }
        ]
    });

    // cl-upsert
    const Upsert = useUpsert({
        items: [
            {
                label: t('设备序列号'),
                prop: "deviceSerial",
                component: { name: "el-input", props: { clearable: true } },
                span: 12,
                required: true
            },
            {
                label: t('通道号'),
                prop: "channelNo",
                hook: "number",
                component: { name: "el-input-number", props: { min: 0 } },
                span: 12,
                required: true
            },
            {
                label: t('选择抓图任务'),
                prop: "captureTaskId",
                component: { name: "el-input", props: { clearable: true } },
                span: 12
            },
            {
                label: t('选择云空间'),
                prop: "spaceId",
                component: { name: "el-input", props: { clearable: true } },
                span: 12
            },
            {
                label: t('云空间图片链接'),
                prop: "cloudUrl",
                component: { name: "cl-upload" }
            },
            { label: t('本地图片链接'), prop: "localUrl", component: { name: "cl-upload" } },
            {
                label: t('本地存储路径'),
                prop: "localPath",
                component: { name: "el-input", props: { clearable: true } },
                span: 12
            },
            {
                label: t('抓拍状态'),
                prop: "status",
                component: { name: "el-radio-group", options: options.status },
                value: 0,
                required: true
            },
            {
                label: t('任务执行日期'),
                prop: "captureDate",
                component: {
                    name: "el-date-picker",
                    props: { type: "date", valueFormat: "YYYY-MM-DD" }
                },
                span: 12
            }
        ]
    });

    // cl-table
    const Table = useTable({
        columns: [
            { type: "selection" },
            { label: t('设备序列号'), prop: "deviceSerial", minWidth: 140 },
            { label: t('通道号'), prop: "channelNo", minWidth: 140, sortable: "custom" },
            { label: t('抓图任务ID'), prop: "captureTaskId", minWidth: 140 },
            { label: t('云空间ID'), prop: "spaceId", minWidth: 140 },
            {
                label: t('云空间图片链接'),
                prop: "cloudUrl",
                minWidth: 100,
                component: { name: "cl-image", props: { size: 60 } }
            },
            {
                label: t('本地图片链接'),
                prop: "localUrl",
                minWidth: 100,
                component: { name: "cl-image", props: { size: 60 } }
            },
            { label: t('本地存储路径'), prop: "localPath", minWidth: 140 },
            {
                label: t('抓拍状态'),
                prop: "status",
                minWidth: 120,
                dict: options.status
            },
            {
                label: t('任务执行日期'),
                prop: "captureDate",
                minWidth: 140,
                sortable: "custom",
                component: { name: "cl-date-text", props: { format: "YYYY-MM-DD" } }
            },
            {
                label: t('创建时间'),
                prop: "createTime",
                minWidth: 170,
                sortable: "desc",
                component: { name: "cl-date-text" }
            },
            {
                label: t('更新时间'),
                prop: "updateTime",
                minWidth: 170,
                sortable: "custom",
                component: { name: "cl-date-text" }
            },
            { type: "op", buttons: ["edit", "delete"] }
        ]
    });

    // cl-search
    const Search = useSearch();

    // cl-crud
    const Crud = useCrud(
        {
            service: service.monitor.capturetask
        },
        (app) => {
            app.refresh();
        }
    );

    // 刷新
    function refresh(params?: any) {
        Crud.value?.refresh(params);
    }
</script>