<template>
  <tui-card style="margin-top: 20rpx;">
    <template>
      <view class="tui-default">
        <tui-form-item label="项目部:"
                       labelFontWeight="600">
          <tui-input padding="0"
                     :borderBottom="false"
                     placeholder="请选择项目部"
                     disabled
                     backgroundColor="transparent"
                     v-model="form.find_problem_org_name"></tui-input>
          <template v-slot:right>
            <tui-form-button width="100rpx"
                             height="60rpx"
                             background="#f2f2f2"
                             color="#5677fc"
                             :size="24"
                             bold
                             radius="12rpx"
                             @click="clickProjectDepartment">选择</tui-form-button>
            <tui-bottom-popup :zIndex="1002"
                              :maskZIndex="1001"
                              :show="isShowProjectDepartment"
                              @close="hideProjectDepartment">
              <tui-cascade-selection height="300px"
                                     :itemList="tuiCascadeSelection"
                                     @complete="changeProjectDepartment">
              </tui-cascade-selection>
            </tui-bottom-popup>
          </template>
        </tui-form-item>
      </view>
    </template>
  </tui-card>
</template>
<script>
import { mapState } from "vuex";
export default {
  data() {
    return {
      isShowProjectDepartment: false,
    };
  },
  computed: {
    ...mapState(["tuiCascadeSelection"]),
  },
  methods: {
    clickProjectDepartment() {
      this.isShowProjectDepartment = true;
    },
    hideProjectDepartment() {
      this.isShowProjectDepartment = false;
    },
    changeProjectDepartment(data) {
      this.form.find_problem_company_deptcode = data.result[0].value.deptcode;
      this.form.find_problem_company_id = data.result[0].value.id;
      this.form.find_problem_company_name = data.result[0].text;
      //组织
      this.form.find_problem_org_deptcode = data.result[1].value.deptcode;
      this.form.find_problem_org_id = data.result[1].value.id;
      this.form.find_problem_org_name = data.result[1].text;
    },
  },
};
</script>