zhanghua
2023-03-23 394e444b3d6f20da250f89a5bc72c8ce782d5528
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
<template>
    <header>
        <div class="headerContent">
            <div class="search">
                <span>筛选条件:</span>
                <el-input placeholder="请输入内容" v-model="search"></el-input>
                <div class="findBtn">
                    <el-button class="find-Btn" type="primary" @click="setSearch">查询</el-button>
                  <el-upload style="margin-top: -5px;"
                      class="department-margin-left10"
                      action=""
                      ref="uploadFile"
                      :http-request="importTable"
                      :show-file-list="false"
                      :auto-upload="true"
                      :limit="1"
                  >
                    <el-button type="primary">导入</el-button>
                  </el-upload>
                  <el-button class="department-margin-left10" type="primary" @click="exportTable()">导出</el-button>
                </div>
            </div>
            <div class="addUser">
                <!-- :before-close="handleClose" -->
                <el-button class="addBtn button-addition" type="primary" @click="dialogCreate = true">添加用户</el-button>
                <el-dialog :visible.sync="dialogCreate" title="新增账户" width="800px" v-if="dialogCreate"
                    :before-close="handleClose">
                    <createUser @sendDialog="sendDialog" />
                </el-dialog>
            </div>
        </div>
    </header>
</template>
<script>
import createUser from "../createUser";
import {exportTeamInfoDepartment, importTeamInfoDepartment} from "@/api/system/department";
import {downloadFile} from "@/utils/helper";
import {exportUser, importUser} from "@/api/system/user";
export default {
    components: {
        createUser,
    },
    data() {
        return {
            dialogCreate: false,
            search: '',
        }
    },
    methods: {
      // 导出
      exportTable() {
        // const status = this.searchStatus === 2 ? null : this.searchStatus;
        exportUser({
          // current: this.currentPage,
          // size: this.pageSize,
          // departName: this.searchDepartment,
          // status,
        })
            .then((res) => {
              console.log(res)
              downloadFile(res);
              this.$message({ type: "success", message: "操作成功" });
            })
            .catch((err) => {
              this.$message({ type: "error", message: err });
            });
      },
 
      // 导入
      importTable(file) {
        const formData = new FormData();
        formData.append("file", file.file);
        console.log(formData)
        console.log(file)
        importUser(formData)
            .then(() => {
              this.$message({ type: "success", message: "操作成功" });
              this.setSearch();
              this.$refs.uploadFile.clearFiles();
            })
            .catch((err) => {
              this.$message({ type: "error", message: err });
              this.$refs.uploadFile.clearFiles();
            });
      },
 
      setSearch() {
            this.$emit('getSearch', { text: this.search })
        },
        sendDialog(flag) {
            console.log(flag);
            this.dialogCreate = flag.flag;
            this.$emit('setDialog', { flag: true })
        },
        handleClose(done) {
            this.$confirm('确认关闭?')
                .then(_ => {
                    this.dialogCreate = false;
                    done();
                })
                .catch(_ => { });
        }
    },
    props: ['setDialog', 'getSearch', 'flag'],
}
</script>
<style lang="scss" scoped>
.department-margin-left10{
  margin-left: 10px;
}
header {
    // background-color: #09152f;
    //border: 1px solid #fff;
    .headerContent {
        padding: 0;
        display: flex;
        line-height: 100px;
        justify-content: space-between;
        align-items: center;
        .search {
            display: flex;
            justify-content: flex-start;
            span {
                flex: 1;
            }
            .el-input {
                flex: 2;
                // color: #1d3f57;
                &::v-deep .el-input__inner {
                    // background-color: #09152f;
                    // border: 1px solid #17324c;
                }
            }
        }
        .findBtn {
            line-height: 100px;
            margin-left: 15px;
            display: flex;
            align-items: center;
            margin-top: -2px;
            .el-button {
                padding: 12px 25px;
            }
        }
        .addBtn {
            background-color: #409EFF;
            border: none;
            padding: 12px 30px;
        }
    }
}
</style>