UA 系统配置 告警面板 国际化

he wei

2023-04-26 5b77ef2a6eff51b7606a33d2881108df19c73367

UA 系统配置 告警面板 国际化

 src/assets/js/const/const_page.js

@@ -4,84 +4,112 @@
      key: "eleLine",
      type: 1,
      label: "CircuitTopology",
      labelCN: '电路拓扑图',
      labelEN: "Circuit Topology",
      show: 1,
    },
    {
      key: "vol",
      type: 1,
      label: "Voltage",
      labelCN: '电压',
      labelEN: 'Voltage',
      show: 1,
    },
    {
      key: "res",
      type: 1,
      label: "Resistance",
      labelCN: '内阻',
      labelEN: 'Resistance',
      show: 1,
    },
    {
      key: "temp",
      type: 1,
      label: "Temperature",
      labelCN: '温度',
      labelEN: 'Temperature',
      show: 1,
    },
    {
      key: "conduct",
      type: 1,
      label: "Conductance",
      labelCN: '电导',
      labelEN: 'Conductance',
      show: 1,
    },
    {
      key: "monConnRes",
      type: 1,
      label: "ConnectorImpedance",
      labelCN: '链接条阻值',
      labelEN: 'Connector Impedance',
      show: 1,
    },
    {
      key: "curr",
      type: 1,
      label: "BalancingCurrent",
      labelCN: '均衡电流',
      labelEN: 'Balancing Current',
      show: 1,
    },
    {
      key: "leakVol",
      type: 1,
      label: "LeakageVoltage",
      labelCN: '漏液电压',
      labelEN: 'Leakage Voltage',
      show: 1,
    },
    {
      key: "tblData",
      type: 1,
      label: "DataExcel",
      labelCN: '数据表格',
      labelEN: 'Data Excel',
      show: 1,
    },
    {
      key: "dianchigaojing",
      type: 1,
      label: "BatteryAlarm",
      labelCN: '电池告警',
      labelEN: 'Battery Alarm',
      show: 1,
    },
    {
      key: "niBianInfoTab",
      type: 1,
      label: "InverterInformation",
      labelCN: '逆变信息',
      labelEN: 'Inverter Information',
      show: 1,
    },
    {
      key: "jggdInfoTab",
      type: 1,
      label: "BalancePowerSupply",
      labelCN: '均衡供电',
      labelEN: 'Balance Power Supply',
      show: 1,
    },
    {
      key: "elePrice",
      type: 1,
      label: "ElectricityRateStatisticsAnalysis",
      labelCN: '电价统计分析',
      labelEN: 'Electricity Rate Statistics Analysis',
      show: 1,
    },
    {
      key: "bmsInfo",
      type: 1,
      label: "BMSInfo",
      labelCN: 'BMS信息',
      labelEN: 'BMS Info',
      show: 1
    },
  ],
@@ -91,6 +119,8 @@
        key: "vol",
        type: 2,
        label: "Voltage",
        labelCN: '电压',
        labelEN: 'Voltage',
        show: 1,
        value: 2,
      },
@@ -98,6 +128,8 @@
        key: "conduct",
        type: 2,
        label: "Conductance",
        labelCN: '电导',
        labelEN: 'Conductance',
        show: 1,
        value: 3,
      },
@@ -105,6 +137,8 @@
        key: "conductPercent",
        type: 2,
        label: "ConductancePercentage",
        labelCN: '电导百分比',
        labelEN: 'Conductance Percentage',
        show: 1,
        value: 4,
      },
@@ -112,6 +146,8 @@
        key: "res",
        type: 2,
        label: "Resistance",
        labelCN: '内阻',
        labelEN: 'Resistance',
        show: 1,
        value: 5,
      },
@@ -119,6 +155,8 @@
        key: "temp",
        type: 2,
        label: "Temperature",
        labelCN: '温度',
        labelEN: 'Temperature',
        show: 1,
        value: 6,
      },
@@ -126,6 +164,8 @@
        key: "link",
        type: 2,
        label: "ConnectorImpedance1",
        labelCN: '连接条阻抗',
        labelEN: "Connector Impedance",
        show: 1,
        value: 7,
      },

 src/assets/js/i18n/base.js

@@ -9,6 +9,11 @@
      back: '区域缩放还原',
      restore: '还原',
    },
    homeList: {
      siteList: '站点列表',
      loading: '数据加载中...',
      noData: '暂无数据',
    },
    form: {
      validateMsg: '存在校验未通过的数据',
      allCount: '全部(共{n}种) | 全部(共{n}种) | 全部(共{n}种)',
@@ -30,6 +35,9 @@
      edit: '编辑',
      SearchFailed: '查询失败',
    },
    other: {
      noAlarm: '最近24小时内无告警',
    }
  },
  US: {
    markLine: {
@@ -40,6 +48,11 @@
      zoom: 'Zoom',
      back: 'Zoom Reset',
      restore: 'Restore',
    },
    homeList: {
      siteList: 'Site List',
      loading: 'Data Loading…',
      noData: 'No Data',
    },
    form: {
      validateMsg: 'Verify failed data existed',
@@ -62,5 +75,8 @@
      edit: 'Edit',
      SearchFailed: 'Search Failed!',
    },
    other: {
      noAlarm: 'No alarm has been generated in the last 24 hours',
    }
  }
}

 src/layout/components/AlarmPopup.vue

@@ -6,11 +6,11 @@
          <div class="alarm-popup-title">
            <div v-if="speakItem.txt">
              <i class="iconfont el-icon-shengyin-kai"></i>
              <span>{{speakItem.txt}}</span>
              <span>{{ speakItem.txt }}</span>
            </div>
            <div v-else>
              <i class="el-icon-info"></i>
              <span>告警提示！</span>
              <span>{{ $t('AlarmPrompt') }}</span>
            </div>
          </div>
          <div class="alarm-popup-voice" v-if="!speakItem.txt">
@@ -24,49 +24,26 @@
          <div class="page-flex-box">
            <div class="page-flex-box-header">
              <el-radio-group v-model="timeType">
                <el-badge
                  v-for="(item, key) in times" :key="'key'+key"
                  :value="item.value" class="el-badge-radio">
                <el-badge v-for="(item, key) in times" :key="'key' + key" :value="item.value" class="el-badge-radio">
                  <el-radio :label="item.key" border size="mini">{{ item.label }}</el-radio>
                </el-badge>
              </el-radio-group>
            </div>
            <div class="page-flex-box-body">
              <el-table
                class="popup-table"
                stripe
                size="small"
                header-row-class-name="header-primary"
                height="100%"
              <el-table class="popup-table" stripe size="small" header-row-class-name="header-primary" height="100%"
                :data="tblAlarmList">
                <el-table-column
                  prop="stationName3"
                  align="center"
                  label="机房名称"
                <el-table-column prop="stationName3" align="center" :label="$t('EquipmentRoomName')"
                  min-width="240"></el-table-column>
                <el-table-column
                  prop="alarmName"
                  align="center"
                  label="告警名称"
                <el-table-column prop="alarmName" align="center" :label="$t('AlarmName')"
                  min-width="120"></el-table-column>
                <el-table-column
                  prop="alarmLevel"
                  align="center"
                  label="告警等级"
                <el-table-column prop="alarmLevel" align="center" :label="$t('AlarmLevel')"
                  min-width="120"></el-table-column>
                <el-table-column
                  prop="almStartTime"
                  align="center"
                  label="告警时间"
                <el-table-column prop="almStartTime" align="center" :label="$t('AlarmTime')"
                  min-width="180"></el-table-column>
                <el-table-column label="操作" width="180" align="center">
                <el-table-column :label="$t('operate.operation')" width="180" align="center">
                  <template slot-scope="scope">
                    <el-button
                      type="success"
                      size="mini" @click="clickItem(scope.row)">详情</el-button>
                    <el-button
                      type="danger"
                      size="mini" @click="handleTimeout(scope.row)">延时播报</el-button>
                    <el-button type="success" size="mini" @click="clickItem(scope.row)">{{ $t('Detail') }}</el-button>
                    <el-button type="danger" size="mini" @click="handleTimeout(scope.row)">{{ $t('Delay') }}</el-button>
                  </template>
                </el-table-column>
              </el-table>
@@ -82,19 +59,14 @@
    </div>
    <alarm-details :visible.sync="detailsVisible" :params="params">
      <div slot="footer" class="details-footer">
        <el-button type="danger" size="small" @click="routeToPage">更多>></el-button>
        <el-button type="danger" size="small" @click="routeToPage">{{ $t('More') }}>></el-button>
      </div>
    </alarm-details>
    <!-- 告警延时设置 -->
    <el-dialog
      title="告警延时设置"
      width="auto"
      :visible.sync="alarmTimeoutVisible"
      :close-on-click-modal="false"
      top="0"
      class="dialog-center dialog-bg"
      :modal-append-to-body="false">
      <alarm-timeout-setting v-if="alarmTimeoutVisible" :visible.sync="alarmTimeoutVisible" :id="id" :alarm-state="alarmState" :alarm-type="alarmId"></alarm-timeout-setting>
    <el-dialog :title="$t('AlarmDelaySetting')" width="auto" :visible.sync="alarmTimeoutVisible"
      :close-on-click-modal="false" top="0" class="dialog-center dialog-bg" :modal-append-to-body="false">
      <alarm-timeout-setting v-if="alarmTimeoutVisible" :visible.sync="alarmTimeoutVisible" :id="id"
        :alarm-state="alarmState" :alarm-type="alarmId"></alarm-timeout-setting>
    </el-dialog>
  </div>
</template>
@@ -104,9 +76,13 @@
import AlarmDetails from "@/views/alarmMager/components/alarm-details.vue";
import alarmDetails from "@/views/alarmMager/js/api/alarmDetails";
import AlarmTimeoutSetting from "@/views/alarmMager/components/alarm-timeout-setting.vue";
import i18n from './i18n/AlarmPopup';
import { createI18nOption } from '@/assets/js/tools/i18n';
const i18nMixin = createI18nOption(i18n);
export default {
  name: "AlarmPopup",
  components: {AlarmTimeoutSetting, AlarmDetails},
  mixins: [i18nMixin],
  components: { AlarmTimeoutSetting, AlarmDetails },
  props: {
    list: {
      type: Array,
@@ -139,34 +115,34 @@
      alarmState: 0,
      newAlarmList: [],
      newAlarmNum: [],
      oneYear: 60*60*24*365*1000,
      oneYear: 60 * 60 * 24 * 365 * 1000,
      timeType: 1,
      times: [
        {
          key: 1,
          label: "30分钟",
          label: this.$tc('mins', 30),
          range: [0, 30],
          value: 0,
          list: [],
        },
        {
          key: 2,
          label: "24小时",
          range: [30, 60*24],
          label: this.$tc('hours', 24),
          range: [30, 60 * 24],
          value: 0,
          list: [],
        },
        {
          key: 3,
          label: "7天",
          range: [60*24, 60*24*7],
          label: this.$tc('days', 7),
          range: [60 * 24, 60 * 24 * 7],
          value: 0,
          list: [],
        },
        {
          key: 4,
          label: "30天",
          range: [60*24*7, 60*24*30],
          label: this.$tc('days', 30),
          range: [60 * 24 * 7, 60 * 24 * 30],
          value: 0,
          list: [],
        },
@@ -182,7 +158,7 @@
      params: {
        almSource: "",  // 告警源
        almName: "",    // 告警名称
        almLevel:"",    // 告警等级
        almLevel: "",    // 告警等级
        almPoint: "",   // 告警点
        almReason: "",  // 告警原因
        almAdvices: []  // 告警处理建议
@@ -202,17 +178,17 @@
    },
  },
  methods: {
    searchAll(){
      alarmDetails.searchAllAlarm().then(res=>{
    searchAll() {
      alarmDetails.searchAllAlarm().then(res => {
        let rs = res.data;
        if(rs.code == 1 && rs.data) {
          this.allAlarms = rs.data2.map(item=>{
            item.value = item.almId+"&&&"+item.almName+"&&&"+item.highorlow+"&&&"+item.almType;
            item.label = item.almName+(item.highorlow == 0?"":item.highorlow == 1?"低":"高");
        if (rs.code == 1 && rs.data) {
          this.allAlarms = rs.data2.map(item => {
            item.value = item.almId + "&&&" + item.almName + "&&&" + item.highorlow + "&&&" + item.almType;
            item.label = item.almName + (item.highorlow == 0 ? "" : item.highorlow == 1 ? this.$t('Low') : this.$t('High'));
            return item;
          });
        }
      }).catch(error=>{
      }).catch(error => {
        console.log(error);
      });
    },
@@ -221,9 +197,9 @@
      this.alarmId = val.almId;
      if (val.alarmType == '1') {   // 设备告警
        this.alarmState = 1;
      }else if(val.alarmType == "2") {    // 电源告警
      } else if (val.alarmType == "2") {    // 电源告警
        this.alarmState = 0;
      }else { // 电池告警
      } else { // 电池告警
        this.alarmState = 2;
        this.alarmId = val.almSignalId;
      }
@@ -236,18 +212,18 @@
      let almLevel = val.alarmLevel;
      let highorlow = 0;
      let almSignalId = val.almSignalId;
      let almSource = "通信电源"
      let almSource = this.$t('CommunicationPower');
      if (val.alarmType == '1') {   // 设备告警
        highorlow = 0;
        almSource = "BTS设备";
      }else if(val.alarmType == "2") {    // 电源告警
        almSource = "通信电源";
        almSource = this.$t('BTSEquipment');
      } else if (val.alarmType == "2") {    // 电源告警
        almSource = this.$t('CommunicationPower');
        highorlow = 0;
      }else {     // 电池告警
        almSource = "电池组";
        if(almSignalId%2 == 0) {
      } else {     // 电池告警
        almSource = this.$t('BatteryGroup');
        if (almSignalId % 2 == 0) {
          highorlow = 1;
        }else {
        } else {
          highorlow = 2;
        }
      }
@@ -255,21 +231,21 @@
      let almName = "";
      let almPoint = "";
      let allAlm = this.allAlarms;
      for(let j=0; j<allAlm.length; j++) {
      for (let j = 0; j < allAlm.length; j++) {
        let itemList = allAlm[j];
        if(itemList.almId == val.almId && itemList.highorlow == highorlow) {
        if (itemList.almId == val.almId && itemList.highorlow == highorlow) {
          almName = itemList.almName;
          almName+= itemList.highorlow == 0?"":itemList.highorlow == 1?"低":"高";
          almName += itemList.highorlow == 0 ? "" : itemList.highorlow == 1 ? this.$t('Low') : this.$t('High');
          almPoint = itemList.almPoint;
        }
      }
      alarmDetails.searchById(val.almId, highorlow).then(res=>{
      alarmDetails.searchById(val.almId, highorlow).then(res => {
        let rs = res.data;
        if(rs.code ==1 && rs.data) {
        if (rs.code == 1 && rs.data) {
          let data = rs.data2;
          let almReason = data[0].almReason;
          let almAdvices = [];
          for(let i=0; i<data.length; i++) {
          for (let i = 0; i < data.length; i++) {
            almAdvices.push(data[i].almAdvice);
          }
          this.params = {
@@ -281,14 +257,14 @@
            almAdvices  // 告警处理建议
          };
          this.detailsVisible = true;
        }else {
        } else {
          // this.$alert('暂无'+almName+"处理方案，请联系管理员添加", '系统提示', {
          //   confirmButtonText: '确定',
          //   callback: action => {}
          // });
          this.routeToPage();
        }
      }).catch(error=>{
      }).catch(error => {
        this.routeToPage();
      });
      // if (val.alarmType == '1') {
@@ -304,10 +280,10 @@
      if (val.alarmType == '1') {
        //设备实时告警
        this.$router.push('/alarmMager/deviceTimequery' + this.search + '&fromType=fromIndex')
      } else if(val.alarmType=='2') {
      } else if (val.alarmType == '2') {
        //电源实时告警
        this.$router.push('/alarmMager/powerRealtimeInfo' + this.search + '&fromType=fromIndex')
      }else {
      } else {
        //电池实时告警
        this.$router.push('/alarmMager/batteryrTimequery' + this.search + '&fromType=fromIndex')
      }
@@ -327,12 +303,12 @@
      let speakItem = {
        txt: "",
      };
      for(let i=0; i<this.list.length; i++) {
      for (let i = 0; i < this.list.length; i++) {
        let item = this.list[i];
        // 返回当前正在播报的语音内容
        if(item.almId == speakInfo.almId && item.battGroupId == speakInfo.devId) {
          speakItem = {...item};
          speakItem.txt = item.stationName+"出现了"+item.alarmName;
        if (item.almId == speakInfo.almId && item.battGroupId == speakInfo.devId) {
          speakItem = { ...item };
          speakItem.txt = item.stationName + this.$t('occurred') + item.alarmName;
        }

        let nowStamp = getNowStamp();
@@ -345,14 +321,14 @@
      this.newAlarmList = list;

      // 根据时间分类，分类数据
      for(let i=0; i<this.times.length; i++) {
      for (let i = 0; i < this.times.length; i++) {
        let time = this.times[i];
        let timesList = [];
        for(let i=0; i<this.list.length; i++) {
        for (let i = 0; i < this.list.length; i++) {
          let item = this.list[i];
          let nowStamp = new Date().getTime();
          let inputDate = Date.parse(item.almStartTime); //输入时间戳
          if ((nowStamp - inputDate) > time.range[0]*60*1000 && (nowStamp - inputDate) <= time.range[1]*60*1000) {
          if ((nowStamp - inputDate) > time.range[0] * 60 * 1000 && (nowStamp - inputDate) <= time.range[1] * 60 * 1000) {
            timesList.push(item);
          }
        }
@@ -362,30 +338,30 @@

      let isShow = false;
      // 最新告警的长度变化
      if(this.newAlarmNum.length < nums.length) {
      if (this.newAlarmNum.length < nums.length) {
        isShow = true;
      }else {
        for(let i=0; i<nums.length; i++) {
      } else {
        for (let i = 0; i < nums.length; i++) {
          let item1 = nums[i];
          let isIn = false;
          for(let j=0; j<this.newAlarmNum.length;j++) {
          for (let j = 0; j < this.newAlarmNum.length; j++) {
            let item2 = this.newAlarmNum[j];
            if(item1 == item2) {
            if (item1 == item2) {
              isIn = true;
            }
          }
          if(!isIn) {
          if (!isIn) {
            isShow = true;
            break;
          }
        }
      }

      if(isShow) {
      if (isShow) {
        this.show();
      }

      this.newAlarmNum =  nums;
      this.newAlarmNum = nums;
      this.speakItem = speakItem;
    },
  },
@@ -411,9 +387,9 @@
    tblAlarmList() {
      let timeType = this.timeType;
      let list = [];
      for(let i=0; i<this.times.length; i++) {
      for (let i = 0; i < this.times.length; i++) {
        let time = this.times[i];
        if(time.key == timeType) {
        if (time.key == timeType) {
          list = time.list;
        }
      }
@@ -434,10 +410,12 @@
  z-index: 98;
  user-select: none;
}

.alarm-popup-container {
  position: relative;
  padding: 3px;
}

.alarm-popup-content {
  position: relative;
  background-color: #EE9741;
@@ -445,12 +423,14 @@
  background-repeat: no-repeat;
  border: 1px solid #0a56f7;
}

.radius-border {
  position: absolute;
  width: 24px;
  height: 24px;

}

.radius-border.top-left {
  border-top: 3px solid #0ca7e2;
  border-left: 3px solid #0ca7e2;
@@ -466,6 +446,7 @@
  right: 0;
  border-top-right-radius: 4px;
}

.radius-border.bottom-left {
  border-bottom: 3px solid #0ca7e2;
  border-left: 3px solid #0ca7e2;
@@ -481,10 +462,12 @@
  right: 0;
  border-bottom-right-radius: 4px;
}

.alarm-popup-header {
  position: relative;
  background-color: #D8741A;
}

.alarm-popup-header .alarm-popup-title {
  line-height: 42px;
  font-size: 16px;
@@ -492,6 +475,7 @@
  font-weight: bold;
  color: #FFFFFF;
}

.alarm-popup-title i {
  font-size: 20px;
  margin-right: 8px;
@@ -503,70 +487,87 @@
  top: 8px;
  right: 12px;
}

.alarm-popup-voice {
  right: 40px;
}

.alarm-popup-voice i {
  font-size: 20px;
}

.alarm-popup-close:hover,
.alarm-popup-voice:hover {
  cursor: pointer;
  color: #ffe329;
}

.alarm-popup-close:active,
.alarm-popup-voice:active {
  color: #FF3801;
}

.alarm-popup-body {
  min-width: 400px;
  overflow-y: auto;
}

.alarm-list {
  padding: 8px;
  font-size: 16px;
}

.alarm-popup-mini {
  margin-right: 24px;
  font-size: 24px;
  color: #ffe329;
}

.page-flex-box-header {
  padding: 8px 16px;
}

.page-flex-box-body {
  box-sizing: border-box;
  height: 420px;
  padding: 0 8px 8px;
}

.el-badge-radio {
  margin-right: 32px;
}

.el-badge-radio .el-radio {
  margin-right: 0;
  background-color: #0b388a;
}

.el-badge-radio .el-radio.is-checked {
  background: none;
}

/deep/ .el-badge-radio .el-radio.is-checked .el-radio__label {
  color: #0b388a;
  font-weight: bold;
}

/deep/ .el-table .header-primary th {
  background: #F3B67A;
  color: #0b388a;
  font-weight: bold;
}

/deep/ .el-table.popup-table {
  background-color: #F3B67A;
  color: #000;
}

/deep/ .el-table.popup-table td {
  background-color: #FCEAD9;
}

.details-footer {
  padding: 8px;
  text-align: right;
}
</style>
</style>

 src/layout/components/i18n/AlarmPopup.js

New file
@@ -0,0 +1,44 @@
export default {
  messages: {
    CN: {
      AlarmPrompt: '告警提示！',
      EquipmentRoomName: '机房名称',
      AlarmName: '告警名称',
      AlarmLevel: '告警等级',
      AlarmTime: '告警时间',
      Detail: '详情',
      Delay: '延时播报',
      More: '更多',
      AlarmDelaySetting: '告警延时设置',
      mins: '0分钟 | 1分钟 | {n}分钟',
      hours: '0小时 | 1小时 | {n}小时',
      days: '0天 | 1天 | {n}天',
      CommunicationPower: '通信电源',
      BTSEquipment: 'BTS设备',
      BatteryGroup: '电池组',
      Low: '低',
      High: '高',
      occurred: '出现了',
    },
    US: {
      AlarmPrompt: 'Alarm Prompt!',
      EquipmentRoomName: 'Equipment Room Name',
      AlarmName: 'Alarm Name',
      AlarmLevel: 'Alarm Level',
      AlarmTime: 'Alarm Time',
      Detail: 'Detail',
      Delay: 'Delay',
      More: 'More',
      AlarmDelaySetting: 'Alarm Delay Setting',
      mins: '0 min | 1 min | {n} mins',
      hours: '0 hour | 1 hour | {n} hours',
      days: '0 day | 1 day | {n} days',
      CommunicationPower: 'Communication Power',
      BTSEquipment: 'BTS Equipment',
      BatteryGroup: 'Battery Group',
      Low: 'Low',
      High: 'High',
      occurred: ' occurred',
    },
  },
}

 src/layout/index.vue

@@ -20,7 +20,7 @@
        <app-main />
        <div slot="footer">
          <marqueeLeft :sendVal="newItems" v-if="showMarqueeLeft"></marqueeLeft>
          <div class="no-warning-msg" v-else>最近24小时内无告警</div>
          <div class="no-warning-msg" v-else>{{ $t('other.noAlarm') }}</div>
        </div>
      </flex-layout>
    </div>

 src/views/dataTest/movingRingSystem/HomeList.vue

@@ -1,6 +1,6 @@
<template>
  <content-box
    title="站点列表"
    :title="$t('homeList.siteList')"
    titleLeft
    toggle
    @toggleChange="toggleChange"
@@ -15,7 +15,7 @@
          v-model="filterText"
          filterable
          :filter-method="homeFilter"
          placeholder="请选择"
          :placeholder="$t('form.selectMsg')"
          clearable
          @change="filterChange"
        >
@@ -165,7 +165,7 @@
        // 添加空白位置占位
        home.children.push({
          id: home.id + Math.random(),
          label: "数据加载中...",
          label: this.$t('homeList.loading'),
        });
      });
      // 设置树状列表
@@ -217,7 +217,7 @@
      if (
        data.children &&
        data.children[0] &&
        data.children[0].label == "数据加载中..."
        data.children[0].label == this.$t('homeList.loading')
      ) {
        if (this.isHistory) {
          this.searchBattInfo(data, node, []);
@@ -314,7 +314,7 @@
          if (result.length == 0) {
            result.push({
              id: Math.random(),
              label: "暂无数据",
              label: this.$t('homeList.noData'),
            });
          }
          // 添加节点
@@ -413,6 +413,4 @@
.box-tools .iconfont:active {
  color: #ff0000;
}
</style>


</style>

 src/views/pageSetting/components/TabsConfig.vue

@@ -1,14 +1,6 @@
<template>
  <el-transfer
    v-model="status.value"
    filterable
    :props="status.props"
    :titles="['未添加标签页', '已添加标签页']"
    :button-texts="['移除', '添加']"
    :data="status.data"
    class="transfer-width320"
    @change="handlerChange"
  >
  <el-transfer v-model="status.value" filterable :props="statusProps" :titles="[$t('NoTabPageAdded'), $t('AddedTabPage')]"
    :button-texts="[$t('Remove'), $t('Add')]" :data="status.data" class="transfer-width320" @change="handlerChange">
  </el-transfer>
</template>

@@ -40,6 +32,15 @@
      }
    };
  },
  computed: {
    statusProps() {
      let lang = this.$store.state.settings.lang;
      return {
        key: "key",
        label: 'US' == lang ? 'labelEN' : "labelCN",
      }
    },
  },
  methods: {
    handlerChange(list, type, values) {
      // 根据类型确定事件
@@ -68,16 +69,10 @@
          let rs = res.data;
          if (rs.code == 1) {
            // 提示信息
            this.$message({
              type: "success",
              message: rs.msg
            });
            this.$message.success(this.$t('operate.successMsg'));
          } else {
            // 提示信息
            this.$message({
              type: "error",
              message: rs.msg
            });
            this.$message.error(this.$t('operate.failMsg'));
          }
          // 更新数据
          this.searchPageConfig();
@@ -102,16 +97,10 @@
          let rs = res.data;
          if (rs.code == 1) {
            // 提示信息
            this.$message({
              type: "success",
              message: rs.msg
            });
            this.$message.success(this.$t('operate.successMsg'));
          } else {
            // 提示信息
            this.$message({
              type: "error",
              message: rs.msg
            });
            this.$message.error(this.$t('operate.failMsg'));
          }
          // 更新数据
          this.searchPageConfig();
@@ -121,23 +110,23 @@
        });
    },
    initList() {
      let tabs = const_page.realTime;
      
      // let tabs = const_page.realTime;
      let tabs = this.getPageConfigData().map(v => ({
        key: v.key,
        type: v.type,
        label: v.labelCN,
        lableEnUs: v.labelEN,
        show: v.show
      }));
      addPageParamUserList(tabs)
        .then(res => {
          let rs = res.data;
          if (rs.code == 1) {
            // 提示信息
            this.$message({
              type: "success",
              message: rs.msg
            });
            this.$message.success(this.$t('operate.successMsg'));
          } else {
            // 提示信息
            this.$message({
              type: "error",
              message: rs.msg
            });
            this.$message.error(this.$t('operate.failMsg'));
          }
        })
        .catch(error => {
@@ -174,7 +163,8 @@
        return {
          key: item.key,
          type: item.type,
          label: this.$t('page.' + item.label),
          labelCN: item.labelCN,
          labelEN: item.labelEN,
          show: item.show
        };
      });
@@ -199,9 +189,9 @@
    let tabs = this.getPageConfigData();
    this.status.data = tabs;
    this.searchPageConfig();
    this.$bus.$on('langChanged', () => {
      this.searchPageConfig();
    });
    // this.$bus.$on('langChanged', () => {
    //   this.searchPageConfig();
    // });
  }
};
</script>

 src/views/pageSetting/components/platformName.vue

@@ -1,21 +1,15 @@
<template>
  <div class="platform-name">
    <div class="platform-name-content">
      <flex-box title="平台名称修改" size="mini">
      <flex-box :title="$t('PlatformNameModify')" size="mini">
        <div class="input-wrapper">
          <div class="input-content">
            <el-input
              placeholder="请输入内容"
              v-model="obj.param"
              clearable
            ></el-input>
            <el-input :placeholder="$t('form.inputMsg')" v-model="obj.param" clearable></el-input>
          </div>
        </div>
        <div class="flex-box-footer" slot="footer">
          <el-button type="primary" @click="changeName" :disabled="obj.id == 0"
            >确认修改</el-button
          >
          <el-button type="warning" @click="searchName">恢复/刷新</el-button>
          <el-button type="primary" @click="changeName" :disabled="obj.id == 0">{{ $t('operate.ok') }}</el-button>
          <el-button type="warning" @click="searchName">{{ $t('RecoverRefresh') }}</el-button>
        </div>
      </flex-box>
    </div>
@@ -27,8 +21,12 @@
import checkVal from "@/assets/js/tools/checkVal";
import const_rules from "@/assets/js/const/const_rules";
import { searchParam, updateParam } from "@/views/pageSetting/js/api";
import i18n from '../i18n/platformName';
import { createI18nOption } from '@/assets/js/tools/i18n';
const i18nMixin = createI18nOption(i18n);
export default {
  name: "platformName",
  mixins: [i18nMixin],
  components: {
    FlexBox
  },
@@ -37,7 +35,7 @@
      name: "",
      obj: {
        id: 0,
        param: "蓄电池远程运维管理系统",
        param: this.$t('BatteryRemoteOMManagementSystem'),
        status: 1,
        categoryId: 5
      }
@@ -54,21 +52,29 @@
            this.obj.param = data.param;
            this.obj.status = 1;
          } else {
            this.$layer.msg("获取平台名称失败，请联系管理员。");
            this.$layer.msg(this.$t('Failedtoobtaintheplatformnamepleasecontacttheadministrator'));
          }
        })
        .catch(error => {
          this.$layer.msg("获取平台名称失败，请联系管理员。");
          this.$layer.msg(this.$t('Failedtoobtaintheplatformnamepleasecontacttheadministrator'));
        });
    },
    changeName() {
      if (!this.obj.param) {
        this.$layer.msg("平台名称不能为空！");
        this.$layer.msg(this.$t('Theplatformnameisnull'));
        return;
      }
      if (this.obj.param.length > 16) {
        this.$layer.msg("平台名称过长最长15个字符");
        return;
      let lang = this.$store.state.settings.lang;
      if ('US' == lang) {
        if (this.obj.param.length > 56) {
          this.$layer.msg("The platform name cannot exceed 56 characters.");
          return;
        }
      } else {
        if (this.obj.param.length > 16) {
          this.$layer.msg("平台名称过长最长15个字符");
          return;
        }
      }
      // 校验字符串是否合法
      let nameCheckRs = checkVal(this.obj.param, const_rules.noSpecialChar);
@@ -80,13 +86,13 @@
        .then(res => {
          let rs = res.data;
          if (rs.code == 1) {
            this.$layer.msg("修改成功，重新登录后生效！");
            this.$layer.msg(this.$t('ModifySuccessfullyItwilltakeeffectafterrelogin'));
          } else {
            this.$layer.msg("修改失败");
            this.$message.error(this.$t('operate.failMsg'));
          }
        })
        .catch(error => {
          this.$layer.msg("修改失败");
          this.$message.error(this.$t('operate.failMsg'));
        });
    }
  },
@@ -102,26 +108,31 @@
  justify-content: center;
  height: 100%;
}

.platform-name-content {
  width: 540px;
  height: 200px;
  margin-top: 160px;
}

.flex-box-footer {
  padding: 16px;
  text-align: right;
}

.input-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.input-content {
  width: 80%;
}

.input-label {
  display: inline-block;
  padding: 8px 0;
}
</style>
</style>

 src/views/pageSetting/i18n/platformName.js

New file
@@ -0,0 +1,20 @@
export default {
  messages: {
    CN: {
      PlatformNameModify: '平台名称修改',
      RecoverRefresh: '恢复/刷新',
      BatteryRemoteOMManagementSystem: '蓄电池远程运维管理系统',
      Failedtoobtaintheplatformnamepleasecontacttheadministrator: '获取平台名称失败，请联系管理员.',
      Theplatformnameisnull: '平台名称不能为空！',
      ModifySuccessfullyItwilltakeeffectafterrelogin: '修改成功，重新登录后生效！',
    },
    US: {
      PlatformNameModify: 'Platform Name Modify',
      RecoverRefresh: 'Recover/Refresh',
      BatteryRemoteOMManagementSystem: 'Battery Remote O&M Management System',
      Failedtoobtaintheplatformnamepleasecontacttheadministrator: 'Failed to obtain the platform name, please contact the administrator.',
      Theplatformnameisnull: 'The platform name is null.',
      ModifySuccessfullyItwilltakeeffectafterrelogin: 'Modify Successfully! It will take effect after re-login!',
    }
  }
}

 src/views/pageSetting/i18n/realTime.js

@@ -13,6 +13,8 @@
      AddedFunction: '已添加功能',
      TabConfig: '标签配置',
      PlatformName: '平台名称',
      NoTabPageAdded: '未添加标签页',
      AddedTabPage: '已添加标签页',
    },
    US: {
      SystemConfiguration: 'System Configuration',
@@ -27,6 +29,8 @@
      AddedFunction: 'Added Function',
      TabConfig: 'Tab Config',
      PlatformName: 'Platform Name',
      AddedTabPage: 'Added Tab Page',
      NoTabPageAdded: 'No Tab Page Added',
    }
  }
}

 src/views/pageSetting/realTime.vue

@@ -212,16 +212,10 @@
          let rs = res.data;
          if (rs.code == 1) {
            // 提示信息
            this.$message({
              type: "success",
              message: rs.msg
            });
            this.$message.success(this.$t('operate.successMsg'));
          } else {
            // 提示信息
            this.$message({
              type: "error",
              message: rs.msg
            });
            this.$message.error(this.$t('operate.failMsg'));
          }
          // 更新数据
          this.searchStatus();
@@ -246,16 +240,10 @@
          let rs = res.data;
          if (rs.code == 1) {
            // 提示信息
            this.$message({
              type: "success",
              message: rs.msg
            });
            this.$message.success(this.$t('operate.successMsg'));
          } else {
            // 提示信息
            this.$message({
              type: "error",
              message: rs.msg
            });
            this.$message.error(this.$t('operate.failMsg'));
          }
          // 更新数据
          this.searchStatus();