disaster_web3/src/view/components/Menuventfan.vue

<template>
   <div class="l_Dialog bou tablebk">
    <!--风机-->
    <div class="common-layout" style="margin: 0">
      <el-aside
        width="480px"
        class="L_aside L_aside1 asideg asidegbg leftbgimg1"
        v-show="sendialogVisible"
      >
        <div class="demo-collapse">
          <el-collapse accordion>
            <el-collapse-item name="1" class="btnicon">
              <template #title>
                <el-icon class="iconimg Frame3" fit="contain"></el-icon>
                风机<el-icon class="header-icon"> </el-icon>
              </template>
              <div class="asides_content">
                <div class="jc_content tablecolor">
                  <div class="jc_padding font12">
                    <div class="xian btncolor tablefocus bmar">
                      <el-table
                        :data="femObjs"
                        style="width: 100%"
                        :max-height="tableHeight"
                        :highlight-current-row="currentrow"
                        :row-class-name="tableRowClassName"
                        @row-click="femtabxz($event)"
                        :header-cell-style="{
                          background: 'rgba(13, 22, 57, 0) '
                        }"
                      >
                        <template v-slot:empty>
                          <p>暂无数据</p>
                        </template>
                        <el-table-column prop="fanname" label="风机名称" />
                          <el-table-column prop="pname" label="巷道名称" />
                        <el-table-column prop="site" label="相对位置" />
                        <el-table-column prop="pa" >
                            <template v-slot:header>
                            <span >增压</span><br>
                            <span >(kpa)</span>
                          </template>
                        </el-table-column>
                          <el-table-column prop="onoff" label="开启状态">
                          <template #default="scope">
                            {{
                              scope.row.onoff == "0"
                                ? "否"
                                : scope.row.onoff == "1"
                                ? "是"
                                : "是"
                            }}
                          </template>
                        </el-table-column>
                      </el-table>
                      <div class="asdis_btn">
                        <div class="flex_a">
                          <div
                            class="btns"
                            @click="femadd()"
                          >
                            <span class="spantext">添加</span>
                          </div>
                        </div>
                        <div class="flex_a">
                          <div class="btns" @click="femupdate()">
                            <span class="spantext">修改</span>
                          </div>
                        </div>
                        <div class="flex_a">
                          <div class="btns" @click="femdel()">
                            <span class="spantext">删除</span>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </el-collapse-item>
          </el-collapse>

          <!-- 风门的添加 -->
          <el-dialog
            v-model="femDShow"
            align-center  :append-to-body="true" width="400" class="dialog_class bgcolor tianjia  foter_l tianjia"
          >
            <template #header="{ titleId, titleClass }">
              <div class="my-header">
                <el-image :src="icon" fit="contain"></el-image>
                <h4 :id="titleId" :class="titleClass">风机</h4>
              </div>
            </template>
            <el-form>
              <!--  只能输入引文oninput ="value=value.replace(/[^a-zA-Z]/g, '');" -->
              <el-form-item label="编码" :label-width="formLabelWidth6">
                <el-input
                  v-model="femObj.fancode"
                  maxlength="18"
                  oninput="value=value.replace(/[^\w\\/]/ig,'')"
                  class="w-50 m-2"
                  placeholder="请输入"
                />
              </el-form-item>
              <el-form-item label="风机名称" :label-width="formLabelWidth6">
                <el-input
                  v-model="femObj.fanname"
                  maxlength="18"
                  oninput="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,'')"
                  class="w-50 m-2"
                  placeholder="请输入"
                />
              </el-form-item>
              <div class="demo-input-suffix firsttitle magintop">
                <el-form-item label="巷道名称" :label-width="formLabelWidth6">
                  <el-input
                    v-model="femObj.pname"
                    disabled
                    class="w-50 m-2"
                    placeholder="巷道名称"
                  />
                </el-form-item>
                <div class="btn2">
                  <el-button
                    type="primary"
                    @click="fireclick()"
                    >选择巷道</el-button
                  >
                </div>
              </div>
              <div class="input">
                <el-form-item label="位置" :label-width="formLabelWidth6">
                  <el-input-number
                    v-model="femObj.site"
                    :min="0"
                    :max="1"
                    :precision="2"
                    :step="0.1"
                    controls-position="right"
                    class="w-50 m-2"
                    placeholder="位置"
                  />
                </el-form-item>
              </div>
              <div style="display: flex">
                <span class="switchppm">开启状态</span>
                <el-switch
                  v-model="femObj.onoff"
                  inline-prompt
                  active-text="是"
                  inactive-text="否"
                  :active-value="1"
                  :inactive-value="0"
                />
              </div>
            <el-form-item label="增压(kpa)" :label-width="formLabelWidth6">
            <el-input v-model="femObj.pa"  maxlength="10" oninput ="value=value.replace(/[^0-9.]/g,'')" class="w-50 m-2"  placeholder="请输入" />
        </el-form-item>
            </el-form>
            <div class="dialog-footer footer_div l_btn">
              <div class="footerbtn flex1">
                <div class="borderimg">
                  <el-button
                   @click="femDShow = false"
                    >取消</el-button
                  >
                </div>
              </div>
              <div class="footerbtn flex1">
                <div class="borderimg">
                  <el-button @click="femsave()"> 确定 </el-button>
                </div>
              </div>
            </div>
          </el-dialog>

     
          <!-- 选择管道 -->
          <pipelines
            ref="pipeline"
            :selectstr="femObj.pname"
            @pipelineapi="pipelineapi"
          />
        </div>
      </el-aside>
    </div>
  </div>
</template>

<script setup>
import { computed, ref, onMounted, reactive, toRef } from "vue"
import { request, uploadFile } from "@/utils/request"
import { ElMessage, ElButton, ElDialog, ElSelect } from "element-plus"
import zhCn from "element-plus/es/locale/lang/zh-cn"
import icon from "@/assets/img/icon.png"
import pipelines from "./PipeIine.vue"
import { vtkmodel } from "@/control/vtkModel.js"
import { timestampToTime } from "@/js/lindex.js"
let tableHeight = ref(200)
const formLabelWidth6 = ref(100);
let pipeline = ref()
const tableRowClassName = ({ row, rowIndex }) => {
  if (rowIndex % 2 != 0) {
    return "evenRow"
  }
  return "oddRow"
}
let currentrow=ref(false);
let sendialogVisible=ref(false);
let femDShow =ref(false);
let femObjs=ref([]);
let femObj= ref({});

const femtabxz=(val)=>{
  femObj.value = val;
  currentrow.value = true
}
const femupdate=()=>{
  if (JSON.stringify(femObj.value) == "{}") {
    ElMessage.error("你还没有选中删除的项目")
  }else{
    femDShow.value = true;
  }
}
const femadd=()=>{
  femObj.value={};
  femDShow.value = true;
}

const femsave=()=>{
   const params = {
    transCode: "D50008",
    fanbaseid:femObj.value.fanbaseid,
    fancode:femObj.value.fancode,
    pid:femObj.value.pid,
    fanname:femObj.value.fanname,
    site:femObj.value.site,
    pa:parseFloat(femObj.value.pa),
    onoff:femObj.value.onoff,
  }
  request(params)
    .then((res) => {
     femfind();
     femDShow.value = false;
    })
    .catch((err) => {
      ElMessage.error(err.returnMsg)
    })
}
const femdel=()=>{
  if (JSON.stringify(femObj.value) == "{}") {
    ElMessage.error("你还没有选中删除的项目")
  }else{
  const params = {
    transCode: "D50009",
    fanbaseid:femObj.value.fanbaseid,
  }
  request(params)
    .then((res) => {
      femfind();
    })
    .catch((err) => {
      ElMessage.error(err.returnMsg)
    })
  }
}
const femfind=()=>{
   const params = {
    transCode: "D50007"
  }
  request(params)
    .then((res) => {
      femObjs.value = res.rows
    })
    .catch((err) => {
      ElMessage.error(err.returnMsg)
    })
}
onMounted(() => {
  femfind()
})
// 选择巷道
const fireclick = () => {
  pipeline.value.searchtaggd = ""
  pipeline.value.dialogVisiblenode = true
  pipeline.value.pipelinedata("")
}
//点击确定
const pipelineapi = (row) => {
  femObj.value.pid = row.id
  femObj.value.pcode = row.code
  femObj.value.pname = row.name
}
defineExpose({ sendialogVisible })
</script>