fixed

src/assets/custom.scss

@@ -31,18 +31,26 @@
 }
 
 :deep(.ant-input-affix-wrapper) {
-  height: 36px;
   border-radius: 6px;
   background-color: rgba(45,119,243,0.2);
   border: 1px solid rgba(45,119,243,0.3);
 }
 
+:deep(.ant-input-affix-wrapper >input.ant-input) {
+  height: 26px;
+}
+
 :deep(.ant-input-affix-wrapper:hover),
 :deep(.ant-input-affix-wrapper:focus) {
   background-color: rgba(45,119,243,0.3);
   border: 1px solid rgba(45,119,243,0.4);
 }
 
+:deep(.ant-input-affix-wrapper > textarea) {
+  padding: 4px 11px;
+  border: 1px solid rgba(45,119,243,0.3);
+}
+
 :deep(.ant-input) {
   font-family: "Noto Sans SC", serif;
   font-size: 14px;
@@ -349,7 +357,7 @@
 :deep(.vben-basic-title) {
   font-family: "Noto Sans SC", serif;
   font-size: 14px;
-  color:white;
+  color: white;
 }
 
 :deep(.ant-tree-list) {
@@ -359,7 +367,7 @@
 :deep(.vben-tree__title) {
   font-family: "Noto Sans SC", serif;
   font-size: 14px;
-  color:white;
+  color: white;
 }
 
 :deep(.ant-tree-switcher-icon) {
@@ -383,5 +391,87 @@
 :deep(.ant-popconfirm-message-title) {
   font-family: "Noto Sans SC", serif;
   font-size: 14px;
-  color:white;
+  color: white;
+}
+
+:deep(.ant-picker),
+:deep(.ant-picker-range) {
+  height: 36px;
+  border-color: rgba(45,119,243,0.3);
+  background: rgba(45,119,243,0.2);
+}
+
+:deep(.ant-picker:hover) {
+  border-color: rgba(45,119,243,0.4);
+  background: rgba(45,119,243,0.3);
+}
+
+:deep(.ant-picker-focused),
+:deep(.ant-picker-range:hover),
+:deep(.ant-picker-range:focus) {
+  border-color: rgba(45,119,243,0.4);
+  background: rgba(45,119,243,0.3);
+}
+
+:deep(.vben-basic-table .ant-picker-range) {
+  width: 100%;
+}
+
+:deep(.ant-picker-input >input) {
+  font-family: "Noto Sans SC", serif;
+  font-size: 14px;
+  color: white;
+}
+
+:deep(.ant-picker-input >input::placeholder) {
+  font-family: "Noto Sans SC", serif;
+  font-size: 14px;
+  color: #AAAAAA;
+}
+
+:deep(.anticon) {
+  color: white !important;
+}
+
+:deep(.ant-picker-panel-layout) {
+  border: 1px solid #183171 !important;
+  background-color: #13265a !important;
+}
+
+:deep(.ant-picker-cell) {
+  font-family: "Noto Sans SC", serif;
+  font-size: 14px;
+  color: #999999;
+}
+
+:deep(.ant-picker-cell-in-view) {
+  color: white !important;
+}
+
+:deep(.ant-picker-content th) {
+  font-family: "Noto Sans SC", serif;
+  font-size: 14px;
+  color: white !important;
+}
+:deep(.ant-picker-header-super-prev-btn),
+:deep(.ant-picker-header-prev-btn),
+:deep(.ant-picker-header-super-next-btn),
+:deep(.ant-picker-header-next-btn),
+:deep(.ant-picker-year-btn),
+:deep(.ant-picker-month-btn),
+:deep(.ant-picker-decade-btn) {
+  font-family: "Noto Sans SC", serif;
+  font-size: 14px;
+  color: white !important;
+}
+
+:deep(.ant-picker-header-view),
+:deep(.ant-picker-time-panel-cell-inner) {
+  font-family: "Noto Sans SC", serif;
+  font-size: 14px;
+  color: white !important;
+}
+
+:deep(.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner) {
+  background-color: rgba(146,214,237,0.3) !important;
 }

src/router/routes/embedded/data.ts

@@ -29,6 +29,17 @@ const data: AppRouteModule = {
         title: '任务',
         ignoreAuth: true,
       },
+      children: [
+        {
+          path: 'detail',
+          name: 'DetailPage',
+          component: () => import('/@/views/data/task/detail.vue'),
+          meta: {
+            title: '任务详情',
+            ignoreAuth: true,
+          },
+        },
+      ],
     },
   ],
 };

src/views/data/device/detail.vue

@@ -1,74 +0,0 @@
-<template>
-  <Card :bordered="false" :loading="isLoading">
-    <PageHeader
-      :title="title"
-      @back="() => $router.go(-1)"
-    >
-      <template #extra>
-        <a-button type="primary" @click="$router.go(-1)">返回上一页面</a-button>
-      </template>
-    </PageHeader>
-    <Descriptions bordered :column="3">
-      <Descriptions.Item
-        v-for="p in displayProps"
-        :key="p.key"
-        :label="p.title"
-        :span="['avatar'].includes(p.key) ? 3 : 1"
-      >
-        <span v-if="p.key === 'avatar'">
-          <Image style="width: 100px" :src="p.value"/>
-        </span>
-        <template v-else>
-          {{ p.value }}
-        </template>
-      </Descriptions.Item>
-    </Descriptions>
-  </Card>
-</template>
-<script lang="ts" setup>
-  import { onMounted, computed, ref, Ref } from 'vue';
-  import { useRoute } from 'vue-router';
-  import { useAsyncState } from '@vueuse/core';
-  import { PageHeader, Descriptions, Card } from 'ant-design-vue';
-  import { descriptionColumns } from './schema';
-  import * as DeviceApi from '@/api/data/deviceApi';
-  import { Device } from '@/api/model/device';
-
-  const route = useRoute();
-  const id = ref(route.params?.id);
-  const title = route.meta.title
-
-  // id 查询
-  const {
-    state: detail,
-    isReady: isDetailReady,
-    isLoading,
-    execute,
-  } = useAsyncState(
-    DeviceApi.getById(id.value).then((res: Device) => res),
-    null,
-    {
-      immediate: false,
-    },
-  );
-
-  onMounted(() => {
-    execute();
-  });
-
-  const displayProps: Ref<Array<any>> = computed(() => {
-    if (!isDetailReady.value) return {};
-    const display: any = descriptionColumns.map(({ title, dataIndex = '', customRender }) => ({
-      key: dataIndex,
-      title,
-      value: customRender ? customRender({ text: detail.value[dataIndex], record: detail.value }) : detail.value[dataIndex],
-    }));
-    return display;
-  });
-</script>
-
-<style scoped lang="less">
-  ::v-deep(.ant-card-body){
-    padding-top: 0;
-  }
-</style>

src/views/data/task/drawer.vue

@@ -61,3 +61,6 @@
     }
   }
 </script>
+<style lang="scss" scoped>
+@use '@/assets/custom.scss';
+</style>

src/views/data/task/index.vue

@@ -1,8 +1,12 @@
 <template>
   <div>
+    <div class="header">
+      <SvgIcon size="19" name="list" />
+      <div class="title">设备列表</div>
+    </div>
     <BasicTable @register="registerTable">
       <template #toolbar>
-        <a-button type="primary" @click="handleCreate"> 新增</a-button>
+        <a-button type="primary" @click="handleCreate" :icon="h(PlusOutlined)">新增</a-button>
       </template>
       <template #bodyCell="{ column, record }">
         <template v-if="column.dataIndex === 'action'">
@@ -14,14 +18,6 @@
                 onClick: handleEdit.bind(null, record),
                 divider: true,
               },
-              {
-                label: '详情',
-                icon: 'ant-design:eye-outlined',
-                onClick: handleView.bind(null, record),
-                divider: true
-              },
-            ]"
-            :dropDownActions="[
               {
                 label: '删除',
                 icon: 'ant-design:delete-outlined',
@@ -33,6 +29,12 @@
                 },
                 ifShow: hasPermission('AUTH_DATA_TASK:DELETE'),
               },
+              {
+                label: '详情',
+                icon: 'ant-design:eye-outlined',
+                onClick: handleView.bind(null, record),
+                divider: true
+              },
             ]"
           />
         </template>
@@ -42,8 +44,6 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { ref } from 'vue';
-  import { Alert,Popconfirm } from 'ant-design-vue';
   import { useGo } from '@/hooks/web/usePage';
   import { usePermission } from '@/hooks/web/usePermission';
   import { BasicTable, useTable, TableAction } from '@/components/Table';
@@ -54,10 +54,9 @@
   import TaskDrawer from './drawer.vue';
   import { columns, searchFormSchema } from './schema';
   import { useMessage } from "@/hooks/web/useMessage";
-
+  import {SvgIcon} from "@/components/Icon";
-  defineOptions({
+  import {h} from "vue";
-    name: 'AUTH_DATA_TASK'
+  import {PlusOutlined} from "@ant-design/icons-vue";
-  })
 
   const { createMessage } = useMessage();
   const { hasPermission } = usePermission();
@@ -69,21 +68,21 @@
     api: (params) => TaskApi.search(handleParams(params)),
     columns,
     formConfig: {
-      labelWidth: 120,
+      labelWidth: 0,
       schemas: searchFormSchema,
       showAdvancedButton: false,
     },
     useSearchForm: true,
     showTableSetting: false,
-    bordered: false,
+    bordered: true,
     showIndexColumn: false,
     canResize: false,
     rowKey: (record: any) => record.id,
     actionColumn: {
-      width: 170,
+      width: 250,
       title: '操作',
       dataIndex: 'action',
-      fixed: 'right',
+      fixed: undefined,
     },
   });
 
@@ -93,7 +92,7 @@
     Object.keys(rest).forEach((key) => {
       const schema = searchFormSchema.find((item) => item.field === key);
       const value = params[key];
-      const paramKey = key;
+      let paramKey = key;
       if (schema) {
         if (value !== undefined && value !== '') {
           if (schema.component === 'Input') {
@@ -101,6 +100,9 @@
           } else if (['Select', 'ApiSelect', 'ApiTreeSelect'].includes(schema.component)) {
             handledParams[paramKey] = isObject(value) ? value.value : value;
           } else if (schema.component === 'RangePicker') {
+            if (paramKey === 'startTimeQuery') {
+              paramKey = 'startTime';
+            }
             handledParams[`${paramKey}From`] = dayjs(value[0]).startOf('d').format('YYYY-MM-DD HH:mm:ss');
             handledParams[`${paramKey}To`] = dayjs(value[1]).endOf('d').format('YYYY-MM-DD HH:mm:ss');
           } else if (schema.component === 'DatePicker') {

src/views/data/task/schema.ts

@@ -12,7 +12,7 @@ import { FormSchema } from '@/components/Table';
 
 
 
-const colProps = { xs: { span: 24 }, sm: { span: 24 }, lg: { span: 8 } };
+const colProps = { xs: { span: 24 }, sm: { span: 24 }, lg: { span: 4 } };
 const colPropsInDrawer = { span: 24 };
 
 export const schema = {
@@ -74,6 +74,7 @@ export const schema = {
         componentProps: {
           allowClear: true,
           placeholder: '任务参数',
+          autoSize: {minRows: 8, maxRows: 8},
         },
         component: 'InputTextArea',
         colProps: { span: 24 },
@@ -89,6 +90,7 @@ export const schema = {
         componentProps: {
           allowClear: true,
           placeholder: '任务结果',
+          autoSize: {minRows: 8, maxRows: 8},
         },
         component: 'InputTextArea',
         colProps: { span: 24 },
@@ -96,19 +98,38 @@ export const schema = {
       table: {
       },
     },
+    {
+      field: 'startTimeQuery',
+      label: '开始时间',
+      defaultValue: undefined,
+      form: {
+        colProps,
+        component: 'RangePicker',
+        componentProps: {
+          allowClear: false,
+          placeholder: ['开始时间', '结束时间'],
+          format: 'YYYY-MM-DD',
+          valueFormat: 'YYYY-MM-DD',
+          showTime: false,
+        },
+        rules: [{ required: true, message: '请输入开始时间！' }],
+      },
+      table: {
+      },
+    },
     {
       field: 'startTime',
       label: '开始时间',
       defaultValue: undefined,
       form: {
         colProps,
-        component: 'RangePicker',
+        component: 'DatePicker',
         componentProps: {
           allowClear: false,
           placeholder: '开始时间',
-          format: 'YYYY-MM-DD',
+          format: 'YYYY-MM-DD HH:mm:ss',
-          valueFormat: 'YYYY-MM-DD',
+          valueFormat: 'YYYY-MM-DD HH:mm:ss',
-          showTime: false,
+          showTime: true,
         },
         rules: [{ required: true, message: '请输入开始时间！' }],
       },
@@ -139,20 +160,31 @@ export const schema = {
       label: '状态',
       defaultValue: undefined,
       form: {
-        componentProps: {
-          allowClear: false,
-          placeholder: '状态',
-        },
         colProps,
-        component: 'InputNumber',
+        component: 'Select',
-        rules: [{ required: true, message: '请输入状态！' }],
+        componentProps: {
+          allowClear: true,
+          placeholder: '请选择状态',
+          options: [{value: 0, label: '未开始'}, {value: 1, label: '进行中'}, {value: 2, label: '已完成'}],
+          labelField: 'label',
+          valueField: 'value',
+        },
+        rules: [{ required: true, message: '请选择状态！' }],
       },
       table: {
+        customRender: ({ text, record }) => {
+          if (record.state === 0)
+            return '未开始';
+          if (record.state === 1)
+            return '进行中';
+          if (record.state === 2)
+            return '已完成';
+        },
       },
     },
     {
       field: 'createTime',
-      label: 'CreateTime',
+      label: '创建日期',
       defaultValue: undefined,
       form: {
         colProps,
@@ -191,9 +223,9 @@ export const schema = {
   ],
 };
 
-const queryFields = ['name','deviceSn','startTime','state'];
+const queryFields = ['name','deviceSn','startTimeQuery','state'];
-const editFields = ['name','deviceSn','paramJson','resultJson','startTime','endTime','state'];
+const editFields = ['name','deviceSn','paramJson','resultJson','startTime','endTime'];
-const tableFields = ['name','deviceSn','startTime','endTime','state','createTime','updateTime'];
+const tableFields = ['name','deviceSn','startTime','endTime','state','createTime'];
 const descriptionFields = ['name','deviceSn','paramJson','resultJson','startTime','endTime','state','createTime','updateTime'];
 
 const queryFieldsIndexMap = new Map(queryFields.map((field, index) => [field, index]));

src/views/system/user/index.vue

@@ -6,7 +6,7 @@
     </div>
     <BasicTable @register="registerTable">
       <template #toolbar>
-        <a-button type="primary" @click="handleCreate" :icon="h(PlusOutlined)">新增用户</a-button>
+        <a-button type="primary" @click="handleCreate" :icon="h(PlusOutlined)">新增</a-button>
       </template>
       <template #bodyCell="{ column, record }">
         <template v-if="column.key === 'action'">