sop通知规则页面绘制，新增功能参数定义并从字典中获取部分内容

src/api/sop/notificationRules.ts

@@ -0,0 +1,53 @@
+import request from '@/config/axios'
+
+export interface notifyConfigSaveReqVO {
+  id:number,
+  sopId:number,
+  rule:string,
+  type:number,
+  notifyTimeType:number,
+  notifyTime:number,
+  workstationId:number,
+  status:number,
+}
+
+export interface PageParam {
+  pageNo: number
+  pageSize: number
+  id?:number
+  sopId?: number
+}
+
+
+//创建通知规则
+export const insertNotifyConfig=async(data:notifyConfigSaveReqVO)=>{
+  return await request.post({url:'/iscs/notify-config/insertNotifyConfig',data})
+}
+
+
+//修改通知规则
+export const updateNotifyConfig=async(data:notifyConfigSaveReqVO)=>{
+  return await request.put({url:'/iscs/notify-config/updateNotifyConfig',data})
+}
+
+
+//获得通知规则分页
+export const getNotifyConfigPage=async(parmas:PageParam)=>{
+  return await request.get({url:'/iscs/notify-config/getNotifyConfigPage',parmas})
+}
+
+
+//批量删除通知规则
+export const deleteNotifyConfigList=async(ids:number)=>{
+  return await request.delete({url:'/iscs/notify-config/deleteNotifyConfigList='+ids})
+}
+
+//获得通知规则
+export const selectNotifyConfigById=async(parmas:PageParam)=>{
+  return await request.get({url:'/iscs/notify-config/selectNotifyConfigById',parmas})
+}
+
+//获得工作流程list
+export const getSopWorkflowStepList=async(parmas:PageParam)=>{
+  return await request.get({url:'/iscs/notify-config/getSopWorkflowStepList',parmas})
+}

src/router/modules/remaining.ts

@@ -309,6 +309,20 @@ const remainingRouter: AppRouteRecordRaw[] = [
           activeMenu: '/sopm/sop'
         }
       },
+      {
+        path: 'sopm/sop/NotificationUpdate',
+        component: () => import('@/views/sopm/sop/NotificationUpdate.vue'),
+        name: 'NotificationUpdate',
+        meta: {
+          title: 'sop通知规则新增修改',
+          noCache: true,
+          noTagsView: true,
+          hidden: true,
+          canTo: true,
+          icon: 'ep:view',
+          activeMenu: '/sopm/sop'
+        }
+      },
     ]
   },
   {

src/utils/dict.ts

@@ -248,7 +248,7 @@ export enum DICT_TYPE {
   //============== ISCS - 新增模块 =====================
   MES_MACHINERY_STATUS = 'mes_machinery_status',
   POWER_TYPE = 'power_type',
-  SYS_STEP_CONFIRMTYPE='sys_step_confirmType',
+  SYS_STEP_CONFIRMTYPE = 'sys_step_confirmType',
   POINT_TYPE = 'point_type',
   SOP_STATUS = 'sop_status',
   SOP_TYPE = 'sop_type',
@@ -282,7 +282,7 @@ export enum DICT_TYPE {
   INVENTORY_TYPE = 'Inventory_type',
   MEASURE = 'measure',
   MAP_TYPE = 'map_type',
-  POINT_STATUS='point_status',
+  POINT_STATUS = 'point_status',
   CLASSIFICATION_OF_EXCEPTIONS = 'classification_of_exceptions',
   TYPE_OF_EXCEPTION = 'type_of_exception',
   SEVERITY_LEVEL = 'severity_level',
@@ -302,8 +302,13 @@ export enum DICT_TYPE {
   ISOCCUPIED_STATUS = 'isOccupied_status',
   SLOT_TYPE = 'slot_type',
   SLOT_STATUS = 'slot_status',
-  HOLIDAY_TYPE='holiday_type',
-  HOLIDAY_UNIT='holiday_unit',
-  SOP_PLAN_NOWORKING='sop_plan_noworking',
-  SOP_PLAN_TERMINATE_TYPE='sop_plan_terminate_type'
+  HOLIDAY_TYPE = 'holiday_type',
+  HOLIDAY_UNIT = 'holiday_unit',
+  SOP_PLAN_NOWORKING = 'sop_plan_noworking',
+  SOP_PLAN_TERMINATE_TYPE = 'sop_plan_terminate_type',
+  NOTICE_RULES_TYPE = 'notice_rules_type',
+  JOB_NOTICE_RULES = 'job_notice_rules',
+  ACTION_NOTICE_RULES = 'action_notice_rules',
+  ADVANCE_NOTICE_RULES = 'advance_notice_rules',
+  NOTICE_TIME_TYPE = 'notice_time_type'
 }

src/views/sopm/sop/NotificationRules.vue

@@ -1,70 +1,114 @@
 <template>
-<ContentWrap>
-  <!--    顶部标题-->
-  <div class="topTitle">
-    <span class="tab-title">执行计划：{{route.query.sopName}}</span>
-    <div class="set-btn" @click="goBack">
-      <img src="../../../assets/images/返回.png" alt="" />
-      返回
+  <ContentWrap>
+    <!--    顶部标题-->
+    <div class="topTitle">
+      <span class="tab-title">执行计划：{{ route.query.sopName }}</span>
+      <div class="set-btn" @click="goBack">
+        <img src="../../../assets/images/返回.png" alt="" />
+        返回
+      </div>
     </div>
-  </div>
-</ContentWrap>
+  </ContentWrap>
 
-<!--  <ContentWrap>-->
-<!--    <div class="tab-header">-->
-<!--      <span class="tab-title">通知设置</span>-->
-<!--    </div>-->
-<!--    <div class="noticeContent">-->
-<!--    <p>启用通知：-->
-<!--      <el-switch-->
-<!--      v-model="NotificationStatus"-->
-<!--      size="small"-->
-<!--      :active-value="0"-->
-<!--      :inactive-value="1"-->
-<!--    /></p>-->
-<!--    <section>-->
-<!--      <el-button-->
-<!--        type="primary"-->
-<!--        plain-->
-<!--        @click="openForm('create')"-->
-<!--        v-hasPermi="['iscs:sop:create']"-->
-<!--      >-->
-<!--        <Icon icon="ep:plus" class="mr-5px" />-->
-<!--        新增-->
-<!--      </el-button>-->
-<!--      <el-button-->
-<!--        type="danger"-->
-<!--        plain-->
-<!--        :disabled="multiple"-->
-<!--        @click="handleDelete()"-->
-<!--        v-hasPermi="['iscs:sop:delete']"-->
-<!--      >-->
-<!--        <Icon icon="ep:delete" class="mr-5px" />-->
-<!--        批量删除-->
-<!--      </el-button>-->
-<!--    </section>-->
-
-<!--    </div>-->
-<!--  </ContentWrap>-->
+  <ContentWrap>
+    <div class="tab-header">
+      <span class="tab-title">通知设置</span>
+    </div>
+    <div class="noticeContent">
+      <p
+        >启用通知：
+        <el-switch
+          v-model="NotificationStatus"
+          size="small"
+          :active-value="0"
+          :inactive-value="1"
+        />
+      </p>
+      <section class="noticebtn">
+        <el-button
+          type="primary"
+          plain
+          @click="openForm('create')"
+          v-hasPermi="['iscs:sop:create']"
+        >
+          <Icon icon="ep:plus" class="mr-5px" />
+          新增
+        </el-button>
+        <el-button
+          type="danger"
+          plain
+          :disabled="multiple"
+          @click="handleDelete()"
+          v-hasPermi="['iscs:sop:delete']"
+        >
+          <Icon icon="ep:delete" class="mr-5px" />
+          批量删除
+        </el-button>
+      </section>
+      <el-table
+        v-loading="loading"
+        border
+        :data="noticeList"
+        @selection-change="handleSelectionChange"
+        style="width: 100%"
+      >
+        <el-table-column type="selection" width="50" align="center" fixed />
+        <el-table-column label="规则" prop="machineryName" align="center" width="200" />
+        <el-table-column label="通知规则种类" prop="machineryName" align="center" width="200" />
+        <el-table-column label="通知时间" prop="machineryName" align="center" width="200" />
+        <el-table-column label="通知区域" prop="machineryName" align="center" width="200" />
+        <el-table-column label="通知角色与通知模板" prop="machineryName" align="center" min-width="200" />
+
+<!--        <el-table-column label="启用通知" align="center" width="100">-->
+<!--          <template #default="scope">-->
+<!--            <el-switch-->
+<!--              :model-value="scope.row.enableNotifications"-->
+<!--              :active-value="1"-->
+<!--              :inactive-value="0"-->
+<!--              @update:modelValue="(val) => handleNotificationsChange(scope.row, val)"-->
+<!--            />-->
+<!--          </template>-->
+<!--        </el-table-column>-->
+        <el-table-column label="操作" align="center" width="550" fixed="right">
+          <template #default="{ row }">
+            <el-button
+              link
+              :icon="Edit"
+              type="primary"
+              @click="openForm('update', row.id)"
+              v-hasPermi="['iscs:sop:update']"
+            >
+              修改
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+  </ContentWrap>
 </template>
 
 <script setup lang="ts">
-
+import { Edit } from '@element-plus/icons-vue'
 
 const router = useRouter()
 const route = useRoute()
-const NotificationStatus=ref('')
+const NotificationStatus = ref('')
 const ids = ref<number[]>([]) // 选中的数据
 const multiple = ref(true) // 非多个禁用
-
+const noticeList=ref([])
+const loading = ref(false) // 列表的加载中
 // 返回
 const goBack = () => {
   router.push('/sopm/sop')
 }
 
 /** 添加/修改/查看操作 */
-const openForm =(type:string)=>{
-  if(type=='create'){
+const openForm = (type: string) => {
+  if (type == 'create') {
+    router.push({
+      name: 'NotificationUpdate',
+      // query: { id: id, type: 'create' }
+    })
     console.log('新增了')
   }
 }
@@ -88,18 +132,14 @@ const handleSelectionChange = (selection: any[]) => {
   ids.value = selection.map((item) => item.id)
   multiple.value = !selection.length
 }
-
-
-
-
 </script>
 
-
 <style scoped lang="scss">
 .topTitle {
   width: 100%;
   line-height: 40px;
 }
+
 .set-btn {
   width: 60px;
   height: 30px;
@@ -123,10 +163,17 @@ const handleSelectionChange = (selection: any[]) => {
   padding: 12px 20px;
   border-radius: 4px 4px 0 0;
 }
-.noticeContent{
+
+.noticeContent {
   width: 100%;
   height: 100%;
   padding: 10px 30px;
-  background: blue;
+  //background: blue;
+  .noticebtn {
+    width: 100%;
+    line-height: 60px;
+    margin: 10px 0;
+    //background: green;
+  }
 }
 </style>

src/views/sopm/sop/NotificationUpdate.vue

@@ -0,0 +1,245 @@
+<template>
+  <ContentWrap>
+    <div class="tab-header">
+      <span class="tab-title">添加规则</span>
+    </div>
+    <div class="checkContent">
+      <section>
+        <span>通知规则种类：</span>
+        <el-select v-model="noticeData.type" placeholder="请选择" style="width: 260px">
+          <el-option
+            v-for="dict in getStrDictOptions(DICT_TYPE.NOTICE_RULES_TYPE)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </section>
+      <section>
+        <span>规则：</span>
+        <el-select v-model="noticeData.rule" placeholder="请选择" style="width: 260px">
+<!--          作业通知-->
+          <el-option
+            v-show="noticeData.type==1"
+            v-for="dict in getStrDictOptions(DICT_TYPE.JOB_NOTICE_RULES)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+<!--          操作通知-->
+          <el-option
+            v-show="noticeData.type==3"
+            v-for="dict in getStrDictOptions(DICT_TYPE. ACTION_NOTICE_RULES)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+<!--          提前通知-->
+          <el-option
+            v-show="noticeData.type==0"
+            v-for="dict in getStrDictOptions(DICT_TYPE.ADVANCE_NOTICE_RULES)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+<!--          步骤通知-->
+          <el-option label="Restaurant" value="1" v-show="noticeData.type==2"/>
+        </el-select>
+      </section>
+      <section>
+        <span>通知时间：</span>
+        <el-select v-model="noticeData.notifyTimeType" placeholder="请选择" style="width: 260px">
+          <el-option
+            v-for="dict in getStrDictOptions(DICT_TYPE.NOTICE_TIME_TYPE)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+        <span v-if="noticeData.notifyTimeType !== undefined &&
+        noticeData.notifyTimeType !== null &&
+        (noticeData.notifyTimeType == 0 || noticeData.notifyTimeType == 2)">
+            <el-input-number
+              v-model="noticeData.notifyTime"
+              :min="1"
+              :max="10"
+              class="mx-4"
+              controls-position="right"
+            />天
+            <el-input-number
+              v-model="num1"
+              :min="1"
+              :max="10"
+              class="mx-4"
+              controls-position="right"
+            />时
+            <el-input-number
+              v-model="num1"
+              :min="1"
+              :max="10"
+              class="mx-4"
+              controls-position="right"
+            />分
+            <el-input-number
+              v-model="num1"
+              :min="1"
+              :max="10"
+              class="mx-4"
+              controls-position="right"
+            />秒
+        </span>
+      </section>
+      <section>
+        <span>通知区域：</span>
+        <el-select v-model="noticeData.workstationId" placeholder="请选择" style="width: 260px">
+          <el-option label="Restaurant" value="1" />
+          <el-option label="Order No." value="2" />
+          <el-option label="Tel" value="3" />
+        </el-select>
+      </section>
+    </div>
+  </ContentWrap>
+<!--  通知角色与通知模板-->
+  <ContentWrap>
+    <div class="tab-header">
+      <span class="tab-title">通知角色与通知模板</span>
+    </div>
+
+    <div class="tableCon">
+      <p>
+        <span>显示：</span>
+        <el-radio-group v-model="noticeData.status">
+          <el-radio label="showAll" :value="0">显示全部</el-radio>
+          <el-radio label="showNotice" :value="1">仅显示通知</el-radio>
+        </el-radio-group>
+      </p>
+      <el-table :data="tableData" border style="width: 80%">
+        <el-table-column prop="planDay" label="角色" width="180" />
+        <el-table-column label="是否通知" align="center" width="100">
+          <template #default="scope">
+            <el-switch
+              :model-value="scope.row.enableNotifications"
+              :active-value="1"
+              :inactive-value="0"
+              @update:modelValue="(val) => handleNotificationsChange(scope.row, val)"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column label="仅通知当事人" align="center" width="110">
+          <template #default="scope">
+            <el-switch
+              :model-value="scope.row.enableNotifications"
+              :active-value="1"
+              :inactive-value="0"
+              @update:modelValue="(val) => handleNotificationsChange(scope.row, val)"
+            />
+          </template>
+        </el-table-column>
+
+        <el-table-column label="通知模板" align="center">
+          <template #default="scope">
+            <span>{{scope.row.enableNotifications}}</span>
+            <i>更换</i>
+            <i>选择</i>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="btnstyle">
+      <el-button type="primary" plain @click="submit"
+      >确认</el-button
+      >
+      <el-button plain @click="goBack">取消</el-button>
+    </div>
+  </ContentWrap>
+</template>
+
+<script setup lang="ts">
+import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
+const router = useRouter()
+const route = useRoute()
+const noticeData=reactive({
+  type:'',
+  rule:'',
+  notifyTimeType:'',
+  notifyTime:'',
+  workstationId:'',
+  status:1,
+})
+const isVisible=ref(2)
+const num1 = 5
+const tableData=ref([])
+
+
+// 返回
+const goBack=()=>{
+  router.go(-1)
+}
+
+const submit=()=>{
+  console.log('hhh')
+}
+// 是否开启通知
+const handleNotificationsChange = async (row, val) => {
+  console.log(val,row)
+  // if (!isInitialized.value) return
+  //
+  // const originalValue = row.enableNotifications
+  //
+  // try {
+  //   // const data = {
+  //   //   ...row,
+  //   //   enableNotifications: val
+  //   // }
+  //   const data = {
+  //     id: row.id,
+  //     enableNotifications: val
+  //   }
+  //   console.log(data,'是什么数据')
+  //   await SopApi.updateSopEnableNotification(data)
+  //   ElMessage.success(val == 1 ? '已开启' : '已关闭')
+  //
+  //   // 成功后更新值（防止 UI 不更新）
+  //   row.enableNotifications = val
+  // } catch (err) {
+  //   // 接口失败，回滚原始值
+  //   row.enableNotifications = originalValue
+  //
+  //   // 强制刷新 UI
+  //   await nextTick()
+
+    // 提示错误
+    // ElMessage.error('状态更新失败，请重试')
+  // }
+}
+</script>
+
+<style scoped lang="scss">
+.tab-header {
+  background-color: #f5f7fa;
+  border-bottom: 1px solid #dcdfe6;
+  padding: 12px 20px;
+  border-radius: 4px 4px 0 0;
+}
+.checkContent{
+  width: 95%;
+  height: 200px;
+  margin: 10px auto;
+  section{
+    width: 100%;
+    height: 49px;
+  }
+}
+.tableCon{
+  width: 95%;
+  min-height:300px;
+  margin:auto;
+  p{
+    margin: 20px 0;
+  }
+
+}
+.btnstyle {
+  text-align: right;
+}
+</style>