Merge remote-tracking branch 'origin/master'

src/api/pms/iotopeationfill/index.ts

@@ -4,6 +4,7 @@ import request from '@/config/axios'
 export interface IotOpeationFillVO {
   id: number // 主键id
   deviceCode: string // 资产编号
+  deviceCategoryId:number
   deviceName: string // 设备名称
   fillContent: string // 填写内容
   deviceType: string // 设备类别
@@ -16,6 +17,13 @@ export interface IotOpeationFillVO {
   teamName: string // 所属小队
   dutyName: string // 设备负责人
   creDate: Date // 填写日期
+  name:string
+  type:string
+  modelAttr:string
+  isFill:number,
+  fillContent:string
+  pointCode:string
+  pointName:string
 }
 
 // 运行记录填报 API
@@ -25,6 +33,14 @@ export const IotOpeationFillApi = {
     return await request.get({ url: `/rq/iot-opeation-fill/page`, params })
   },
 
+  getAttrs:async (params: any) => {
+    return await request.get({ url: `/rq/iot-opeation-fill/getAttrs`, params })
+  },
+
+  getDeivceFillInfo:async (params: any) => {
+    return await request.get({ url: `/rq/iot-opeation-fill/getDeivceFillInfo`, params })
+  },
+
   // 查询运行记录填报详情
   getIotOpeationFill: async (id: number) => {
     return await request.get({ url: `/rq/iot-opeation-fill/get?id=` + id })
@@ -35,6 +51,11 @@ export const IotOpeationFillApi = {
     return await request.post({ url: `/rq/iot-opeation-fill/create`, data })
   },
 
+  // 新增运行记录填报
+  insertLog: async (data: IotOpeationFillVO) => {
+    return await request.post({ url: `/rq/iot-opeation-fill/insertLog`, data })
+  },
+
   // 修改运行记录填报
   updateIotOpeationFill: async (data: IotOpeationFillVO) => {
     return await request.put({ url: `/rq/iot-opeation-fill/update`, data })

src/views/pms/iotopeationfill/index.vue

@@ -1,122 +1,45 @@
 <template>
-  <el-row :gutter="20">
-    <el-col :span="4" :xs="24">
-      <el-card class="box-card" v-for="(item,index) in arry1" :key="index">
-        <template #header>
-          <div class="card-header">
-            <span>Card name</span>
-            <el-button class="button" text>Operation button</el-button>
-          </div>
+  <ContentWrap>
+    <el-tabs v-model="activeTab" type="border-card" tab-position="left" v-loading="loading" style="height: 84vh">
+      <el-tab-pane
+        style="height: 100%"
+        v-for="(item,index) in arry1"
+        :key="index"
+      >
+        <template #label>
+<!--          <span  @click="openFill(item.deviceCategoryId,item.deviceId,item.deptId,item.deviceName,item.deviceCode)">
+           {{item.deviceCode}} ({{ item.deviceName }})
+          </span>-->
+          <span class="custom-label" v-if='item.isFill === 1' @click="openFill(item.deviceCategoryId,item.deviceId,item.deptId,item.deviceName,item.deviceCode)">
+           {{item.deviceCode}} ({{ item.deviceName }})
+          </span>
+          <span v-else  @click="openFill(item.deviceCategoryId,item.deviceId,item.deptId,item.deviceName,item.deviceCode)">
+           {{item.deviceCode}} ({{ item.deviceName }})
+          </span>
         </template>
-        <div v-for="o in 4" :key="o" class="text item">{{ 'List item ' + o }}</div>
-      </el-card>
-    </el-col>
-    <el-col :span="16" :xs="24">
-      <ContentWrap>
-        <!-- 搜索工作栏 -->
-        <el-form
-          class="-mb-15px"
-          :model="queryParams"
-          ref="queryFormRef"
-          :inline="true"
-          label-width="68px"
-        >
-          <el-form-item label="资产编号" prop="deviceCode">
-            <el-input
-              v-model="queryParams.deviceCode"
-              placeholder="请输入资产编号"
-              clearable
-              @keyup.enter="handleQuery"
-              class="!w-240px"
-            />
-          </el-form-item>
-          <el-form-item label="填写日期" prop="creDate">
-            <el-date-picker
-              v-model="queryParams.creDate"
-              value-format="YYYY-MM-DD HH:mm:ss"
-              type="daterange"
-              start-placeholder="开始日期"
-              end-placeholder="结束日期"
-              :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-              class="!w-220px"
-            />
-          </el-form-item>
-          <el-form-item>
-            <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-            <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
-<!--            <el-button
-              type="primary"
-              plain
-              @click="openForm('create')"
-              v-hasPermi="['rq:iot-opeation-fill:create']"
-            >
-              <Icon icon="ep:plus" class="mr-5px" /> 新增
-            </el-button>-->
-            <el-button
-              type="success"
-              plain
-              @click="handleExport"
-              :loading="exportLoading"
-              v-hasPermi="['rq:iot-opeation-fill:export']"
-            >
-              <Icon icon="ep:download" class="mr-5px" /> 导出
-            </el-button>
-          </el-form-item>
-        </el-form>
-      </ContentWrap>
-
-      <!-- 列表 -->
-      <ContentWrap>
-        <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
-          <el-table-column label="资产编号" align="center" prop="deviceCode" />
-          <el-table-column label="设备名称" align="center" prop="deviceName" />
-          <el-table-column label="填写内容" align="center" prop="fillContent" />
-          <el-table-column label="所属组织" align="center" prop="orgName" />
-<!--          <el-table-column label="项目部" align="center" prop="proName" />
-          <el-table-column label="小队" align="center" prop="teamName" />-->
-          <el-table-column label="负责人" align="center" prop="dutyName" />
-          <el-table-column
-            label="创建日期"
-            align="center"
-            prop="creDate"
-            :formatter="dateFormatter2"
-            width="180px"
-          />
-          <el-table-column label="操作" align="center" min-width="120px">
-            <template #default="scope">
-              <el-button
-                link
-                type="primary"
-                @click="openForm('update', scope.row.id)"
-                v-hasPermi="['rq:iot-opeation-fill:update']"
-              >
-                编辑
-              </el-button>
-              <el-button
-                link
-                type="danger"
-                @click="handleDelete(scope.row.id)"
-                v-hasPermi="['rq:iot-opeation-fill:delete']"
-              >
-                删除
-              </el-button>
-            </template>
-          </el-table-column>
-        </el-table>
-        <!-- 分页 -->
-        <Pagination
-          :total="total"
-          v-model:page="queryParams.pageNo"
-          v-model:limit="queryParams.pageSize"
-          @pagination="getList"
-        />
-      </ContentWrap>
-
-    </el-col>
-
-    <!-- 表单弹窗：添加/修改 -->
-    <IotOpeationFillForm ref="formRef" @success="getList" :dept="deptInfo"/>
-  </el-row>
+        <div class="form-wrapper">
+          <el-form label-width="120px">
+            <div v-for="(item,index) in attrList" :key="index">
+              <el-form-item :label='item.name' prop="deviceId">
+                <el-input
+                  v-model="item.fillContent" @input="attrList[index].fillContent = $event.target.fillContent"
+                  clearable
+                  style="width: 200px"
+                />
+              </el-form-item>
+            </div>
+            <el-form-item>
+              <el-button type="info" @click="deleteFillInfo">取消</el-button>
+              <el-button type="primary" @click="getFillInfo">确定</el-button>
+            </el-form-item>
+          </el-form>
+        </div>
+
+
+
+      </el-tab-pane>
+    </el-tabs>
+  </ContentWrap>
 
 </template>
 
@@ -131,16 +54,13 @@ defineOptions({ name: 'IotOpeationFill' })
 
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
-
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
 const loading = ref(true) // 列表的加载中
 const list = ref<IotOpeationFillVO[]>([]) // 列表的数据
+const attrList = ref<IotOpeationFillVO[]>([]) // 列表的数据
 const total = ref(0) // 列表的总页数
-let arry1 =[];
-const  cards= [
-    { title: '卡片 1', content: '这是卡片 1 的内容' },
-    { title: '卡片 2', content: '这是卡片 2 的内容' },
-    { title: '卡片 3', content: '这是卡片 3 的内容' }
-  ]
+const arry1 =ref([]);
 const queryParams = reactive({
   pageNo: 1,
   pageSize: 10,
@@ -158,19 +78,11 @@ const queryParams = reactive({
   dutyName: undefined,
   creDate: [],
   createTime: [],
+  deviceCategoryId:1
 })
 const queryFormRef = ref() // 搜索的表单
 const exportLoading = ref(false) // 导出的加载中
 
-let deptInfo = {deptId:'',orgName:''};
-/** 处理部门被点击 */
-const handleDeptNodeClick = async (row) => {
-  queryParams.deptId = row.id
-  queryParams.orgName = row.name;
-  deptInfo.orgName = queryParams.orgName;
-  deptInfo.deptId = queryParams.deptId;
-  await getList()
-}
 
 const formatDescription = async(row, column, cellValue) =>{
   return cellValue.split(',').map(part => `<div>${part}</div>`).join('');
@@ -184,15 +96,21 @@ const getList = async () => {
     const data = await IotOpeationFillApi.getIotOpeationFillPage(queryParams)
     list.value = data;
     list.value.forEach(function (item, index) {
-      arry1.push({deviceName:item.deviceName,deviceCode:item.deviceCode})
+      arry1.value[index] = item;
     });
-    alert(JSON.stringify(arry1))
-    alert(Array.isArray(arry1));
+    queryParams.deviceCategoryId = arry1.value[0].deviceCategoryId
+    queryParams.deptId = arry1.value[0].deptId;
+    queryParams.deviceCode = arry1.value[0].deviceCode;
+    queryParams.deviceName = arry1.value[0].deviceName;
+    queryParams.deviceId = arry1.value[0].deviceId;
+    getAttrList();
   } finally {
     loading.value = false
   }
 }
 
+
+
 /** 搜索按钮操作 */
 const handleQuery = () => {
   queryParams.pageNo = 1
@@ -210,6 +128,56 @@ const formRef = ref()
 const openForm = (type: string, id?: number) => {
   formRef.value.open(type, id)
 }
+const openFill = (deviceCategoryId?:number,deviceId?:number,deptId?:number,deviceName?:string,deviceCode?:string) =>{
+  queryParams.deviceCategoryId = deviceCategoryId;
+  queryParams.deptId = deptId;
+  queryParams.deviceCode = deviceCode;
+  queryParams.deviceName = deviceName;
+  queryParams.deviceId = deviceId;
+  getAttrList();
+}
+
+
+const getAttrList = async () => {
+  loading.value = true
+  try {
+    const data = await IotOpeationFillApi.getAttrs(queryParams)
+    attrList.value = data;
+    attrList.value.forEach(function (item,index){
+      item.deviceCode = queryParams.deviceCode;
+      item.deptId = queryParams.deptId;
+      item.deviceId = queryParams.deviceId;
+      item.deviceCategoryId = queryParams.deviceCategoryId;
+    })
+
+  } finally {
+    loading.value = false
+  }
+}
+/** 获取填写信息保存到后台*/
+const getFillInfo = async () => {
+  try {
+    attrList.value.forEach(function (item,index){
+      item.pointName = item.name;
+    })
+    const data = attrList.value as unknown as IotOpeationFillVO
+
+    await IotOpeationFillApi.insertLog(data)
+    message.success(t('common.createSuccess'))
+    // 发送操作成功的事件
+    emit('success')
+    getList();
+  } finally {
+
+  }
+}
+/**清空填写信息*/
+const deleteFillInfo = () =>{
+  attrList.value.forEach(function (item, index){
+    item.fillContent = '';
+  });
+}
+
 
 /** 删除按钮操作 */
 const handleDelete = async (id: number) => {
@@ -245,3 +213,85 @@ onMounted(() => {
 
 })
 </script>
+<style scoped>
+.back-red{		/* 红色背景 */
+  background-color: red;
+}
+.back-blue{
+  background-color: grey;
+}
+.step-container {
+  display: grid;
+  grid-template-columns: 220px 1fr;
+  gap: 10px;
+  height: 100%;
+  min-height: 600px;
+}
+
+.steps-nav {
+  overflow-y: auto;
+  padding-right: 15px;
+}
+
+.form-wrapper {
+  background: #fff;
+  padding: 30px;
+  border-radius: 8px;
+  box-shadow: 0 2px 12px rgba(0,0,0,0.1);
+}
+
+.navigation-controls {
+  margin-top: 40px;
+  text-align: center;
+}
+
+.custom-label {
+  color: green;
+}
+::v-deep .el-step__icon {
+  background-color: #409eff;
+  color: #fff;
+  border: 0px;
+}
+.step-title-wrapper {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  position: relative;
+  padding-right: 25px;
+}
+
+/* 覆盖步骤条默认样式 */
+:deep(.custom-steps) {
+
+/* 调整头部位置 */
+.el-step__head {
+  top: 3px;
+}
+
+/* 标题容器定位 */
+.el-step__title {
+  display: inline-block;
+  margin-left: 10px;
+  padding-right: 0;
+}
+
+/* 步骤连接线 */
+.el-step__line {
+  left: 11px;
+  background-color: #ebeef5;
+}
+
+/* 当前步骤样式 */
+.is-process .title-text {
+  font-weight: 600;
+  color: #409eff;
+}
+
+/* 完成状态图标 */
+.is-finish .tip-icon {
+  color: #67c23a;
+}
+
+}
+</style>