zhanghua
2023-12-04 e6443cf405d4e950abe35a29e6c133d097fc1ad5
src/views/systemSetting/baseSetting/user/components/header/index.vue
@@ -6,12 +6,24 @@
                <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="60%" v-if="dialogCreate"
                <el-dialog :visible.sync="dialogCreate" title="新增账户" width="800px" v-if="dialogCreate"
                    :before-close="handleClose">
                    <createUser @sendDialog="sendDialog" />
                </el-dialog>
@@ -21,6 +33,9 @@
</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,
@@ -32,7 +47,44 @@
        }
    },
    methods: {
        setSearch() {
      // 导出
      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) {
@@ -53,57 +105,48 @@
}
</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>