flx：修改海康监控插件展示

src/assets/js/api/loginSign.js

@@ -54,4 +54,10 @@ export const jumpLargeUserInfoApi = data => post('xmgl/base/getLoginInfoByToken'
 // 获取登录的图片验证码
 export const getImgCodeLoginApi = data => get('xmgl/base/login/captcha', data);
 // 账号密码登录（带验证码）
-export const verifyLoginApi = data => post('xmgl/base/verify/login', data);
+export const verifyLoginApi = data => post('xmgl/base/verify/login', data);
+
+// 用户中心
+// 保存用户配置信息
+export const saveConfigUserConfigApi = data => post('xmgl/userConfig/saveConfig', data);
+// 列表查询用户配置信息
+export const getUserConfigListApi = data => get('xmgl/userConfig/list', data);

src/assets/js/http.js

@@ -181,7 +181,7 @@ if (process.env.NODE_ENV == "development") {
         // axios.defaults.baseURL = 'http://192.168.34.221:28889/' //郭圣雄本地
         // axios.defaults.baseURL = 'http://192.168.34.221:28890/' //郭圣雄本地
         // axios.defaults.baseURL = "http://192.168.34.221:9111/"; //郭圣雄本地
-        // axios.defaults.baseURL = "http://192.168.34.221:19112/"; //郭圣雄本地
+        axios.defaults.baseURL = "http://192.168.34.221:19112/"; //郭圣雄本地
         // axios.defaults.baseURL = 'http://192.168.34.155:19111/' //彭洁本地
         // axios.defaults.baseURL = 'http://182.90.224.237:51234/' //郭圣雄远程
         // axios.defaults.baseURL = 'http://jxj.zhgdyun.com:61212/' //彭洁远程
@@ -208,7 +208,7 @@ if (process.env.NODE_ENV == "development") {
         // axios.defaults.baseURL = "http://139.9.66.234:20628";
         // axios.defaults.baseURL = "http://jxj.zhgdyun.com:9500";
         // axios.defaults.baseURL = "http://jxj.zhgdyun.com:21000"; // 潮州
-    axios.defaults.baseURL = "http://gszhdz.crpower.com.cn:9809/"; // 敦煌
+    // axios.defaults.baseURL = "http://gszhdz.crpower.com.cn:9809/"; // 敦煌
     // axios.defaults.baseURL = "https://gszhdz.crpower.com.cn:9807/"; // 敦煌
 } else if (process.env.NODE_ENV == "debug") {
     axios.defaults.baseURL = "https://www.ceshi.com";

src/components/header.vue

@@ -28,11 +28,12 @@
         >>{{ item.name }}</span
       >
     </div>
-    <div class="title_near flex" v-if="![1, 2, 3, 4, 7].includes($store.state.userInfo.accountType)">
+    <!-- <div class="title_near flex" v-if="![1, 2, 3, 4, 7].includes($store.state.userInfo.accountType)">
       <userChange></userChange>
-    </div>
+    </div> -->
-    <div class="title_near-tow flex" v-if="![11, 1, 2, 3, 4, 7].includes($store.state.userInfo.accountType) && workSpaceShow">
+    <!-- 2 -->
-      <div class="divider-line"></div>
+    <div class="title_near-tow flex" v-if="![11, 1, 3, 4, 7].includes($store.state.userInfo.accountType) && (workSpaceShow || [2, 3, 4, 7].includes($store.state.userInfo.accountType))">
+      <!-- <div class="divider-line"></div> -->
       <centerChange></centerChange>
     </div>
     <div class="headerRight">

src/components/videoModule/isc_plugin/isc_plugin_h5.vue

@@ -597,7 +597,7 @@ export default {
       let tempCode = row.serialNumber;
       const param = {
         cameraIndexCode: tempCode,
-        streamType: row.defaultStreamType == 2 ? 0 : row.defaultStreamType,
+        streamType: row.defaultStreamType && row.eIndex < 4 ? row.defaultStreamType : "",
         type: window.location.protocol.includes("https") ? "wss" : "ws",
         transmode: 1,
         itemId: row.itemId,

src/components/videoModule/isc_plugin/video_isc_plugin.js

@@ -76,7 +76,7 @@ export function unInitObjPlugin() {
   }
 }
 //预览视频
-export function OpenVideo(cameraIndexCode, streamMode, winIndex) {
+export function OpenVideo(cameraIndexCode, streamMode, winIndex = 0) {
   var transMode = +'1'; //传输协议：1、TCP    0、UDP
   var gpuMode = +'0'; //是否启用GPU硬解：1、启用   0、不启用
   console.log(8855544, streamMode)
@@ -84,7 +84,7 @@ export function OpenVideo(cameraIndexCode, streamMode, winIndex) {
     funcName: "startPreview",
     argument: JSON.stringify({
       cameraIndexCode: cameraIndexCode,
-      streamMode: streamMode == 2 ? 0 : streamMode, // 码流类型 0 主码流 1 子码流 (2 主码流 1 子码流)
+      streamMode: streamMode == 2 && (winIndex > 4) ? 0 : 1, // 码流类型 0 主码流 1 子码流 (2 主码流 1 子码流)
       transMode: transMode,
       gpuMode: gpuMode,
       wndId: -1,

src/components/videoModule/videoModule.vue

@@ -36,7 +36,7 @@
         :type="type"
         :isIframe="isIframe"
         :devList="devList"
-        v-if="infor.enableNotPlugin != 1"
+        v-if="isWindows() && $store.state.forceH5Play == 0"
         :class="{
           isDockingToWoer: isDockingToWoer,
           isLongguangIframe: isIframe,
@@ -324,6 +324,7 @@ import {
 } from "./isc_plugin/video_isc_plugin.js";
 import { getVideoItemInfoApi } from "@/assets/js/api/equipmentCenter/cameraList";
 import { projectVideoConfigListApi } from "@/assets/js/api/equipmentCenter/cameraList";
+import { isWindows } from "@/util/util";
 export default {
   props: [
     "value",
@@ -507,6 +508,7 @@ export default {
     window.removeEventListener("keydown", this.fullScreen);
   },
   methods: {
+    isWindows,
     selectPlayVideo(find) {
       this.$emit("selectPlayVideo", find);
     },

src/store/index.js

@@ -41,6 +41,7 @@ export default new Vuex.Store({
                     uid: val.uid,
                     reloadPage: val.reloadPage,
                     projectExtendInfo: val.projectExtendInfo,
+                    forceH5Play: val.forceH5Play,
                 };
             },
         }),
@@ -291,6 +292,7 @@ export default new Vuex.Store({
         uid: false, //是否第三方免码登录  true为免码登录
         reloadPage: false, //重载页面 因为动态加载资源 要刷新页面
         projectExtendInfo: null, //项目扩展信息
+        forceH5Play: 0, //项目扩展信息
     },
     mutations: {
         setUPLOADURL(state, data) {
@@ -314,6 +316,9 @@ export default new Vuex.Store({
         // setCurrentUrl(state,data){
         //     state.currentUrl = data
         // }
+        setForceH5Play(state,data){
+            state.forceH5Play = data
+        },
         setProjectSn(state, data) {
             state.projectSn = data;
         },

src/util/util.js

@@ -113,4 +113,9 @@ export function handleSingleMaskedField(fieldName, currentValue, originalValue)
         return null;
     }
     return currentValue;
+}
+
+// 判断当前系统是不是windows系统
+export function isWindows() {
+    return navigator.userAgent.indexOf('Windows') !== -1;
 }

src/views/companyAdmin/companyBigScreen/aIEarlyWarn/areaTree.vue

@@ -12,7 +12,7 @@
             <div
                 class="top-container"
                 :class="{
-                    treeBox_scroll1: videoConfigInfo.enableNotPlugin == 1,
+                    treeBox_scroll1: (!isWindows() || $store.state.forceH5Play == 1),
                     treeBox_scroll2: isDragging,
                 }"
             >
@@ -97,6 +97,7 @@ import {
     projectVideoConfigListApi,
 } from "@/assets/js/api/equipmentCenter/cameraList";
 import { selectAllProjectInfoList } from "@/assets/js/api/companyBigScreen.js";
+import { isWindows } from "@/util/util";
 export default {
     props: [
         "videoType",
@@ -132,6 +133,7 @@ export default {
         this.loadData();
     },
     methods: {
+        isWindows,
         shrinkCloseFlagFn() {
             this.shrinkCloseFlag = !this.shrinkCloseFlag;
             this.$emit("shrinkCloseChange", this.shrinkCloseFlag);

src/views/companyAdmin/companyBigScreen/highRiskOperation/homeworkControlProcess.vue

@@ -144,6 +144,7 @@
                                 v-model="policeCameraItemInfo.deviceState"
                                 clearable
                                 placeholder="请选择"
+                                @visible-change="visibleChange"
                             >
                                 <el-option
                                     v-for="(item, index) in deviceStateList"
@@ -340,21 +341,8 @@
 											:autoplay="true"
 											:controls="true"
 										/> -->
-                                        <IscPlayer
-                                            v-if="
-                                                videoConfig.enableNotPlugin == 1
-                                            "
-                                            :devList="[
-                                                {
-                                                    ...item,
-                                                    status: workTicketDetail.status,
-                                                },
-                                            ]"
-                                            :key="'player-' + item.itemId"
-                                            :playerId="item.itemId"
-                                        />
                                         <div
-                                            v-else
+                                            v-if="isWindows() && $store.state.forceH5Play == 0"
                                             class="fullHeight videoOverview"
                                             :id="`videoOverview${item.itemId}`"
                                         >
@@ -365,8 +353,20 @@
                                                 :equipmentDialog="
                                                     equipmentDialog
                                                 "
+                                                :visibleDialog="visibleDialog"
                                             ></IscPlugin>
                                         </div>
+                                        <IscPlayer
+                                            v-else
+                                            :devList="[
+                                                {
+                                                    ...item,
+                                                    status: workTicketDetail.status,
+                                                },
+                                            ]"
+                                            :key="'player-' + item.itemId"
+                                            :playerId="item.itemId"
+                                        />
                                     </div>
                                     <div
                                         class="hls-video_title"
@@ -763,6 +763,7 @@ const IscPlayer = defineAsyncComponent(() =>
 );
 import IscPlugin from "../terminalOperation/components/isc_plugin";
 import { Message } from "element-ui";
+import { isWindows } from "@/util/util";
 import {
     getWorkTicketCountWorkTicketApi,
     getWorkTicketPageApi,
@@ -999,6 +1000,10 @@ const onViewAllClick = () => {
 
 const equipmentDialog = ref(false);
 const equipmentDetail = ref({});
+const visibleDialog = ref(false);
+const visibleChange = (val) => {
+    visibleDialog.value = val;
+};
 // 查看设备详情
 const onEquipmentClick = (row) => {
     equipmentDetail.value = row;

src/views/companyAdmin/companyBigScreen/terminalOperation/components/isc_plugin.vue

@@ -17,7 +17,7 @@ let closeVideo = null;
 import VideoPlugin from "./video_isc_plugin.js";
 import { getVideoItemInfoPoliceCameraItemApi } from "@/assets/js/api/workTicketManage";
 export default {
-  props: ["devList", "type", "isIframe", "itemId", "equipmentDialog"],
+  props: ["devList", "type", "isIframe", "itemId", "equipmentDialog", "visibleDialog"],
   data() {
     return {
       layout: "1x1",
@@ -124,11 +124,10 @@ export default {
     //     }
     //   },
     // },
-    equipmentDialog: {
+    isVisible: {
-      // immediate: true,
       handler(newval) {
         console.log("resizeFn", newval, this.videoPlugin);
-        if (newval) {
+        if (newval.equipmentDialog || newval.visibleDialog) {
           this.videoPlugin.hidePluginWindow();
         } else {
           this.videoPlugin.showPluginWindow();
@@ -136,12 +135,18 @@ export default {
         // 调整大小
         // this.videoPlugin.resizePlugin('', this.itemId);
       },
-    },
+    }
   },
   computed: {
     isExpand() {
       return this.$store.state.isExpand;
     },
+    isVisible() {
+      return {
+        equipmentDialog: this.equipmentDialog,
+        visibleDialog: this.visibleDialog,
+      }
+    }
   },
 };
 </script>

src/views/companyAdmin/companyBigScreen/terminalOperation/homeworkControlProcess.vue

@@ -143,6 +143,7 @@
                                 v-model="policeCameraItemInfo.deviceState"
                                 clearable
                                 placeholder="请选择"
+                                @visible-change="visibleChange"
                             >
                                 <el-option
                                     v-for="(item, index) in deviceStateList"
@@ -355,21 +356,8 @@
 											:autoplay="true"
 											:controls="true"
 										/> -->
-                                        <IscPlayer
-                                            v-if="
-                                                videoConfig.enableNotPlugin == 1
-                                            "
-                                            :devList="[
-                                                {
-                                                    ...item,
-                                                    status: workTicketDetail.status,
-                                                },
-                                            ]"
-                                            :key="'player-' + item.itemId"
-                                            :playerId="item.itemId"
-                                        />
                                         <div
-                                            v-else
+                                            v-if="isWindows() && $store.state.forceH5Play == 0"
                                             class="fullHeight videoOverview"
                                             :id="`videoOverview${item.itemId}`"
                                         >
@@ -380,8 +368,20 @@
                                                 :equipmentDialog="
                                                     equipmentDialog
                                                 "
+                                                :visibleDialog="visibleDialog"
                                             ></IscPlugin>
                                         </div>
+                                        <IscPlayer
+                                            v-else
+                                            :devList="[
+                                                {
+                                                    ...item,
+                                                    status: workTicketDetail.status,
+                                                },
+                                            ]"
+                                            :key="'player-' + item.itemId"
+                                            :playerId="item.itemId"
+                                        />
                                     </div>
                                     <div
                                         class="hls-video_title"
@@ -777,6 +777,7 @@ const IscPlayer = defineAsyncComponent(() =>
     import("./components/iscPlayer.vue")
 );
 import IscPlugin from "./components/isc_plugin";
+import { isWindows } from "@/util/util";
 import { Message } from "element-ui";
 import {
     getWorkTicketCountWorkTicketApi,
@@ -1012,6 +1013,10 @@ const onViewAllClick = () => {
 
 const equipmentDialog = ref(false);
 const equipmentDetail = ref({});
+const visibleDialog = ref(false);
+const visibleChange = (val) => {
+    visibleDialog.value = val;
+};
 // 查看设备详情
 const onEquipmentClick = (row) => {
     console.log(7747,row);

src/views/companyAdmin/companyBigScreen/videoSurveillance/areaTree.vue

@@ -12,8 +12,8 @@
       <div
         class="top-container"
         :class="{
-          treeBox_scroll1: videoConfigInfo.enableNotPlugin == 1,
+          treeBox_scroll1: (!isWindows() || $store.state.forceH5Play == 1),
-          treeBox_scroll2: videoConfigInfo.enableNotPlugin == 1 && isDragging,
+          treeBox_scroll2: (!isWindows() || $store.state.forceH5Play == 1) && isDragging,
         }"
       >
         <div class="header-box">
@@ -133,7 +133,7 @@
         </div>
       </div>
 
-      <div class="control_main" v-if="videoConfigInfo.enableNotPlugin == 1">
+      <div class="control_main" v-if="(!isWindows() || $store.state.forceH5Play == 1)">
         <div class="header-box header_gauge">
           <div class="header-text">云台</div>
           <div
@@ -173,6 +173,7 @@ import {
   getVideoItemInfoApi,
   projectVideoConfigListApi,
 } from "@/assets/js/api/equipmentCenter/cameraList";
+import { isWindows } from "@/util/util";
 import DraggableGauge from "./DraggableGauge.vue";
 export default {
   props: [
@@ -215,6 +216,7 @@ export default {
     this.loadData();
   },
   methods: {
+    isWindows,
     onDeviceState(state) {
       this.searchInfo.deviceState = state;
     },
@@ -249,7 +251,7 @@ export default {
 
           this.videoConfigInfo = res.result;
           if (type == "all") {
-            if (this.videoConfigInfo.enableNotPlugin == 1) {
+            if ((!isWindows() || $store.state.forceH5Play == 1)) {
               this.$emit(
                 "playParams",
                 itemList.filter((item, index) => index < 16)

src/views/equipmentCenter/videoManage/videoConfig.vue

@@ -1075,12 +1075,12 @@
                 placeholder="请输入外网端口"
               ></el-input>
             </el-form-item>
-            <el-form-item label="是否启用无插件播放">
+            <!-- <el-form-item label="是否启用无插件播放">
               <el-radio-group v-model="currentVideoTypeDetail.enableNotPlugin">
                 <el-radio :label="1">是</el-radio>
                 <el-radio :label="0">否</el-radio>
               </el-radio-group>
-            </el-form-item>
+            </el-form-item> -->
             <div class="message-tip">
               <i class="el-icon-warning"></i>
               <div>

src/views/home/login_v3.vue

@@ -539,6 +539,7 @@ import { selectSystemLogoConfigApi } from "@/assets/js/api/jxjadmin";
 import getcode from "@/components/getMsgCode";
 import { getOneComputerAuthApi } from "@/assets/js/api/loginSign";
 import { selectNoticeRemindSoundApi } from "@/assets/js/api/configManage";
+import { getUserConfigListApi } from "@/assets/js/api/loginSign";
 import LoginInfo from "./components/loginInfo.vue";
 import axios from "axios";
 import { MD5 } from "crypto-js";
@@ -1390,6 +1391,7 @@ export default {
         "Bearer" + " " + data.token;
       this.$http.defaults.headers.common["operateId"] = data.userId;
       this.$store.commit("setUserInfo", data);
+      this.getUserConfigList(data);
       localStorage.setItem("jumpToken", data.token); //储存token到本地
       let isHaveUserCenterMenu = false; // 判断是否有用户中心模块
       var moduleList = data.menuAuthority.moduleList
@@ -1587,6 +1589,17 @@ export default {
       }
       this.selectMp3FileList();
     },
+    getUserConfigList(data) {
+      getUserConfigListApi({
+        userId: data.userId,
+      }).then((res) => {
+        if (res.code === 200) {
+          if(res.result instanceof Array && res.result.length > 0) {
+            this.$store.commit("setForceH5Play", res.result[0].forceH5Play);
+          }
+        }
+      });
+    },
   },
 };
 </script>

src/views/projectFront/configManage/notificationRuleSet.vue

@@ -281,14 +281,14 @@
                 </template>
               </el-table-column>
               <el-table-column
-                prop="enableSystemMessagePromptTone"
+                prop="enableSystemMessagePush"
                 label="是否开启系统站内消息推送"
                 align="center"
               >
                 <template slot-scope="scope">
                   <el-switch
                     readonly
-                    :value="scope.row.enableSystemMessagePromptTone"
+                    :value="scope.row.enableSystemMessagePush"
                     :active-value="1"
                     :inactive-value="0"
                     active-color="#20B066"

src/views/projectFront/replayVideoManage/overview.vue

@@ -162,7 +162,7 @@
             :startTime="selectDate.startTime"
             :endTime="selectDate.endTime"
             :locationValue="locationValue"
-            v-if="infor.enableNotPlugin != 1"
+            v-if="isWindows() && $store.state.forceH5Play == 0"
           ></playBack>
           <iscPluginH5
             v-else
@@ -190,6 +190,7 @@ import iscPluginH5 from "./components/playBack/isc_plugin_h5.vue";
 import DHPlayer from "./components/DHPlayer/dhPlayer";
 import closePage from "@/components/closePage";
 import { dateFormat } from "@/util/nowDate/index";
+import { isWindows } from "@/util/util";
 export default {
   components: { playBack, closePage, DHPlayer, iscPluginH5 },
   data() {
@@ -229,6 +230,7 @@ export default {
   },
 
   methods: {
+    isWindows,
     //查询项目各类型的视频配置信息
     getProjectVideoConfigList() {
       projectVideoConfigListApi({

src/views/projectFront/videoManage/overview.vue

@@ -30,7 +30,7 @@
         </div>
         <div class="videoBox" v-else>
           <vue-scroll
-            :class="{ control_scroll: videoConfigInfo.enableNotPlugin == 1 && isDragging, control_scrolloff: videoConfigInfo.enableNotPlugin == 1 && !isDragging }"
+            :class="{ control_scroll: (!isWindows() || $store.state.forceH5Play == 1) && isDragging, control_scrolloff: (!isWindows() || $store.state.forceH5Play == 1) && !isDragging }"
             style="width: 100%"
           >
             <el-tree
@@ -86,7 +86,7 @@
               </el-collapse-item>
             </el-collapse> -->
           </vue-scroll>
-          <div class="control_main" v-if="videoConfigInfo.enableNotPlugin == 1">
+          <div class="control_main" v-if="(!isWindows() || $store.state.forceH5Play == 1)">
             <!-- <div @click="controlVideoFn(0, 0.2, 0, 'START_TRACK')">上</div>
             <div @click="controlVideoFn(-0.2, 0, 0, 'STOP_TRACK')">左</div>
             <div @click="controlVideoFn(0, -0.2, 0, 'DOWN')">下</div>
@@ -136,6 +136,7 @@ import {
 import videoModule from "@/components/videoModule/videoModule.vue";
 import closePage from "@/components/closePage";
 import DraggableGauge from "@/components/DraggableGauge.vue";
+import { isWindows } from "@/util/util";
 export default {
   components: { videoModule, closePage, DraggableGauge },
   data() {
@@ -179,6 +180,7 @@ export default {
   },
 
   methods: {
+    isWindows,
     onGaugeChange(value) {
       console.log("进度值变化:", value);
     },

src/views/projectFront/workTicketManage/homeworkControlProcess.vue

@@ -1042,17 +1042,17 @@
                   :autoplay="true"
                   :controls="true"
                 /> -->
-                <IscPlayer
+                <div v-if="isWindows()" class="fullHeight videoOverview" :id="`videoOverview${workTicketDetail.id}`">
-                  v-if="videoConfig.enableNotPlugin"
-                  :devList="videoItemList"
-                ></IscPlayer>
-                <div v-else class="fullHeight videoOverview" :id="`videoOverview${workTicketDetail.id}`">
                   <IscPlugin
                     :devList="videoItemList"
                     :itemId="workTicketDetail.id"
                     :type="'1x1'"
                   ></IscPlugin>
                 </div>
+                <IscPlayer
+                  v-else
+                  :devList="videoItemList"
+                ></IscPlayer>
               </div>
               
               <!-- videoItemInfo.videoInfo.url -->
@@ -1325,6 +1325,7 @@ import { projectVideoConfigListApi } from "@/assets/js/api/equipmentCenter/camer
 import dayjs from "dayjs";
 import duration from "dayjs/plugin/duration";
 import { isJSON } from "@/util/nowDate";
+import { isWindows } from "@/util/util";
 import HlsPlayer from "./components/HlsPlayer.vue";
 import IscPlayer from "./components/iscPlayer.vue";
 import IscPlugin from "@/views/companyAdmin/companyBigScreen/terminalOperation/components/isc_plugin.vue";
@@ -1506,6 +1507,7 @@ export default {
         this.getProjectVideoConfigList();
     },
     methods: {
+      isWindows,
         //查询项目各类型的视频配置信息
         getProjectVideoConfigList() {
             projectVideoConfigListApi({

src/views/userCenter/layout.vue

@@ -37,11 +37,11 @@
       <div
         class="title_near-tow flex"
         v-if="
-          ![11, 1, 2].includes($store.state.userInfo.accountType) &&
+          ![11, 1, 3, 4, 7].includes($store.state.userInfo.accountType) &&
           workSpaceShow
         "
       >
-        <div class="divider-line"></div>
+        <!-- <div class="divider-line"></div> -->
         <centerChange></centerChange>
       </div>
       <div class="title_r flex">

src/views/userCenter/userCenter/componentsModule/systemSetting.vue

@@ -0,0 +1,84 @@
+<template>
+  <div class="fullHeight">
+    <div class="content-main">
+      <div class="main-header">海康视频监控插件设置</div>
+      <div class="main-box">
+        <div>强制使用H5(跨平台支持麟麟+Windows)播放，Windows用户可用于测试兼容性</div>
+        <div>
+          <el-switch
+            v-model="forceH5Play"
+            active-color="#13ce66"
+            inactive-color="#d8d8d8"
+            :active-value="1"
+            :inactive-value="0"
+            @change="saveConfigUserConfig"
+          >
+          </el-switch>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import { getUserConfigListApi, saveConfigUserConfigApi } from "@/assets/js/api/loginSign";
+export default {
+  data() {
+    return {
+      forceH5Play: 0,
+    };
+  },
+  created() {
+    this.getUserConfigList();
+  },
+  methods: {
+    getUserConfigList() {
+      getUserConfigListApi({
+        sn: this.$store.state.projectSn || this.$store.state.userInfo.sn,
+        userId: this.$store.state.userInfo.userId,
+      }).then((res) => {
+        if (res.code === 200) {
+          if(res.result instanceof Array && res.result.length > 0) {
+            this.forceH5Play = res.result[0].forceH5Play;
+          }
+        }
+      });
+    },
+    saveConfigUserConfig() {
+      saveConfigUserConfigApi({ 
+        sn: this.$store.state.projectSn || this.$store.state.userInfo.sn,
+        userId: this.$store.state.userInfo.userId,
+        forceH5Play: this.forceH5Play,
+       }).then(
+        res => {
+          if (res.code === 200) {
+            this.$message({
+              type: "success",
+              message: "保存成功!",
+            });
+            this.$store.commit("setForceH5Play", this.forceH5Play);
+          } else {
+            this.$message.error("保存失败");
+          }
+        },
+      );
+    },
+  },
+};
+</script>
+<style lang="less" scoped>
+.content-main {
+    padding: 12px;
+    > div {
+        padding: 14px 12px;
+    }
+    .main-box {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+    }
+    .main-header {
+        font-weight: bold;
+        background-color: #FAFAFA;
+    }
+}
+</style>

src/views/userCenter/userCenter/index.vue

@@ -19,6 +19,7 @@
       <DataInfoFormData v-if="checkedId == 1"></DataInfoFormData>
       <DataFormData v-if="checkedId == 2"></DataFormData>
       <DataListData v-if="checkedId == 3"></DataListData>
+      <SystemSetting v-if="checkedId == 4"></SystemSetting>
     </div>
   </div>
 </template>
@@ -26,19 +27,22 @@
 import DataListData from './componentsModule/dataListData'
 import DataFormData from './componentsModule/dataFormData'
 import DataInfoFormData from './componentsModule/dataInfoFormData'
+import SystemSetting from './componentsModule/systemSetting'
 export default {
   components: {
     DataListData,
     DataFormData,
-    DataInfoFormData
+    DataInfoFormData,
+    SystemSetting
   },
   data() {
     return {
-      checkedId: 1,
+      checkedId: 4,
       centerModuleList: [
         {id: 1, name: '个人信息'},
         {id: 2, name: '修改密码'},
-        {id: 3, name: '安全日志'}
+        {id: 3, name: '安全日志'},
+        {id: 4, name: '系统设置'},
       ],
     }
   },