Newer
Older
cockpit_hxrq_front / src / views / scada / scadaConfig.vue
StephanieGitHub on 5 Nov 2021 7 KB MOD: 根据甲方需求调整
<!--
 * @Description: scada关系配置
 * @Author: 王晓颖
 * @Date: 2021-09-14 15:22:07
 -->
<template>
  <app-container>
    <div class="table-title">华新燃气集团调控中心生产运行参数报表
      <el-button size="small" plain @click="fetchAll">刷新</el-button>
    </div>
    <!--其他公司进气口-->
    <in-gas-config title="天然气进气口" :data="trqjqk" @save="saveData"/>
    <in-gas-config title="煤层气进气口" :data="mcqjqk" @save="saveData"/>
    <in-gas-config title="煤制气进气口" :data="mzqjqk" @save="saveData"/>
    <!--山西燃气集团进气口-->
    <in-gas-config title="山西燃气集团进气口" :data="srjqk" @save="saveData"/>
    <!--<in-gas-config title="山西燃气集团煤层气进气口" :data="srmcqjqk"/>-->
    <!--<in-gas-config title="山西燃气集团煤制气进气口" :data="srmzqjqk"/>-->
    <!--气化反输-->
    <in-reverse-config title="气化反输进气口" :data="qhfs" @save="saveData"/>
    <!--天然气公司用户-->
    <out-gas-config title="天然气公司用户" :data="trqyh" @save="saveData"/>
    <out-gas-config title="国化公司用户" :data="ghyh" @save="saveData"/>
    <out-gas-config title="燃产集团用户" :data="rcyh" @save="saveData"/>
    <out-gas-config title="煤层气公司用户" :data="mcqyh" @save="saveData"/>
    <out-gas-config title="压缩公司用户" :data="ysyh" @save="saveData"/>
    <out-gas-config title="城燃公司用户" :data="cryh" @save="saveData"/>
    <out-gas-config title="山西燃气集团用户" :data="sryh" @save="saveData"/>
    <!--燃气电厂-->
    <dianchang-config title="燃气电厂" :data="rqdc" @save="saveData"/>
    <!--液化工厂-->
    <yechang-config title="液化工厂" :data="yhgc" @save="saveData"/>
    <!--联络线-->
    <lianluoxian-config title="联络线" :data="llx" @save="saveData"/>
  </app-container>
</template>

<script>
  import InGasConfig from './components/inGasConfig'
  import InReverseConfig from './components/inReverseConfig'
  import OutGasConfig from './components/outGasConfig'
  import DianchangConfig from './components/dianchangConfig'
  import YechangConfig from './components/yechangConfig'
  import LianluoxianConfig from './components/lianluoxianConfig'
  import {getConfig, saveConfig} from '@/api/scada'
  export default {
    name: 'scadaConfig',
    components: { LianluoxianConfig, YechangConfig, DianchangConfig, OutGasConfig, InReverseConfig, InGasConfig },
    data(){
      return{
        trqjqk:[], // 天然气进气口
        mcqjqk:[], // 煤层气进气口
        mzqjqk:[], // 煤制气进气口
        srjqk:[], // 山西燃气集团天然气进气口
        srmcqjqk:[], // 山西燃气集团煤层气进气口
        srmzqjqk:[], // 山西燃气集团煤制气进气口
        qhfs:[], // 气化反输
        trqyh:[], // 天然气公司用户
        ghyh:[], // 国化公司用户
        rcyh:[], // 燃产集团用户
        mcqyh:[], // 煤层气公司用户
        ysyh:[], // 压缩公司用户
        cryh:[], // 城燃公司用户
        sryh:[], // 山西燃气集团用户
        rqdc:[], // 燃气电厂
        yhgc:[], // 液化工厂
        llx:[], // 联络线
      }
    },
    created(){
      this.fetchAll()
    },
    methods:{
      // 刷新数据
      fetchAll(){
        this.fetchTrqjqk()
        this.fetchMcqjqk()
        this.fetchMzqjqk()
        this.fetchSrjqk()
        this.fetchQhfs()
        this.fetchTrqUser()
        this.fetchGhUser()
        this.fetchRcUser()
        this.fetchMcqUser()
        this.fetchYsUser()
        this.fetchCrUser()
        this.fetchSrUser()
        this.fetchRqdc()
        this.fetchYhgc()
        this.fetchLlx()
      },
      // 天然气进气口数据
      fetchTrqjqk(){
        const params = { type:'1', qyType:'天然气' }
        this.fetchData(params, 'trqjqk')
      },
      // 煤层气进气口数据
      fetchMcqjqk(){
        const params = { type:'1', qyType:'煤层气' }
        this.fetchData(params, 'mcqjqk')
      },
      // 煤制气进气口数据
      fetchMzqjqk(){
        const params = { type:'1', qyType:'煤制气' }
        this.fetchData(params, 'mzqjqk')
      },
      // 山燃进气口
      fetchSrjqk(){
        const params = {type:'1', company:'山西燃气集团'}
        this.fetchData(params, 'srjqk')
      },
      // 气化反输
      fetchQhfs(){
        const params= {type:'2'}
        this.fetchData(params, 'qhfs')
      },
      // 天然气公司用户
      fetchTrqUser(){
        const params = {type:'3',company:'天然气公司'}
        this.fetchData(params, 'trqyh')
      },
      // 国化用户
      fetchGhUser(){
        const params = {type:'3',company:'国化公司'}
        this.fetchData(params, 'ghyh')
      },
      // 燃产用户
      fetchRcUser(){
        const params = {type:'3',company:'燃产集团'}
        this.fetchData(params, 'rcyh')
      },
      // 煤层气用户
      fetchMcqUser(){
        const params = {type:'3',company:'煤层气公司'}
        this.fetchData(params, 'mcqyh')
      },
      // 压缩公司用户
      fetchYsUser(){
        const params = {type:'3',company:'压缩公司'}
        this.fetchData(params, 'ysyh')
      },
      // 城燃公司用户
      fetchCrUser(){
        const params = {type:'3',company:'城燃公司'}
        this.fetchData(params, 'cryh')
      },
      // 山燃用户
      fetchSrUser(){
        const params = {type:'3',company:'山西燃气集团'}
        this.fetchData(params, 'sryh')
      },
      // 燃气电厂
      fetchRqdc(){
        const params = {type:'4'}
        this.fetchData(params, 'rqdc')
      },
      // 液化工厂
      fetchYhgc(){
        const params = {type:'5'}
        this.fetchData(params, 'yhgc')
      },
      // 联络线
      fetchLlx(){
        const params = {type:'6'}
        this.fetchData(params, 'llx')
      },
      // 根据参数获取数据
      fetchData(params,result){
        const finalParams = {
          ...params,
          offset: 1,
          limit: 20
        }
        getConfig(params).then(res=>{
          const data = res.data.rows
          // const data = [
          //   {lianluoxian:'联络线', dianchang:'电厂', yechang:'液化工厂', yonghu:'test', qiyuan:'内蒙新圣',zhanchang:'右玉分输站(天然气)',inPressure:'ALTID',inTemperature:'',outPressure:'',outTemperature:'', flow:'', output:''},
          //   {lianluoxian:'联络线', dianchang:'电厂', yechang:'液化工厂', yonghu:'test', qiyuan:'陕京一线',zhanchang:'金沙滩首站(天然气)',inPressure:'',inTemperature:'',outPressure:'',outTemperature:'', flow:'', output:''},
          //   {lianluoxian:'联络线', dianchang:'电厂', yechang:'液化工厂', yonghu:'test', qiyuan:'陕京一线',zhanchang:'神池首站(天然气)',inPressure:'',inTemperature:'',outPressure:'',outTemperature:'', flow:'', output:''},
          // ]
          this[result] = data.map(item=>{
            return {editMode: false, ...item}
          })
        })

      },
      // 提交保存
      saveData(row){
        debugger
        // 提交保存
        // todo: 保存成功
        saveConfig(row).then(res=>{
          this.$message.success('保存成功!')
          row.editMode=false
        }).catch(e=>{
        })

      }
    }
  }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
  .table-title{
    line-height: 3;
    font-size:18px;
    text-align: center;
    font-weight: bold;
  }
</style>