longyvfengyun
2024-08-14 a37c0febb90efd7aa25855f25cabf9ddc6a92c31
src/views/dataTest/components/switchControl.vue
@@ -1,123 +1,72 @@
<template>
  <div class="main">
    <div class="switch-info">
      <div class="name">DK-11</div>
      <div class="state">
        <el-switch
          style="display: block"
          v-model="DK11"
          active-color="#13ce66"
          inactive-color="#ccc"
          active-text="合闸"
          inactive-text="分闸"
        >
        </el-switch>
      </div>
      <div class="name">DK-12</div>
      <div class="state">
        <el-switch
          style="display: block"
          v-model="DK12"
          active-color="#13ce66"
          inactive-color="#ccc"
          active-text="合闸"
          inactive-text="分闸"
        >
        </el-switch>
      </div>
      <div class="name">DK-13</div>
      <div class="state">
        <el-switch
          style="display: block"
          v-model="DK13"
          active-color="#13ce66"
          inactive-color="#ccc"
          active-text="合闸"
          inactive-text="分闸"
        >
        </el-switch>
      </div>
      <div class="name">DK-14</div>
      <div class="state">
        <el-switch
          style="display: block"
          v-model="DK14"
          active-color="#13ce66"
          inactive-color="#ccc"
          active-text="合闸"
          inactive-text="分闸"
        >
        </el-switch>
      </div>
      <div class="name">DK-15</div>
      <div class="state">
        <el-switch
          style="display: block"
          v-model="DK15"
          active-color="#13ce66"
          inactive-color="#ccc"
          active-text="合闸"
          inactive-text="分闸"
        >
        </el-switch>
      </div>
      <div class="name">DK-16</div>
      <div class="state">
        <el-switch
          style="display: block"
          v-model="DK16"
          active-color="#13ce66"
          inactive-color="#ccc"
          active-text="合闸"
          inactive-text="分闸"
        >
        </el-switch>
      </div>
      <div class="name">DK-17</div>
      <div class="state">
        <el-switch
          style="display: block"
          v-model="DK17"
          active-color="#13ce66"
          inactive-color="#ccc"
          active-text="合闸"
          inactive-text="分闸"
        >
        </el-switch>
      </div>
      <div class="name">DK-18</div>
      <div class="state">
        <el-switch
          v-model="DK18"
          active-color="#13ce66"
          inactive-color="#ccc"
          active-text="合闸"
          inactive-text="分闸"
        >
        </el-switch>
      </div>
    </div>
    <div class="footer">
      <three-btn @click="getParams()">读取</three-btn>
      <three-btn :disabled="!setTestFlag" @click="submitFrom">设定</three-btn>
      <three-btn  @click="$emit('close')"
          >取消</three-btn
        >
    <div class="tbl-data-body">
      <el-table stripe size="small" :data="switchInfo">
        <el-table-column
          v-for="header in table.headers"
          :key="header.prop"
          :prop="header.prop"
          :label="header.label"
          align="center"
        ></el-table-column>
        <el-table-column label="操作" width="100">
          <template slot-scope="scope">
            <el-button
              v-if="!scope.row.state1"
              type="primary"
              size="mini"
              :disabled="scope.row.control1"
              @click="switchControl(scope.row, 1)"
              >合闸</el-button
            >
            <el-button
              v-else
              type="danger"
              :disabled="scope.row.control1"
              size="mini"
              @click="switchControl(scope.row, 0)"
              >分闸</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script>
import { setDev6159Swtich } from "../js/realTime";
export default {
  name: "",
  props: {
    devId: {
      type: [String, Number],
      required: true
      required: true,
    },
    switchInfo: {
      type: Array,
      required: true,
    },
  },
  data() {
    return {
      table: {
        headers: [
          {
            prop: "name",
            label: "开关名称",
          },
          {
            prop: "control",
            label: "控制方式",
          },
          {
            prop: "state",
            label: "状态",
          },
        ],
      },
      setTestFlag: false,
      DK11: false,
      DK12: false,
@@ -131,13 +80,27 @@
  },
  components: {},
  methods: {
    getParams(){
    getParams() {},
    switchControl(obj, state) {
      let loading = this.$layer.loading(1);
      setDev6159Swtich(this.devId, obj.ctrlName, !obj.state1 * 1)
        .then((res) => {
          let { code, data } = res.data;
          if (code && data) {
            // console.log(data);
            this.$layer.msg("操作成功");
          } else {
            this.$layer.msg("操作失败");
          }
          // 关闭等待框
          this.$layer.close(loading);
        })
        .catch((err) => {
          console.log(err);
          // 关闭等待框
          this.$layer.close(loading);
        });
    },
    submitFrom() {
    },
  },
  mounted() {},
@@ -160,7 +123,7 @@
      font-weight: bold;
      color: #f7b33c;
      &::after {
        content: ':';
        content: ":";
      }
    }
    .state {