代码提交

src/assets/json/authMenuList.json

@@ -69,7 +69,7 @@
                 {
                     "path": "/alarm/singleDevice",
                     "name": "singleDevice",
-                    "component": "/proTable/useProTable/index",
+                    "component": "/alarm/singleDevice/index",
                     "meta": {
                         "title": "单站设备状态监测报警",
                         "isLink": "",
@@ -95,7 +95,7 @@
                 {
                     "path": "/alarm/gis",
                     "name": "proTableDocument",
-                    "component": "/proTable/useProTable/index",
+                    "component": "/alarm/gis/index",
                     "meta": {
                         "title": "GIS展示",
                         "isLink": "",

src/styles/element.scss

@@ -265,13 +265,25 @@
   }
 }
 
+/* el-tabs */
+.el-tabs{
+  .el-tabs__item.is-active {
+    color: var(--el-color-primary);
+    background-color: rgba(242, 248, 255, 1);
+  }
+
+ .is-left {
+    justify-content: flex-start!important;
+  }
+}
+
 /* el-dialog */
 .el-dialog {
   padding: 0;
   .el-dialog__header {
-    padding: 15px 20px;
-    margin: 0;
-    border-bottom: 1px solid var(--el-border-color-lighter);
+    padding: 15px 0px;
+    margin: 0 20px;
+    border-bottom: 2px solid var(--el-border-color-lighter);
     .el-dialog__title {
       font-size: 17px;
     }
@@ -280,6 +292,9 @@
   .el-dialog__footer {
     padding: 15px 20px;
   }
+  .el-dialog__headerbtn {
+    margin-top: 5px;
+  }
 }
 
 .setting {

src/views/alarm/allData/index.vue

@@ -19,7 +19,7 @@
         </div>
         <div class="header-button-ri">
           <slot name="toolButton">
-            <img class="setting" src="@/assets/images/setting2.png" />
+            <img class="setting" src="@/assets/images/setting2.png" @click="handleSetting" />
           </slot>
         </div>
       </div>
@@ -47,6 +47,43 @@
       <!-- 分页组件 -->
       <Pagination :pageable="pageable" :handle-size-change="handleSizeChange" :handle-current-change="handleCurrentChange" />
     </div>
+
+    <!-- 添加或修改岗位对话框 -->
+    <el-dialog :title="dialog.title" v-model="dialog.visible" width="940px" append-to-body>
+      <div style="height: 500px">
+        <el-tabs tab-position="left" class="demo-tabs" style="height: 100%">
+          <el-tab-pane label="风">
+            <div class="container-tag">
+              <div class="item-tag">2分钟平均风速</div>
+              <div class="item-tag-active">2分钟平均风向</div>
+              <div class="item-tag">10分钟平均风速</div>
+              <div class="item-tag">10分钟平均风向</div>
+              <div class="item-tag">小时最大风速</div>
+              <div class="item-tag-active">小时最大风速的风向</div>
+              <div class="item-tag">小时极大风速出现时间</div>
+            </div>
+          </el-tab-pane>
+          <el-tab-pane label="温湿度">Config</el-tab-pane>
+          <el-tab-pane label="气压">Role</el-tab-pane>
+          <el-tab-pane label="降水">Task</el-tab-pane>
+          <el-tab-pane label="云">Task</el-tab-pane>
+          <el-tab-pane label="能见度">Task</el-tab-pane>
+          <el-tab-pane label="天气现象">Task</el-tab-pane>
+          <el-tab-pane label="积雪">Task</el-tab-pane>
+          <el-tab-pane label="地面温度">Task</el-tab-pane>
+          <el-tab-pane label="大气电场">Task</el-tab-pane>
+          <el-tab-pane label="闪电">Task</el-tab-pane>
+          <el-tab-pane label="日照">Task</el-tab-pane>
+          <el-tab-pane label="总辐射">Task</el-tab-pane>
+        </el-tabs>
+      </div>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="cancel">取 消</el-button>
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
   </div>
 </template>
 
@@ -54,6 +91,26 @@
 import Pagination from "@/components/ProTable/components/Pagination.vue";
 import { ref, reactive } from "vue";
 import { ColumnProps } from "@/components/ProTable/interface";
+import {TabsInstance} from "element-plus";
+const dialog = reactive<any>({
+  visible: false,
+  title: ''
+});
+
+const handleSetting = () => {
+  dialog.title = "列表字段设置"
+  dialog.visible = true;
+}
+
+const submitForm = () => {
+
+}
+
+const cancel = () => {
+  dialog.visible = false;
+}
+
+
 const pageable = ref<any>({
   pageNum: 1,
   pageSize: 20,
@@ -339,3 +396,50 @@ const columns = reactive<ColumnProps[]>([
   { prop: "i", label: "漏点温度(℃)" }
 ]);
 </script>
+<style lang="scss" scoped>
+.container-tag {
+  display: flex;
+  flex-flow:row wrap;
+  align-items: flex-start;
+  padding: 20px;
+  text-align: left;
+  gap: 20px;
+}
+.item-tag {
+  cursor: pointer;
+  width: 18%;
+  background-color: #F2F2F2;
+  border-radius: 8px;
+  color: #000000;
+  font-size: 16px;
+  text-align: center;
+  padding: 15px;
+  flex: 0 1 auto;
+}
+
+.item-tag-active {
+  cursor: pointer;
+  width: 18%;
+  background-color: #F2F8FF;
+  border-radius: 8px;
+  color: #007aff;
+  font-size: 16px;
+  text-align: center;
+  padding: 15px;
+  flex: 0 1 auto;
+  position: relative;
+}
+
+.item-tag-active::after {
+  content: "";
+  display: inline-block;
+  width: 25px;
+  height: 25px;
+  background-image: url("@/assets/images/selected.png");
+  background-repeat: no-repeat;
+  background-size: contain;
+  position: absolute;
+  right: 0px;
+  bottom: 0px;
+}
+</style>

src/views/alarm/gis/index.vue

@@ -0,0 +1,13 @@
+<template>
+
+</template>
+
+<script>
+export default {
+  name: "index"
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/alarm/singleDevice/index.vue

@@ -0,0 +1,13 @@
+<template>
+
+</template>
+
+<script>
+export default {
+  name: "index"
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/maintenance/siteRecords/index.vue

@@ -28,7 +28,7 @@
             <el-form-item>
               <el-button type="primary" @click="handleQuery"> 查询 </el-button>
               <el-button style="margin-left: 10px" @click="resetQuery"> 重置 </el-button>
-              <el-button  style="margin-left: 10px" type="primary" plain  @click="handleQuery"> 新增 </el-button>
+              <el-button  style="margin-left: 10px" type="primary" plain  @click="handleAdd"> 新增 </el-button>
             </el-form-item>
           </el-form>
         </div>
@@ -50,7 +50,7 @@
                   content="编辑"
                   placement="top"
                 >
-                  <el-button type="primary" link >
+                  <el-button type="primary" link @click="handleUpdate">
                     <img class="operation-img" src="@/assets/images/edit.png">
                   </el-button>
                 </el-tooltip>
@@ -82,6 +82,53 @@
       <!-- 分页组件 -->
       <Pagination :pageable="pageable" :handle-size-change="handleSizeChange" :handle-current-change="handleCurrentChange" />
     </div>
+
+    <!-- 添加或修改岗位对话框 -->
+    <el-dialog :title="dialog.title" v-model="dialog.visible" width="800px" append-to-body>
+      <el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
+        <el-form-item label="维护自动站" prop="code">
+          <el-select v-model="form.code" placeholder="请选择" clearable>
+            <el-option label="M1994" value="M1994" />
+            <el-option label="M1995" value="M1995" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="维护类型" prop="type">
+          <el-select v-model="form.type" placeholder="请选择" clearable>
+            <el-option label="检查" value="1" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="维护人" prop="name">
+          <el-input v-model="form.name" placeholder="请输入维护人" />
+        </el-form-item>
+        <el-form-item label="开始时间" prop="startTime">
+          <el-date-picker
+            style="width: 100%"
+            v-model="form.startTime"
+            type="datetime"
+            placeholder="请选择"
+            format="YYYY-MM-DD HH:mm"
+          />
+        </el-form-item>
+        <el-form-item label="结束时间" prop="endTime">
+          <el-date-picker
+            style="width: 100%"
+            v-model="form.endTime"
+            type="datetime"
+            placeholder="请选择"
+            format="YYYY-MM-DD HH:mm"
+          />
+        </el-form-item>
+        <el-form-item label="工作内容" prop="remark">
+          <el-input v-model="form.remark" type="textarea" :rows="8" placeholder="请输入内容" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="cancel">取 消</el-button>
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
   </div>
 </template>
 
@@ -158,4 +205,70 @@ const columns = reactive<ColumnProps[]>([
   { prop: "h", label: "维护人", width:100},
   { prop: "operation", label: "操作", width:150,align: 'center' }
 ]);
+
+const dialog = reactive<any>({
+  visible: false,
+  title: ''
+});
+const formRef = ref<any>();
+const rules = ref<any>(
+  {
+    code: [{ required: true, message: "维护自动站不能为空", trigger: "blur" }],
+    type: [{ required: true, message: "维护类型不能为空", trigger: "blur" }],
+    name: [{ required: true, message: "维护人不能为空", trigger: "blur" }],
+    startTime: [{ required: true, message: "开始时间不能为空", trigger: "blur" }],
+    endTime: [{ required: true, message: "结束时间不能为空", trigger: "blur" }],
+    remark: [{ required: true, message: "工作内容不能为空", trigger: "blur" }],
+  }
+);
+
+
+const initFormData = ref<any>(
+  {
+    code: "",
+    type: "",
+    name: "",
+    startTime:"",
+    endTime:"",
+    remark: ""
+  }
+);
+
+
+const form = ref<any>({...initFormData});
+
+/** 新增按钮操作 */
+const handleAdd = () => {
+  reset();
+  dialog.visible = true;
+  dialog.title = "添加";
+}
+
+/** 修改按钮操作 */
+const handleUpdate = async (row?: any) => {
+  reset();
+  dialog.visible = true;
+  dialog.title = "编辑";
+}
+
+/** 取消按钮 */
+const cancel = () => {
+  reset();
+  dialog.visible = false;
+}
+/** 表单重置 */
+const reset = () => {
+  form.value = { ...initFormData };
+  formRef.value?.resetFields();
+}
+
+/** 提交按钮 */
+const submitForm = () => {
+  formRef.value?.validate(async (valid: boolean) => {
+    if (valid) {
+      dialog.visible = false;
+    }
+  });
+}
+
 </script>