<style>
  .baseSet_Title {
    width: 120px !important;
    padding: 18px 0 0 16px;
    text-align: right;
  }

</style>
<template>
  <div class="page-body">
    <div class="col row wrap">
      <div class="col-2 baseSet_Title">
        公告审批人：
      </div>
      <div class="col-3">
        <q-select option-value="Id" option-label="EmployeeName" color="primary" filled
          :rules="[val => !!val|| '请选择公告审批人']" v-model="msg.Content" use-input clearable @filter="filterFn"
          :options="EmployeeListOption" emit-value map-options ref="Admin">
          <template v-slot:no-option>
            <q-item>
              <q-item-section class="text-grey">
                未找到相关数据
              </q-item-section>
            </q-item>
          </template>
        </q-select>
      </div>
      <div class="col-3" style="padding:18px 0 0 10px;color:gray">
      </div>
    </div>
    <div class="col row wrap">
      <div class="col-2 baseSet_Title">
      </div>
      <div class="col-3">
        <q-btn label="保存" color="accent q-px-md" style="font-weight:400 !important;margin-top:20px;width:100%;"
          @click="saveInfo" />
      </div>
    </div>

  </div>
</template>
<script>
  import {
    queryEmployee
  } from '../../api/users/user'; //获取业务员
  import {
    setConten,
    getConten
  } from "../../api/system/notiveSysSet"
  export default {
    meta: {
      title: "公告系统设置"
    },
    props: {},
    components: {},
    data() {
      return {
        msg: {
          Content: 0
        },
        EmployeeListOption: [],
        allEmployeeListOption: [],
      }
    },
    created() {},
    mounted() {
      this.getEmployee(0);
      this.getData();
    },
    methods: {
      //获取业务员
      getEmployee(id) {
        var qMsg = {
          Dept_Id: 0
        }
        qMsg.Dept_Id = id;
        queryEmployee(qMsg).then(res => {
          if (res.Code == 1) {
            this.EmployeeListOption = res.Data;
            this.allEmployeeListOption = res.Data;
          }
        }).catch(() => {})
      },
      //筛选员工
      filterFn(val, update) {
        update(() => {
          if (val === '') {
            this.EmployeeListOption = JSON.parse(JSON.stringify(this.allEmployeeListOption))
          } else {
            const needle = val.toLowerCase();
            this.EmployeeListOption = this.allEmployeeListOption.filter(v => v.EmployeeName.toLowerCase().indexOf(
              needle) > -1);
          }
        })
      },
      getData() {
        getConten({}).then(res => {
          if (res.Code === 1) {
            this.msg.Content = parseInt(res.Data.Content)
          }
        })
      },
      saveInfo() {
        this.$refs.Admin.validate();
        if (!this.$refs.Admin.hasError) {
          setConten(this.msg).then(res => {
            if (res.Code === 1) {
              this.$message.success('操作成功')
              this.getConten();
            } else {
              this.$message.error(res.Message)
            }
          })
        }
      }
    },
  }

</script>
<style lang="sass">
  @import url('~assets/css/table.sass')

</style>
