UA 整理提交

he wei

2025-04-23 b9bd29a1a81f6f7de479e3cc3fdfe3d85fc660bf

 src/views/device/locks/task.vue

@@ -1,113 +1,229 @@
<script setup name="LockTask">
  import { ref, onMounted, reactive, computed, watchEffect } from "vue";
  import store from "@/store";
  import { Search, Plus } from "@element-plus/icons-vue";
  import addTask from "./addTask.vue";
  import {
    getLockBl,
    setLockBl,
    cancelLockBl,
  } from "@/api/lockManager.js";
import { ref, onMounted, reactive, computed, watchEffect, nextTick } from "vue";
import addTask from "./addTask.vue";
import {
   getLockBl,
   setLockBl,
   cancelLockBl,
} from "@/api/lockManager.js";

  import { checkSnId } from '@/api/user.js';
import { checkSnId } from '@/api/user.js';
import useStation from "@/hooks/useStationList.js";
import useElement from "@/hooks/useElement.js";
const { stationName1, stationName2, stationName3, stationName4,
   stationList1, stationList2, stationList3, stationList4,
} = useStation();

  const currentAreaId = ref();
   const tableData = ref([]);
   const pageNum = ref(1);
   const pageSize = ref(10);
   const total = ref(0);
const { $loading, $message, $confirm, $confirmPwdDo } = useElement();

  const addVisible = ref(false);
const tableData = ref([]);
const pageNum = ref(1);
const pageSize = ref(10);
const total = ref(0);

  const filter = reactive({
      name: "",
      type: undefined,
   });
const addVisible = ref(false);

const filter = reactive({
   name: "",
   type: undefined,
});

function getList() {
    let params = {
      pageNum: pageNum.value,
      pageSize: pageSize.value,
      areaId: currentAreaId.value,
      lockName: filter.name.trim() || undefined,
      type: filter.type || undefined,
    };
   let params = {
      pageNum: pageNum.value,
      pageSize: pageSize.value,
      lockName: filter.name.trim() || undefined,
      stationName1: stationName1.value || undefined,
      stationName2: stationName2.value || undefined,
      stationName3: stationName3.value || undefined,
      stationName4: stationName4.value || undefined
   };

    getLockBl(params).then((res) => {
      let { code, data, data2 } = res;
      let _total = 0;
      let _list = [];
      if (code && data) {
        _list = data2.list.map(v=>({
          ...v,
          state: { 1: '生效', 2: '已取消' }[v.type],
        }));
        _total = data2.total;
      }
      tableData.value = _list;
      total.value = _total;
    });
   getLockBl(params).then((res) => {
      let { code, data, data2 } = res;
      let _total = 0;
      let _list = [];
      if (code && data) {
         _list = data2.list.map(v => ({
            ...v,
            state: { 1: '生效', 2: '已取消' }[v.type],
         }));
         _total = data2.total;
      }
      tableData.value = _list;
      total.value = _total;
   });
}

function itemClickHandler(item) {
      // console.log(item, '====item', item.data);
      // areaId lockName lockState lockType pageNum pageSize
      currentAreaId.value = item.data.id;
      getList();
  }

  function add () {
    console.log('add', '=============');
    addVisible.value = true;
  }
function add() {
   console.log('add', '=============');
   addVisible.value = true;
}

  function handleSizeChange(val) {
      pageSize.value = val;
      getList();
   }
function handleSizeChange(val) {
   pageSize.value = val;
   getList();
}

   function handleCurrentChange(val) {
      pageNum.value = val;
      getList();
   }
function handleCurrentChange(val) {
   pageNum.value = val;
   getList();
}

  function okHandle() {
    addVisible.value = false;
    getList();
  }

  onMounted(() => {
    // getList();
function cancel(scope) {
   // console.log('row', scope.row, '=============');
  $confirmPwdDo(() => {
    let loading = $loading();
    cancelLockBl(scope.row.num).then((res) => {
      let { code, data } = res;
      loading.close();
      if (code && data) {
        // console.log(data);
        $message.success('操作成功');
        getList();
      } else {
        $message.error('操作失败');
      }
    })
      .catch((err) => {
        loading.close();
        console.log(err);
      });
  });

}

function okHandle() {
   addVisible.value = false;
   getList();
}

onMounted(() => {
   getList();
});
</script>

<template>
  <div class="page-wrapper">
    <div class="page-header">
      <div class="hdw-card-container">
        <hdw-card title="区域列表" is-full>
          <hdw-tree @item-click="itemClickHandler"></hdw-tree>
        </hdw-card>
      </div>
      <!-- <div class="hdw-card-container">
          <yc-card title="区域列表" is-full>
            <hdw-tree @item-click="itemClickHandler"></hdw-tree>
          </yc-card>
        </div> -->
    </div>
    <div class="page-content">
      <hdw-card is-full>
      <yc-card is-full>
        <div class="page-content-wrapper">
          <div class="page-content-tools">
            <el-button type="primary" size="small" :icon="Plus" @click="add">添加</el-button>
            <el-button type="primary" size="small" @click="add"
              ><svg-icon icon-class="add"></svg-icon>添加</el-button
            >
            |
            <div class="tools-filter">
              <div class="tools-filter-item">
                <div class="filter-label">省：</div>
                <div class="filter-content">
                  <el-select
                    v-model="stationName1"
                    clearable
                    placeholder="请选择"
                    @change="() => nextTick(() => getList())"
                    size="small"
                    style="width: 180px"
                  >
                    <el-option
                      v-for="(item, idx) in stationList1"
                      :key="'province_' + idx"
                      :label="item"
                      :value="item"
                    />
                  </el-select>
                </div>
              </div>
              <div class="tools-filter-item">
                <div class="filter-label">市：</div>
                <div class="filter-content">
                  <el-select
                    v-model="stationName2"
                    clearable
                    placeholder="请选择"
                    @change="() => nextTick(() => getList())"
                    size="small"
                    style="width: 180px"
                  >
                    <el-option
                      v-for="(item, idx) in stationList2"
                      :key="'city_' + idx"
                      :label="item"
                      :value="item"
                    />
                  </el-select>
                </div>
              </div>
              <div class="tools-filter-item">
                <div class="filter-label">区县：</div>
                <div class="filter-content">
                  <el-select
                    v-model="stationName3"
                    clearable
                    placeholder="请选择"
                    @change="() => nextTick(() => getList())"
                    size="small"
                    style="width: 180px"
                  >
                    <el-option
                      v-for="(item, idx) in stationList3"
                      :key="'list2_' + idx"
                      :label="item"
                      :value="item"
                    />
                  </el-select>
                </div>
              </div>
              <div class="tools-filter-item">
                <div class="filter-label">机房：</div>
                <div class="filter-content">
                  <el-select
                    v-model="stationName4"
                    clearable
                    placeholder="请选择"
                    @change="() => nextTick(() => getList())"
                    size="small"
                    style="width: 180px"
                  >
                    <el-option
                      v-for="(item, idx) in stationList4"
                      :key="'list3_' + idx"
                      :label="item"
                      :value="item"
                    />
                  </el-select>
                </div>
              </div>

              <div class="tools-filter-item">
                <div class="filter-label">锁具名称：</div>
                <div class="filter-content">
                  <el-input @input="getList" placeholder="请输入锁具名称..." v-model="filter.name" size="small"></el-input>
                  <el-input
                    @input="getList"
                    placeholder="请输入锁具名称..."
                    v-model="filter.name"
                    size="small"
                  ></el-input>
                </div>
              </div>
              <div class="tools-filter-item">
                <div class="filter-label">生效状态：</div>
                <div class="filter-content">
                  <el-select v-model="filter.type" placeholder="请选择" @change="getList" size="small"
                    style="width: 180px">
                  <el-select
                    v-model="filter.type"
                    placeholder="请选择"
                    @change="getList"
                    size="small"
                    style="width: 180px"
                  >
                    <el-option label="全部" value="" />
                    <el-option label="生效" :value="1" />
                    <el-option label="已取消" :value="2" />
@@ -115,23 +231,52 @@
                </div>
              </div>
            </div>
            <el-button type="primary" size="small" :icon="Search" @click="getList">查询</el-button>
            <el-button type="primary" size="small" @click="getList"
              ><svg-icon icon-class="search"></svg-icon>查询</el-button
            >
          </div>
          <div class="page-content-table">
            <div class="pos-rel">
              <div class="pos-abs">
                <el-table stripe :data="tableData" border style="width: 100%; height: 100%">
                  <el-table-column type="index" width="50" />
                <el-table
                  stripe
                  :data="tableData"
                  border
                  style="width: 100%; height: 100%"
                >
                  <el-table-column type="index" fixed="left" width="50" />
                  <el-table-column prop="lockId" label="锁具ID" width="180" />
                  <el-table-column prop="lockName" label="锁具名称" width="180" />
                  <el-table-column prop="areaPath" label="关联区域" />
                  <el-table-column
                    prop="lockName"
                    label="锁具名称"
                    width="180"
                  />
                  <el-table-column prop="stationName" label="机房" />
                  <el-table-column prop="state" label="生效状态" width="180" />
                  <el-table-column prop="startTime" label="开始时间" width="180" />
                  <el-table-column prop="stopTime" label="结束时间" width="180" />
                  <el-table-column align="center" fixed="right" label="操作" width="200">
                  <el-table-column
                    prop="startTime"
                    label="开始时间"
                    width="180"
                  />
                  <el-table-column
                    prop="stopTime"
                    label="结束时间"
                    width="180"
                  />
                  <el-table-column
                    align="center"
                    fixed="right"
                    label="操作"
                    width="200"
                  >
                    <template #default="scope">
                      <el-button type="primary" size="small" :disabled="scope.row.lockState == -1"
                        @click="viewRecord(scope)">取消</el-button>
                      <el-button
                        type="primary"
                        size="small"
                        v-if="scope.row.type == 1"
                        @click="cancel(scope)"
                        >取消</el-button
                      >
                    </template>
                  </el-table-column>
                </el-table>
@@ -141,21 +286,37 @@
          <div class="page-content-page">
            <div class="page-tool"></div>
            <div class="el-page-container">
              <el-pagination v-model:current-page="pageNum" v-model:page-size="pageSize"
                :page-sizes="[10,20, 40, 60, 80, 100, 200, 300, 400]" size="small"
                layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange"
                @current-change="handleCurrentChange" />
              <el-pagination
                v-model:current-page="pageNum"
                v-model:page-size="pageSize"
                :page-sizes="[10,20, 40, 60, 80, 100, 200, 300, 400]"
                size="small"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total"
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
              />
            </div>
            <div class="page-tool"></div>
          </div>
        </div>
      </hdw-card>
      </yc-card>
    </div>
    <div class="page-footer"></div>
    <!-- 编辑 新建 -->
    <el-dialog v-model="addVisible" title="新增计划" width="500" align-center :close-on-click-modal="false" :z-index="1000">
      <add-task v-if="addVisible" @close="addVisible = false"
        @ok="okHandle"></add-task>
    <el-dialog
      v-model="addVisible"
      title="新增计划"
      width="500"
      align-center
      :close-on-click-modal="false"
      :z-index="1000"
    >
      <add-task
        v-if="addVisible"
        @close="addVisible = false"
        @ok="okHandle"
      ></add-task>
    </el-dialog>
  </div>
</template>
@@ -205,7 +366,7 @@
}

.hdw-card-container {
  width: 240px;
  width: 320px;
  padding-right: 8px;
  height: 100%;
}
@@ -279,4 +440,4 @@
:deep(.el-dialog__body) {
  flex: 1;
}
</style>
</style>