<el-main>
  <!--面包屑-->
  <breadcrumb-component ></breadcrumb-component>
  <el-container class="detail-container">
    <el-container>
    <el-aside width="300px" class="inner-left">
      <el-input
        placeholder="输入关键字进行过滤"
        v-model="filterText">
      </el-input>

      <el-tree
        node-key="id"
        class="filter-tree"
        :data="treeData"
        :props="defaultProps"
        default-expand-all
        highlight-current
        :expand-on-click-node="false"
        :filter-node-method="filterNode"
        ref="topicTree"
        @node-click="getCurrentTreeNode"
        :render-content="renderContent">
      </el-tree>
    </el-aside>

    <el-main class="inner-main">
      <!--下面是新建-->
      <el-form label-width="200px" label-position="right" class="create-form-outline-full-screen no-head-space "  :model="formInfo"    ref="formInfo" >

        <el-form-item label="主题名称" prop="name"
          :rules="[{ required: true, message: '主题名称不能为空', trigger: 'blur'  },
                  { max: 10, message: '字数不能超过10', trigger: 'change' }]">
          <el-input  class="normal-width" :disabled="readonly" v-model.trim="formInfo.name" placeholder="请输入"></el-input>
        </el-form-item>

        <el-form-item  label="上级主题"  prop="pcode"  :rules="[{ required: true, message: '上级主题不能为空', trigger: 'change'  }]">
          <simple-select-tree
            :disabled="readStatus"
            :className="'normal-width'"
            v-model="formInfo.pcode"
            :defaultExpandAll="true"
            :treeData="parentTreeData">
          </simple-select-tree>
        </el-form-item>

        <el-form-item label="主题描述" prop="description" :rules="[{ max: 50, message: '字数不能超过50', trigger: 'change' }]">
          <el-input  class="normal-width" :disabled="readonly" type="textarea" v-model="formInfo.description" placeholder="请输入"></el-input>
        </el-form-item>

        <el-form-item label="更新时间"  v-show="!!formInfo.id">
          <span>{{formInfo.updateTime}}</span>
        </el-form-item>

        <el-form-item label="更新者"   v-show="!!formInfo.id">
          <span>{{formInfo.updateUserName}}</span>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="add"  v-if="!formInfo.id"  >确定</el-button>
          <el-button type="primary" @click="update"  v-if="!!formInfo.id && readStatus===false"  >确定</el-button>
        </el-form-item>

      </el-form>
    </el-main>
    </el-container>
  </el-container>
</el-main>








