zhanghua
2022-11-16 cc9ddf2ecaf3ad935374f49c842227f7eb15779d
src/views/systemSetting/device/bayonet/index.vue
@@ -4,7 +4,7 @@
            <div class="header-content">
                <div class="search">
                    <span style="padding-right:20px">筛选条件:</span>
                    <el-select v-model="context" placeholder="请选择">
                    <el-select v-model="context" placeholder="请选择" @change="getBayonetListData">
                        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                        </el-option>
                    </el-select>
@@ -14,24 +14,24 @@
        <main>
            <div class="main-content">
                <div class="main-title">
                    <el-button class="el-icon-plus" type="primary" @click="dialogCreate = true">添加</el-button>
                    <el-button class="el-icon-plus" type="primary" @click="showDialog(false, null)">添加</el-button>
                    <el-button @click="handleExport">导出卡口</el-button>
                </div>
                <!-- 数据展示 -->
                <MyTable
                <MyTable
                    :tableOption="tableOption" 
                    :tableData="list" 
                    :pageShow="false">
                    <template #operation="info">
                        <el-link :underline="false" style="color:#4b9bb7">编辑</el-link>
                        <el-link :underline="false" style="color:#4b9bb7" @click="showDialog(true, info)">编辑</el-link>
                    </template>
                </MyTable>
            </div>
        </main>
        <footer>
            <!-- 添加卡口 -->
            <el-dialog title="添加卡口" :visible.sync="dialogCreate" width="60%" :before-close="handleClose">
                <MyCreate :addBayonet="addBayonet"></MyCreate>
            <el-dialog :title="getDialogTitle" :visible.sync="isShowDialog" width="60%" :before-close="handleClose">
                <MyCreate @closeDialog="closeDialog" :originalBayonet="originalBayonet" :isEdit="isEdit"></MyCreate>
            </el-dialog>
        </footer>
    </div>
@@ -39,16 +39,16 @@
<script>
import MyCreate from './create'
import MyTable from '@/components/Table'
import {myDownLoad} from '@/utils/helper'
import { createNamespacedHelpers } from "vuex";
const { mapActions } = createNamespacedHelpers("bayonet");
import bayonet from "@/api/system/bayonet";
import {downloadFile} from "@/utils/helper";
export default {
    components: {
        MyCreate, MyTable,
    },
    data() {
        return {
            dialogCreate: false,
            isShowDialog: false,
            context: 0,
            options: [
                {
@@ -75,11 +75,6 @@
                        type: 'text',
                        prop: 'latitude',
                    },
                    // {
                    //     label: '所属区域',
                    //     type: 'text',
                    //     prop: '',
                    // },
                    {
                        label: '域名/IP',
                        type: 'text',
@@ -107,39 +102,56 @@
                    },
                ]
            },
          originalBayonet: null,
          isEdit: false
        }
    },
    computed: {
      getDialogTitle() {
        return this.isEdit ? '编辑卡口' : '新建卡口';
      },
    },
    created() {
        const { setTableData } = this;
        setTableData();
      this.getBayonetListData();
    },
    methods: {
        // 弹窗关闭
        handleClose(done) {
            this.$confirm('确认关闭?')
                .then(_ => {
                    done();
                })
        },
        ...mapActions(['getBayonetList', 'exportBayonetList','addBayonet']),
        // 设置tableData
        async setTableData() {
            const { current, size, context } = this;
            let arr = await this.getBayonetList({
                // bayonetName:context,
                current, size
      getBayonetListData() {
        bayonet.getBayonetList({ bayonetName: '', current: this.current, size: this.size })
            .then(data => {
              this.list = data;
            })
            this.list = arr.data.data
        },
        // 导出
        async handleExport(){
            const { current, size, context } = this;
            let arr = await this.exportBayonetList({
                current, size
            .catch(err => {
              this.$message({ type: 'error', message: err });
            })
            myDownLoad(arr);
            console.log(arr);
        }
      },
      // 弹窗关闭
      handleClose(done) {
          this.$confirm('确认关闭?')
              .then(_ => {
                  done();
              })
      },
      closeDialog() {
        this.isShowDialog = false;
      },
      handleExport() {
        bayonet.exportBayonetList({ bayonetName: this.context, current: this.current, size: this.size })
            .then(res => {
              downloadFile(res);
              this.$message({ type: 'success', message: '操作成功' });
            })
            .catch(err => {
              this.$message({ type: 'error', message: err });
            })
      },
      showDialog(isEdit, data) {
        this.isShowDialog = true;
        this.isEdit = isEdit;
        this.originalBayonet = data;
      }
    }
}
</script>
@@ -151,7 +163,6 @@
    header {
        background-color: #09152f;
        border: 1pox solid #fff;
        .header-content {
            padding: 0 40px;
@@ -186,7 +197,6 @@
        background-color: #09152f;
        margin-top: 20px;
        padding-bottom: 50px;
        border: 1pox solid #fff;
        .main-title {
            line-height: 60px;