Merge branch 'cc-dev' into 'dev'

灾害预警完成

See merge request product-group-fe/sfy-safety-group/sfy-safety!17

src/App.vue

@@ -1,5 +1,5 @@
 <template>
-  <div id="app" :style="{ backgroundImage: `url(${backgroundImg})` }">
+  <div id="app">
     <Nav />
     <div class="content">
       <router-view />
@@ -8,13 +8,9 @@
 </template>
 
 <script setup lang="ts">
-  import { computed } from 'vue';
   import { useRoute } from 'vue-router';
   import Nav from '@/components/Nav.vue';
   const route = useRoute();
-  const backgroundImg = computed(() => {
-    return route.path === '/home' ? '/src/assets/images/home/home-bg@1X.png' : '';
-  });
 </script>
 
 <style scoped lang="scss">
@@ -23,9 +19,6 @@
     flex-direction: column;
     width: 100vw;
     height: 100vh;
-    background-position: center center;
-    background-repeat: no-repeat;
-    background-size: cover;
   }
   .content {
     flex: 1;

src/components/Nav.vue

@@ -84,8 +84,10 @@
     width: 100%;
     height: 78cpx;
     background: url('assets/images/home/nav-bg@1X.png') no-repeat center center / cover;
+    z-index: 2;
     &__nav {
       @include flex-center;
+      gap: 25cpx;
       height: 100%;
       margin-left: 32cpx;
       &--item {
@@ -112,7 +114,7 @@
   }
   .platform-name {
     font-size: 18cpx;
-    font-weight: 600;
+    font-weight: 550;
     margin-left: 9cpx;
   }
   .platform__right {

src/constant/nav.ts

@@ -45,26 +45,12 @@ export const NAV_LIST = [
     name: 'DisasterPrevention',
   },
   {
-    name: '',
+    name: '应急管理',
     path: '',
     meta: {
       title: '应急管理',
     },
   },
-  {
-    name: '',
-    path: '',
-    meta: {
-      title: '智慧视觉',
-    },
-  },
-  {
-    name: '',
-    path: '',
-    meta: {
-      title: '物联集成',
-    },
-  },
   {
     name: 'Platform',
     path: '/platform',

src/main.scss

@@ -8,11 +8,10 @@
   box-sizing: border-box;
   &::-webkit-scrollbar {
     position: relative;
-    width: 3px;
+    width: 0;
   }
   &::-webkit-scrollbar-thumb {
-    background-color: rgba(155, 155, 155, 0.5);
-    border-radius: 4px;
+    background-color: transparent;
   }
 }
 html {

src/router/full-routes.ts

@@ -28,7 +28,7 @@ export const HOME_PAGE: RouteRecordString = {
   component: '/home/PageHome',
   meta: {
     icon: '',
-    title: '公司主页',
+    title: '首页',
   },
 };
 

src/views/disaster/WorkRecord.md

@@ -26,4 +26,7 @@
 ### 预防检查模块
 - [x] 任务管理静态页面完成
 - [x] 任务模板页面完成
-- [ ] 任务执行页面完成
+- [ ] 任务执行页面完成
+
+### 25/5/20
+### 完成灾害预警 准备提测

src/views/disaster/constant/index.ts

@@ -139,19 +139,19 @@ export const DISASTER_TYPE = [
 export const DISASTER_LEVEL = [
   {
     label: 'IV级/一般',
-    value: "1",
+    value: '1',
   },
   {
     label: 'III级/较重',
-    value: "2",
+    value: '2',
   },
   {
     label: 'II级/严重',
-    value: "3",
+    value: '3',
   },
   {
     label: 'I级/特别严重',
-    value: "4",
+    value: '4',
   },
 ];
 
@@ -159,3 +159,9 @@ export const DISASTER_LEVEL = [
 export const BIZ_TYPE = {
   ATTACHMENT: 'ATTACHMENT',
 };
+
+//管理权限
+export const DISASTER_PERMISSIONS = {
+  WARNING_INFO: 'disaster_business_module:warn_info',
+  DEFENSE_NOTICE: 'disaster_business_module:defense_notice',
+};

src/views/disaster/disaster-warning/PageDefenseNotice.vue

@@ -11,6 +11,7 @@
             class="disaster-precaution__header--button"
             :icon="Plus"
             @click="handleCreateDefenseNotice"
+            v-if="defenseNoticePermissions"
             >创建灾害防御通知
           </el-button>
           <Search
@@ -48,7 +49,7 @@
           <template #action="scope">
             <ActionButton
               text="编辑"
-              v-if="scope.row.effectState === ACTIVE_STATUS.NOT_EFFECTIVE"
+              v-if="scope.row.effectState === ACTIVE_STATUS.NOT_EFFECTIVE && defenseNoticePermissions"
               @click="handleEditDefenseNotice(scope.row.id)"
             />
             <ActionButton text="查看" @click="handleViewDefenseNotice(scope.row.id)" />
@@ -57,7 +58,7 @@
               :popconfirm="{
                 title: '确定要发布?',
               }"
-              v-if="scope.row.effectState === ACTIVE_STATUS.NOT_EFFECTIVE"
+              v-if="scope.row.effectState === ACTIVE_STATUS.NOT_EFFECTIVE && defenseNoticePermissions"
               @confirm="handlePublishDefenseNotice(scope.row.id, scope.row.effectState)"
             />
             <ActionButton
@@ -65,7 +66,7 @@
               :popconfirm="{
                 title: '确定要撤回?',
               }"
-              v-else-if="scope.row.effectState === ACTIVE_STATUS.ACTIVE"
+              v-else-if="scope.row.effectState === ACTIVE_STATUS.ACTIVE && defenseNoticePermissions"
               @confirm="handlePublishDefenseNotice(scope.row.id, scope.row.effectState)"
             />
             <ActionButton
@@ -74,6 +75,7 @@
                 title: '确定要删除?',
               }"
               @confirm="handleDeleteDefenseNotice(scope.row.id)"
+              v-if="defenseNoticePermissions"
             />
           </template>
         </BasicTable>
@@ -92,13 +94,28 @@
   import { getDefenseNoticeList, deleteDefenseNoticeItem } from '@/api/disaster-warning';
   import type { DefenseNoticeListResponse, DefenseNoticeListQuery } from '@/types/disaster-warning';
   import type { QueryPageRequest } from '@/types/disaster';
-  import { ACTIVE_STATUS, ACTIVE_STATUS_COLOR, ACTIVE_STATUS_MAP } from '@/views/disaster/constant';
+  import {
+    ACTIVE_STATUS,
+    ACTIVE_STATUS_COLOR,
+    ACTIVE_STATUS_MAP,
+    DISASTER_PERMISSIONS,
+  } from '@/views/disaster/constant';
   import { PUSH_STATUS_MAP, PUSH_STATUS } from './src/constant';
-  import { DEFENSE_NOTICE_SEARCH_CONFIG, TABLE_OPTIONS, DEFENSE_NOTICE_TABLE_COLUMNS } from './src/config';
+  import {
+    DEFENSE_NOTICE_SEARCH_CONFIG,
+    TABLE_OPTIONS,
+    DEFENSE_NOTICE_TABLE_COLUMNS,
+    TABLE_HEIGHT_DEFAULT,
+    TABLE_HEIGHT_PREMISSION,
+  } from './src/config';
   import { formatDisasterLevel, formatDisasterType } from '@/views/disaster/utils/formatTable';
   import { useRouter } from 'vue-router';
   import { ElMessage } from 'element-plus';
   import { publishDefenseNoticeItem } from '@/api/disaster-warning';
+  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
+
+  const { permissions } = useUserInfoHook();
+  const defenseNoticePermissions = ref<Boolean>(false);
 
   const tableData = ref<DefenseNoticeListResponse[]>([]);
   const router = useRouter();
@@ -177,6 +194,10 @@
   };
   onMounted(() => {
     getTableData();
+    defenseNoticePermissions.value = Boolean(
+      permissions.find((item: { code: string }) => item.code === DISASTER_PERMISSIONS.DEFENSE_NOTICE),
+    );
+    tableConfig.height = defenseNoticePermissions.value ? TABLE_HEIGHT_PREMISSION : TABLE_HEIGHT_DEFAULT;
   });
 </script>
 

src/views/disaster/disaster-warning/PageWarningInfo.vue

@@ -11,6 +11,7 @@
             class="disaster-precaution__header--button"
             :icon="Plus"
             @click="handleCreateWarningInfo"
+            v-if="warningInfoPermissions"
           >
             创建灾害预警信息
           </el-button>
@@ -94,10 +95,22 @@
   import useTableConfig from '@/hooks/useTableConfigHook';
   import { getWarningInfoList } from '@/api/disaster-warning';
   import type { WarningInfoListResponse } from '@/types/disaster-warning';
-  import { ACTIVE_STATUS, ACTIVE_STATUS_COLOR, ACTIVE_STATUS_MAP } from '@/views/disaster/constant';
+  import {
+    ACTIVE_STATUS,
+    ACTIVE_STATUS_COLOR,
+    ACTIVE_STATUS_MAP,
+    DISASTER_PERMISSIONS,
+  } from '@/views/disaster/constant';
   import PlaceHolderWeather from './src/images/placeholder-weather@1X.png';
   import { PUSH_STATUS_MAP, PUSH_STATUS, WEATHER_DISASTER_ALERT_TYPE } from './src/constant';
-  import { WARNING_INFO_SEARCH_CONFIG, TABLE_OPTIONS, WARNING_INFO_TABLE_COLUMNS } from './src/config';
+  import {
+    WARNING_INFO_SEARCH_CONFIG,
+    TABLE_OPTIONS,
+    WARNING_INFO_TABLE_COLUMNS_DEFAULT,
+    WARNING_INFO_TABLE_COLUMNS_PERMISSION,
+    TABLE_HEIGHT_DEFAULT,
+    TABLE_HEIGHT_PREMISSION,
+  } from './src/config';
   import { useRouter } from 'vue-router';
   import type { QueryPageRequest } from '@/types/disaster';
   import type { WarningInfoListQuery } from '@/types/disaster-warning';
@@ -105,6 +118,9 @@
   import { formatDisasterType } from './src/util';
   import { deleteWarningInfoItem, publishWarningInfoItem } from '@/api/disaster-warning';
   import { ElMessage } from 'element-plus';
+  import { useUserInfoHook } from '@/views/disaster/hooks/userInfo';
+
+  const { permissions } = useUserInfoHook();
 
   const router = useRouter();
   const searchData = reactive({
@@ -146,7 +162,8 @@
     ElMessage.success('删除成功');
   };
   const tableData = ref<WarningInfoListResponse[]>([]);
-  const { tableConfig, pagination } = useTableConfig(WARNING_INFO_TABLE_COLUMNS, TABLE_OPTIONS);
+  const warningInfoPermissions = ref<Boolean>(false);
+  const { tableConfig, pagination } = useTableConfig(WARNING_INFO_TABLE_COLUMNS_DEFAULT, TABLE_OPTIONS);
   let wanrningInfoListQuery: QueryPageRequest<WarningInfoListQuery> = {
     pageNumber: pagination.pageNumber,
     pageSize: pagination.pageSize,
@@ -179,6 +196,13 @@
   };
   onMounted(() => {
     getTableData();
+    warningInfoPermissions.value = Boolean(
+      permissions.find((item: { code: string }) => item.code === DISASTER_PERMISSIONS.WARNING_INFO),
+    );
+    tableConfig.height = warningInfoPermissions.value ? TABLE_HEIGHT_PREMISSION : TABLE_HEIGHT_DEFAULT;
+    if (warningInfoPermissions.value) {
+      tableConfig.columns = WARNING_INFO_TABLE_COLUMNS_PERMISSION;
+    }
   });
 </script>
 

src/views/disaster/disaster-warning/src/config/index.ts

@@ -1,5 +1,12 @@
 import { WARNING_INFO_SEARCH_CONFIG, DEFENSE_NOTICE_SEARCH_CONFIG } from './search';
-import { TABLE_OPTIONS, WARNING_INFO_TABLE_COLUMNS, DEFENSE_NOTICE_TABLE_COLUMNS } from './table';
+import {
+  TABLE_OPTIONS,
+  WARNING_INFO_TABLE_COLUMNS_DEFAULT,
+  WARNING_INFO_TABLE_COLUMNS_PERMISSION,
+  DEFENSE_NOTICE_TABLE_COLUMNS,
+  TABLE_HEIGHT_DEFAULT,
+  TABLE_HEIGHT_PREMISSION,
+} from './table';
 import {
   WARNING_INFO_FROM_CONFIG,
   DEFENSE_NOTICE_FROM_CONFIG,
@@ -12,8 +19,11 @@ import {
 export {
   WARNING_INFO_SEARCH_CONFIG,
   DEFENSE_NOTICE_SEARCH_CONFIG,
+  TABLE_HEIGHT_DEFAULT,
+  TABLE_HEIGHT_PREMISSION,
   TABLE_OPTIONS,
-  WARNING_INFO_TABLE_COLUMNS,
+  WARNING_INFO_TABLE_COLUMNS_DEFAULT,
+  WARNING_INFO_TABLE_COLUMNS_PERMISSION,
   DEFENSE_NOTICE_TABLE_COLUMNS,
   WARNING_INFO_FROM_CONFIG,
   DEFENSE_NOTICE_FROM_CONFIG,

src/views/disaster/disaster-warning/src/config/table.ts

@@ -2,10 +2,12 @@
  * 灾害预警信息表格配置
  */
 import type { TableColumnProps } from '@/types/basic-table';
+
+export const TABLE_HEIGHT_DEFAULT = 'calc(70vh - 20px)';
+export const TABLE_HEIGHT_PREMISSION = 'calc(65vh - 20px)';
 // 基础表格样式配置
 export const TABLE_OPTIONS = {
   emptyText: '暂无数据',
-  height: '60vh',
   loading: true,
   stripe: true,
 };
@@ -54,7 +56,7 @@ const BASIC_TABLE_COLUMNS = {
 };
 
 // 预警信息表格列配置
-export const WARNING_INFO_TABLE_COLUMNS: TableColumnProps[] = [
+export const WARNING_INFO_TABLE_COLUMNS_DEFAULT: TableColumnProps[] = [
   {
     prop: 'warningIcon',
     label: '预警图标',
@@ -78,6 +80,10 @@ export const WARNING_INFO_TABLE_COLUMNS: TableColumnProps[] = [
   BASIC_TABLE_COLUMNS.ACTIVE_STATUS,
   BASIC_TABLE_COLUMNS.PUBLISH_TIME,
   BASIC_TABLE_COLUMNS.PUSH_STATUS,
+];
+
+export const WARNING_INFO_TABLE_COLUMNS_PERMISSION: TableColumnProps[] = [
+  ...WARNING_INFO_TABLE_COLUMNS_DEFAULT,
   BASIC_TABLE_COLUMNS.ACTION,
 ];
 

src/views/disaster/hooks/userInfo.ts

@@ -9,7 +9,9 @@ const { getUserInfo } = storeToRefs(userStore);
 export const useUserInfoHook = () => {
   const userInfo = getUserInfo.value;
   const realname = userInfo.realname;
+  const permissions = userInfo.permissions;
   return {
     realname,
+    permissions,
   };
 };

src/views/home/PageHome.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="container home-container">
     <img :src="IntroductionWords" alt="公司标语" class="introduction-words" />
+    <section class="home-bg" />
     <section class="introduction-card-section">
       <IntroductionCard />
     </section>
@@ -17,21 +18,22 @@
     position: relative;
     display: flex;
     justify-content: center;
+    flex-direction: column;
   }
   .introduction-words {
     position: absolute;
-    left: 339cpx;
-    top: 72cpx;
-    width: 290cpx;
+    left: 405cpx;
+    top: 30cpx;
+    width: 265cpx;
+  }
+  .home-bg {
+    width: 100%;
+    height: 510cpx;
+    background: url('assets/images/home/home-bg@1X.png') no-repeat center center / cover;
   }
   .introduction-card-section {
-    display: flex;
-    justify-content: space-between;
-    position: absolute;
-    left: 0;
-    top: 480cpx;
     width: 100%;
-    height: 400cpx;
-    padding: 0 100cpx;
+    flex: 1;
+    padding: 26cpx 20cpx 57cpx 20cpx;
   }
 </style>

src/views/home/src/components/IntroductionCard.vue

@@ -1,14 +1,17 @@
 <template>
-  <div
-    class="introduction-card"
-    v-for="item in COMPANY_INTRODUCTION_CARD_LIST"
-    :key="item.title"
-    :style="{ backgroundImage: `url(${item.backgroundImg})` }"
-  >
-    <div class="introduction-card__title">{{ item.title }}</div>
-    <div class="introduction-card__content">
-      <div class="introduction-card__content-item" v-for="content in item.content" :key="content">
-        {{ content }}
+  <div class="introduction-card-container">
+    <div class="introduction-card" v-for="item in COMPANY_INTRODUCTION_CARD_LIST" :key="item.title">
+      <div class="introduction-card__header">
+        <img :src="item.icon" />
+        <p>{{ item.title }}</p>
+      </div>
+      <div class="introduction-card__content">
+        <section class="section-content">
+          <p v-for="content in item.leftContent" :key="content">{{ content }}</p>
+        </section>
+        <section class="section-content">
+          <p v-for="content in item.rightContent" :key="content">{{ content }}</p>
+        </section>
       </div>
     </div>
   </div>
@@ -18,25 +21,41 @@
 </script>
 
 <style lang="scss" scoped>
-  .introduction-card {
+  .introduction-card-container {
+    display: flex;
+    justify-content: space-between;
     width: 100%;
     height: 100%;
-    padding: 35cpx 55cpx;
-    background-position: center center;
-    background-repeat: no-repeat;
-    background-size: cover;
-    &__title {
-      font-size: 32cpx;
-      font-weight: 600;
+  }
+  .introduction-card {
+    width: 361cpx;
+    height: 407cpx;
+    padding: 40cpx 34cpx 0 34cpx;
+    background-color: $white-color;
+    border-radius: 5cpx;
+    &__header {
+      @include flex-center;
+      flex-direction: column;
+      gap: 14cpx;
+      font-weight: 550;
+      font-size: 24cpx;
       color: #333;
-      margin-bottom: 20cpx;
+      img {
+        width: 100cpx;
+        height: 100cpx;
+      }
     }
     &__content {
       display: flex;
-      flex-direction: column;
-      gap: 10cpx;
+      justify-content: space-between;
       font-size: 18cpx;
       color: #666;
     }
   }
+  .section-content {
+    display: flex;
+    flex-direction: column;
+    gap: 17cpx;
+    margin-top: 32cpx;
+  }
 </style>

src/views/home/src/constant.ts

@@ -1,43 +1,40 @@
 /**
  * @description 公司介绍卡片常量
  */
-import productionSafetyBg from './images/production-safety@1X.png';
-import trafficSafetyBg from './images/traffic-safety@1X.png';
-import securityBg from './images/defend-secrecy@1X.png';
-import disasterPreventionBg from './images/disaster-prevention@1X.png';
-import emergencyManagementBg from './images/emergency-management@1X.png';
+import productionSafetyIcon from './images/production-safety@1X.png';
+import trafficSafetyIcon from './images/traffic-safety@1X.png';
+import securityIcon from './images/defend-secrecy@1X.png';
+import disasterPreventionIcon from './images/disaster-prevention@1X.png';
+import emergencyManagementIcon from './images/emergency-management@1X.png';
 export const COMPANY_INTRODUCTION_CARD_LIST = [
   {
     title: '生产安全',
-    content: [
-      '生产安全体系',
-      '安全责任落实',
-      '安全教育培训',
-      '风险识别与管控',
-      '隐患的排查与治理',
-      '安全奖惩与考核',
-      '安全文化',
-    ],
-    backgroundImg: productionSafetyBg,
+    leftContent: ['生产安全体系', '安全责任落实', '安全教育培训'],
+    rightContent: ['风险识别与管控', '隐患的排查与治理', '安全奖惩与考核', '安全文化'],
+    icon: productionSafetyIcon,
   },
   {
     title: '交通安全',
-    content: ['管理规定', '交通违规管理', '交通事故管理'],
-    backgroundImg: trafficSafetyBg,
+    leftContent: ['交通管理规定', '交通违规管理'],
+    rightContent: ['交通事故管理'],
+    icon: trafficSafetyIcon,
   },
   {
     title: '保卫保密',
-    content: ['保密要害部门(部位)安全', '治安重点部位安全监控', '人员管理', '门禁管理', '车辆管理'],
-    backgroundImg: securityBg,
+    leftContent: ['保密要害部门(部位)安全', '治安重点部位安全监控', '人员管理'],
+    rightContent: ['门禁管理', '车辆管理'],
+    icon: securityIcon,
   },
   {
     title: '灾害防范',
-    content: ['灾害监测', '灾害预警', '灾害预防', '灾害风险点查看', '灾害处置记录'],
-    backgroundImg: disasterPreventionBg,
+    leftContent: ['灾害监测', '灾害预警', '灾害预防'],
+    rightContent: ['灾害风险点查看', '灾害处置记录'],
+    icon: disasterPreventionIcon,
   },
   {
     title: '应急管理',
-    content: ['应急队伍', '应急预案', '应急演练', '应急物资', '应急处置'],
-    backgroundImg: emergencyManagementBg,
+    leftContent: ['应急队伍', '应急预案', '应急演练'],
+    rightContent: ['应急物资', '应急处置'],
+    icon: emergencyManagementIcon,
   },
 ];