dy-admin-manager/src/views/main/cloudDate/modals/headers.vue

<template>
  <div>
    <div class="titleWrap">
      <div class="box">
        <span class="shape"></span>
        <span>{{ title }}</span>
      </div>
      <div class="right">
        <el-select
          v-if="!hidenOrgan"
          size="mini"
          class="multiple"
          v-model.trim="organId"
          filterable
          clearable
          placeholder="请选择分部"
          @change="changeOrgan"
        >
          <el-option
            v-for="(item, index) in special?specialList:selects.branchs"
            :key="index"
            :label="item.name"
            :value="item.id"
          ></el-option>
        </el-select>
      </div>
    </div>
    <el-divider></el-divider>
  </div>
</template>
<script>
export default {
  props: ["title", "hidenOrgan",'special'],
  data() {
    return {
      organId: "",
      specialList: [],
    };
  },
  async mounted() {
    await this.$store.dispatch("setBranchs");
    const arr = [36,39,41,42,43,44,45,46,47,48,49,50,52,54,55,56]
    this.specialList = this.selects.branchs.filter((item) => {
      return arr.indexOf(item.id) == -1;
    });
  },
  methods: {
    changeOrgan(val) {
      this.organId = val;
      this.$emit("changeOrgan", val);
    },
  },
};
</script>

<style lang="scss" scoped>
.el-divider--horizontal {
  margin-top: 0 !important;
}
.titleWrap {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  height: 55px;
}
</style>