新增系统服务计划页面

src/router/modules/base.js

@@ -503,6 +503,36 @@ export default [
 
 
 
+        ],
+    },
+        {
+        path: '/system/service',
+        name: 'system-service',
+        redirect: '/patrol/safe',
+        meta: { title: '系统服务管理' },
+        component: Layout,
+        children: [
+            {
+                path: '/system/service/plane',
+                name: 'system-service-plan',
+                meta: { title: '服务计划管理' },
+                component: () => import('~src/views/systemService/plan.vue'),
+            },
+            {
+                path: '/patrol/add',
+                name: 'patrol-menu-add',
+                meta: { title: '新增巡检' },
+                component: () => import('~src/views/patrol/add.vue'),
+            },
+            {
+                path: '/patrol/manage',
+                name: 'patrol-menu-manage',
+                meta: { title: '整改管理' },
+                component: () => import('~src/views/patrol/manage.vue'),
+            },
+
+
+
         ],
     },
     {

src/views/systemService/plan.vue

@@ -0,0 +1,119 @@
+<template>
+    <hc-card>
+        <template #header>
+            <div class="w-32">
+                <el-select v-model="searchForm.key1" clearable block placeholder="填写类型">
+                    <el-option v-for="item in fillType" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
+                </el-select>
+            </div>
+            <div class="ml-3 w-64">
+                <HcDatePicker :dates="betweenTime" clearable @change="betweenTimeUpdate" />
+            </div>
+            <div class="ml-3 w-32">
+                <el-select v-model="searchForm.key2" clearable block placeholder="状态">
+                    <el-option v-for="item in tasksStatus" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
+                </el-select>
+            </div>
+            <div class="ml-3 w-32">
+                <el-select v-model="searchForm.key3" clearable block placeholder="编写人">
+                    <el-option v-for="item in preparedList" :key="item.id" :label="item.name" :value="item.id" />
+                </el-select>
+            </div>
+            <div class="ml-3 w-32">
+                <el-select v-model="searchForm.key4" clearable block placeholder="发送人">
+                    <el-option v-for="item in postList" :key="item.batch" :label="item.name" :value="item.id" />
+                </el-select>
+            </div>
+        </template>
+        <template #extra>
+            <el-button type="primary">
+                <HcIcon name="add" />
+                <span>创建月度计划</span>
+            </el-button>
+            <el-button type="primary">
+                <HcIcon name="add" />
+                <span>创建服务计划</span>
+            </el-button>
+        </template>
+    
+
+        <hc-table :column="tableColumn" :datas="tableData">
+            <template #key3="{ row }">
+                <el-tag
+                    v-if="row?.key3"
+                    :type="`${row.key3 === '已计划' ? 'success' : row.key3 === '计划中' ? 'info' : 'warning'}`" class="mx-1" effect="dark"
+                >
+                    {{ row.key3 }}
+                </el-tag>
+            </template>
+            <template #action="{ row }">
+                <el-link type="primary">编辑</el-link>
+                <el-link type="success">查看</el-link>
+                <el-link type="warning">删除</el-link>
+            </template>
+        </hc-table>
+
+        <template #action>
+            <HcPages :pages="searchForm" @change="pageChange" />
+        </template>
+    </hc-card>
+</template>
+
+<script setup>
+import { nextTick, ref, watch } from 'vue'
+//搜索表单
+const searchForm = ref({
+    key1: null, ke2: null, key3: null, key4: null, startTimeValue: null, endTimeValue: null,
+    current: 1, size: 20, total: 0,
+})
+const fillType = ref([
+    { dictKey: '1', dictValue: '月度服务计划' },
+    { dictKey: '2', dictValue: '服务完成确认单' },
+])
+const tasksStatus = ref([
+    { dictKey: '1', dictValue: '待审核' },
+    { dictKey: '2', dictValue: '已审核' },
+    { dictKey: '3', dictValue: '退回' },
+])
+const preparedList = ref([
+    { id: 1, name: '张三' },
+    { id: 2, name: '李四' },
+
+])
+const postList = ref([
+    { id: 1, name: '张三' },
+    { id: 2, name: '李四' },
+
+])
+
+//日期时间被选择
+const betweenTime = ref(null)
+const betweenTimeUpdate = ({ val, arr }) => {
+    betweenTime.value = arr
+    searchForm.value.startTimeValue = val['start']
+    searchForm.value.endTimeValue = val['end']
+}
+const searchClick = ()=>{
+
+}
+const tableColumn = [
+    { key: 'key1', name: '服务完成确认单' },
+    { key: 'key2', name: '计划时间' },
+    { key: 'key3', name: '状态' },
+    { key: 'key4', name: '编写人' },
+    { key: 'key5', name: '创建时间' },
+    { key: 'key6', name: '发送人员' },
+    { key: 'action', name: '操作', width:150 },
+]
+const tableData = ref([
+    { name: '名称1', text: '文本1', key3: '已计划' },
+    { name: '名称2', text: '文本2', key3: '计划中' },
+    { name: '名称3', text: '文本3', key3: '协同中-甲方' },
+])
+//分页被点击
+const pageChange = ({ current, size }) => {
+    searchForm.value.current = current
+    searchForm.value.size = size
+    // getTableData()
+}
+</script>