项目人员选择功能修改

src/views/modules/sys/project/AssessForm.vue

@@ -87,39 +87,51 @@
               <el-input v-model="inputForm.documentNum" placeholder="请填写文号"     ></el-input>
             </el-form-item>
           </el-col>
+
           <el-col :span="12">
-            <el-form-item label="项目负责人" prop="projectHead"
-                          :rules="[
-                 ]">
-              <el-input v-model="inputForm.projectHead" placeholder="请填写项目负责人"     ></el-input>
+            <el-form-item prop="projectHead" :rules=" [{required: true, message: '项目负责人不能为空', trigger: 'blur'}]" label="项目负责人">
+              <SelectUserTree
+                ref="companyTree"
+                :props="{
+                    value: 'id',             // ID字段名
+                    label: 'name',         // 显示名称
+                    children: 'children'    // 子级字段名
+                  }"
+                :url="`/sys/user/treeUserDataAllOffice?type=2`"
+                :value="inputForm.projectHead"
+                :clearable="true"
+                :accordion="true"
+                :disabled="method==='view'"
+                @getValue="(value) => {inputForm.projectHead=value}"/>
             </el-form-item>
           </el-col>
+
           <el-col :span="12">
             <el-form-item label="废旧物资评估(万元)" prop="waystEvaluation"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.waystEvaluation" placeholder="请填写废旧物资评估"     ></el-input>
+              <el-input v-model="inputForm.waystEvaluation" placeholder="请填写废旧物资评估" @keyup.native="inputForm.waystEvaluation = twoDecimalPlaces(inputForm.waystEvaluation)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="固定资产评估(万元)" prop="fixedAssetsEvaluation"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.fixedAssetsEvaluation" placeholder="请填写固定资产评估"     ></el-input>
+              <el-input v-model="inputForm.fixedAssetsEvaluation" placeholder="请填写固定资产评估" @keyup.native="inputForm.fixedAssetsEvaluation = twoDecimalPlaces(inputForm.fixedAssetsEvaluation)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="净资产评估" prop="netAssetsEvaluation"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.netAssetsEvaluation" placeholder="请填写净资产评估"     ></el-input>
+              <el-input v-model="inputForm.netAssetsEvaluation" placeholder="请填写净资产评估" @keyup.native="inputForm.netAssetsEvaluation = twoDecimalPlaces(inputForm.netAssetsEvaluation)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="租金评估(万/年)" prop="rentEvaluation"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.rentEvaluation" placeholder="请填写租金评估"     ></el-input>
+              <el-input v-model="inputForm.rentEvaluation" placeholder="请填写租金评估" @keyup.native="inputForm.rentEvaluation = twoDecimalPlaces(inputForm.rentEvaluation)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -133,16 +145,28 @@
             <el-form-item label="报告收费(元)" prop="reportCharges"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.reportCharges" placeholder="请填写报告收费"     ></el-input>
+              <el-input v-model="inputForm.reportCharges" placeholder="请填写报告收费" @keyup.native="inputForm.reportCharges = twoDecimalPlaces(inputForm.reportCharges)"></el-input>
             </el-form-item>
           </el-col>
+
           <el-col :span="12">
-            <el-form-item label="当前处理人" prop="currentDisposePerson"
-                          :rules="[
-                 ]">
-              <el-input v-model="inputForm.currentDisposePerson" placeholder="请填写当前处理人"     ></el-input>
+            <el-form-item prop="currentDisposePerson" :rules=" [{trigger: 'blur'}]" label="当前处理人">
+              <SelectUserTree
+                ref="companyTree"
+                :props="{
+                    value: 'id',             // ID字段名
+                    label: 'name',         // 显示名称
+                    children: 'children'    // 子级字段名
+                  }"
+                :url="`/sys/user/treeUserDataAllOffice?type=2`"
+                :value="inputForm.currentDisposePerson"
+                :clearable="true"
+                :accordion="true"
+                :disabled="method==='view'"
+                @getValue="(value) => {inputForm.currentDisposePerson=value}"/>
             </el-form-item>
           </el-col>
+
           <el-col :span="12">
             <el-form-item label="是否开票" prop="isInvoice"
                           :rules="[
@@ -168,10 +192,10 @@
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="预估/实际收费(元）" prop="actualCharges"
+            <el-form-item label="预估/实际收费(万元）" prop="actualCharges"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.actualCharges" placeholder="请填写预估/实际收费"     ></el-input>
+              <el-input v-model="inputForm.actualCharges" placeholder="请填写预估/实际收费" @keyup.native="inputForm.actualCharges = twoDecimalPlaces(inputForm.actualCharges)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -208,7 +232,7 @@
             <el-form-item label="报销外勤天数" prop="opsAmount"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.opsAmount" placeholder="请填写报销外勤天数"     ></el-input>
+              <el-input v-model="inputForm.opsAmount" placeholder="请填写报销外勤天数" @keyup.native="inputForm.opsAmount = positiveInteger(inputForm.opsAmount)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -235,14 +259,14 @@
             <el-form-item label="已报销金额" prop="reimbursementAmount"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.reimbursementAmount" placeholder="请填写已报销金额"     ></el-input>
+              <el-input v-model="inputForm.reimbursementAmount" placeholder="请填写已报销金额" @keyup.native="inputForm.reimbursementAmount = twoDecimalPlaces(inputForm.reimbursementAmount)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="未报销金额" prop="unreimbursedAmount"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.unreimbursedAmount" placeholder="请填写未报销金额"     ></el-input>
+              <el-input v-model="inputForm.unreimbursedAmount" placeholder="请填写未报销金额" @keyup.native="inputForm.unreimbursedAmount = twoDecimalPlaces(inputForm.unreimbursedAmount)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -266,18 +290,40 @@
               </el-date-picker>
             </el-form-item>
           </el-col>
+
           <el-col :span="12">
-            <el-form-item label="签字评估师1" prop="evaluationPersonOne"
-                          :rules="[
-                 ]">
-              <el-input v-model="inputForm.evaluationPersonOne" placeholder="请填写签字评估师1"     ></el-input>
+            <el-form-item prop="evaluationPersonOne" :rules=" [{trigger: 'blur'}]" label="签字评估师1">
+              <SelectUserTree
+                ref="companyTree"
+                :props="{
+                    value: 'id',             // ID字段名
+                    label: 'name',         // 显示名称
+                    children: 'children'    // 子级字段名
+                  }"
+                :url="`/sys/user/treeUserDataAllOffice?type=2`"
+                :value="inputForm.evaluationPersonOne"
+                :clearable="true"
+                :accordion="true"
+                :disabled="method==='view'"
+                @getValue="(value) => {inputForm.evaluationPersonOne=value}"/>
             </el-form-item>
           </el-col>
+
           <el-col :span="12">
-            <el-form-item label="签字评估师2" prop="evaluationPersonTwo"
-                          :rules="[
-                 ]">
-              <el-input v-model="inputForm.evaluationPersonTwo" placeholder="请填写签字评估师2"     ></el-input>
+            <el-form-item prop="evaluationPersonTwo" :rules=" [{trigger: 'blur'}]" label="签字评估师2">
+              <SelectUserTree
+                ref="companyTree"
+                :props="{
+                    value: 'id',             // ID字段名
+                    label: 'name',         // 显示名称
+                    children: 'children'    // 子级字段名
+                  }"
+                :url="`/sys/user/treeUserDataAllOffice?type=2`"
+                :value="inputForm.evaluationPersonTwo"
+                :clearable="true"
+                :accordion="true"
+                :disabled="method==='view'"
+                @getValue="(value) => {inputForm.evaluationPersonTwo=value}"/>
             </el-form-item>
           </el-col>
           <!--<el-col :span="12">
@@ -355,7 +401,6 @@
           </vxe-table>
           </div>
 
-        </el-row>
       </el-form>
       <el-image-viewer
         v-if="showViewer"
@@ -372,6 +417,7 @@
 
 <script>
   import ProjectService from '@/api/sys/ProjectService'
+  import SelectUserTree from '@/views/modules/utils/treeUserSelect'
   import OSSSerive, {
     httpRequest,
     handleRemove,
@@ -442,7 +488,10 @@
         showVi: true
       }
     },
-    components: { ElImageViewer },
+    components: {
+      ElImageViewer,
+      SelectUserTree
+    },
     projectService: null,
     ossService: null,
     created () {
@@ -614,11 +663,10 @@
               item.attachmentName = item.name
               this.inputForm.workAttachments.push(item)
             })
-            console.log('workAttachments', this.inputForm.workAttachments)
-            if (this.inputForm.evaluationReportDateUi === null || this.inputForm.evaluationReportDateUi === undefined || this.inputForm.evaluationReportDateUi === undefined) {
-              this.inputForm.status = '5'
-            } else {
+            if (this.inputForm.evaluationReportDateUi === null || this.inputForm.evaluationReportDateUi === undefined || this.inputForm.evaluationReportDateUi === '') {
               this.inputForm.status = '1'
+            } else {
+              this.inputForm.status = '5'
             }
             this.projectService.save(this.inputForm).then(({data}) => {
               this.close()
@@ -717,6 +765,50 @@
         if (row.id !== null && row.id !== '' && row.id !== undefined) {
           this.ossService.deleteMsgById(row.id)
         }
+      },
+      twoDecimalPlaces (num) {
+        let str = num.toString()
+        var len1 = str.substr(0, 1)
+        var len2 = str.substr(1, 1)
+        // eslint-disable-next-line eqeqeq
+        if (str.length > 1 && len1 == 0 && len2 != '.') {
+          str = str.substr(1, 1)
+        }
+        // eslint-disable-next-line eqeqeq
+        if (len1 == '.') {
+          str = ''
+        }
+        // eslint-disable-next-line eqeqeq
+        if (str.indexOf('.') != -1) {
+          var str_ = str.substr(str.indexOf('.') + 1)
+          // eslint-disable-next-line eqeqeq
+          if (str_.indexOf('.') != -1) {
+            str = str.substr(0, str.indexOf('.') + str_.indexOf('.') + 1)
+          }
+          if (str_.length > 4) {
+            this.$message.warning(`金额小数点后只能输入四位，请正确输入！`)
+            return (str = '')
+          }
+        }
+        // eslint-disable-next-line no-useless-escape
+        str = str.replace(/[^\d^\.]+/g, '') // 保留数字和小数点
+        return str
+      },
+      positiveInteger (num) {
+        let str = num.toString()
+        var len1 = str.substr(0, 1)
+        var len2 = str.substr(1, 1)
+        // eslint-disable-next-line eqeqeq
+        if (str.length > 1 && len1 == 0 && len2 != '.') {
+          str = str.substr(1, 1)
+        }
+        // eslint-disable-next-line eqeqeq
+        if (len1 == '.') {
+          str = ''
+        }
+        // eslint-disable-next-line no-useless-escape
+        str = str.replace(/[^\d^]+/g, '') // 保留数字
+        return str
       }
     }
   }

src/views/modules/sys/project/ConsultationForm.vue

@@ -87,39 +87,52 @@
               <el-input v-model="inputForm.documentNum" placeholder="请填写文号"     ></el-input>
             </el-form-item>
           </el-col>
+
           <el-col :span="12">
-            <el-form-item label="项目负责人" prop="projectHead"
-                          :rules="[
-                 ]">
-              <el-input v-model="inputForm.projectHead" placeholder="请填写项目负责人"     ></el-input>
+            <el-form-item prop="projectHead" :rules=" [{required: true, message: '项目负责人不能为空', trigger: 'blur'}]" label="项目负责人">
+              <SelectUserTree
+                ref="companyTree"
+                :props="{
+                    value: 'id',             // ID字段名
+                    label: 'name',         // 显示名称
+                    children: 'children'    // 子级字段名
+                  }"
+                :url="`/sys/user/treeUserDataAllOffice?type=2`"
+                :value="inputForm.projectHead"
+                :clearable="true"
+                :accordion="true"
+                :disabled="method==='view'"
+                @getValue="(value) => {inputForm.projectHead=value}"/>
             </el-form-item>
           </el-col>
+
+
           <el-col :span="12">
             <el-form-item label="废旧物资评估(万元)" prop="waystEvaluation"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.waystEvaluation" placeholder="请填写废旧物资评估"     ></el-input>
+              <el-input v-model="inputForm.waystEvaluation" placeholder="请填写废旧物资评估" @keyup.native="inputForm.waystEvaluation = twoDecimalPlaces(inputForm.waystEvaluation)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="固定资产评估(万元)" prop="fixedAssetsEvaluation"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.fixedAssetsEvaluation" placeholder="请填写固定资产评估"     ></el-input>
+              <el-input v-model="inputForm.fixedAssetsEvaluation" placeholder="请填写固定资产评估" @keyup.native="inputForm.fixedAssetsEvaluation = twoDecimalPlaces(inputForm.fixedAssetsEvaluation)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="净资产评估" prop="netAssetsEvaluation"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.netAssetsEvaluation" placeholder="请填写净资产评估"     ></el-input>
+              <el-input v-model="inputForm.netAssetsEvaluation" placeholder="请填写净资产评估" @keyup.native="inputForm.netAssetsEvaluation = twoDecimalPlaces(inputForm.netAssetsEvaluation)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="租金评估(万/年)" prop="rentEvaluation"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.rentEvaluation" placeholder="请填写租金评估"     ></el-input>
+              <el-input v-model="inputForm.rentEvaluation" placeholder="请填写租金评估" @keyup.native="inputForm.rentEvaluation = twoDecimalPlaces(inputForm.rentEvaluation)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -133,16 +146,28 @@
             <el-form-item label="报告收费(元)" prop="reportCharges"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.reportCharges" placeholder="请填写报告收费"     ></el-input>
+              <el-input v-model="inputForm.reportCharges" placeholder="请填写报告收费" @keyup.native="inputForm.reportCharges = twoDecimalPlaces(inputForm.reportCharges)"></el-input>
             </el-form-item>
           </el-col>
+
           <el-col :span="12">
-            <el-form-item label="当前处理人" prop="currentDisposePerson"
-                          :rules="[
-                 ]">
-              <el-input v-model="inputForm.currentDisposePerson" placeholder="请填写当前处理人"     ></el-input>
+            <el-form-item prop="currentDisposePerson" :rules=" [{trigger: 'blur'}]" label="当前处理人">
+              <SelectUserTree
+                ref="companyTree"
+                :props="{
+                    value: 'id',             // ID字段名
+                    label: 'name',         // 显示名称
+                    children: 'children'    // 子级字段名
+                  }"
+                :url="`/sys/user/treeUserDataAllOffice?type=2`"
+                :value="inputForm.currentDisposePerson"
+                :clearable="true"
+                :accordion="true"
+                :disabled="method==='view'"
+                @getValue="(value) => {inputForm.currentDisposePerson=value}"/>
             </el-form-item>
           </el-col>
+
           <el-col :span="12">
             <el-form-item label="是否开票" prop="isInvoice"
                           :rules="[
@@ -168,10 +193,10 @@
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="预估/实际收费(元）" prop="actualCharges"
+            <el-form-item label="预估/实际收费(万元）" prop="actualCharges"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.actualCharges" placeholder="请填写预估/实际收费"     ></el-input>
+              <el-input v-model="inputForm.actualCharges" placeholder="请填写预估/实际收费" @keyup.native="inputForm.actualCharges = twoDecimalPlaces(inputForm.actualCharges)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -208,7 +233,7 @@
             <el-form-item label="报销外勤天数" prop="opsAmount"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.opsAmount" placeholder="请填写报销外勤天数"     ></el-input>
+              <el-input v-model="inputForm.opsAmount" placeholder="请填写报销外勤天数" @keyup.native="inputForm.opsAmount = positiveInteger(inputForm.opsAmount)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -235,14 +260,14 @@
             <el-form-item label="已报销金额" prop="reimbursementAmount"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.reimbursementAmount" placeholder="请填写已报销金额"     ></el-input>
+              <el-input v-model="inputForm.reimbursementAmount" placeholder="请填写已报销金额" @keyup.native="inputForm.reimbursementAmount = twoDecimalPlaces(inputForm.reimbursementAmount)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="未报销金额" prop="unreimbursedAmount"
                           :rules="[
                  ]">
-              <el-input v-model="inputForm.unreimbursedAmount" placeholder="请填写未报销金额"     ></el-input>
+              <el-input v-model="inputForm.unreimbursedAmount" placeholder="请填写未报销金额" @keyup.native="inputForm.unreimbursedAmount = twoDecimalPlaces(inputForm.unreimbursedAmount)"></el-input>
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -266,20 +291,43 @@
               </el-date-picker>
             </el-form-item>
           </el-col>
+
           <el-col :span="12">
-            <el-form-item label="签字评估师1" prop="evaluationPersonOne"
-                          :rules="[
-                 ]">
-              <el-input v-model="inputForm.evaluationPersonOne" placeholder="请填写签字评估师1"     ></el-input>
+            <el-form-item prop="evaluationPersonOne" :rules=" [{trigger: 'blur'}]" label="签字评估师1">
+              <SelectUserTree
+                ref="companyTree"
+                :props="{
+                    value: 'id',             // ID字段名
+                    label: 'name',         // 显示名称
+                    children: 'children'    // 子级字段名
+                  }"
+                :url="`/sys/user/treeUserDataAllOffice?type=2`"
+                :value="inputForm.evaluationPersonOne"
+                :clearable="true"
+                :accordion="true"
+                :disabled="method==='view'"
+                @getValue="(value) => {inputForm.evaluationPersonOne=value}"/>
             </el-form-item>
           </el-col>
+
           <el-col :span="12">
-            <el-form-item label="签字评估师2" prop="evaluationPersonTwo"
-                          :rules="[
-                 ]">
-              <el-input v-model="inputForm.evaluationPersonTwo" placeholder="请填写签字评估师2"     ></el-input>
+            <el-form-item prop="evaluationPersonTwo" :rules=" [{trigger: 'blur'}]" label="签字评估师2">
+              <SelectUserTree
+                ref="companyTree"
+                :props="{
+                    value: 'id',             // ID字段名
+                    label: 'name',         // 显示名称
+                    children: 'children'    // 子级字段名
+                  }"
+                :url="`/sys/user/treeUserDataAllOffice?type=2`"
+                :value="inputForm.evaluationPersonTwo"
+                :clearable="true"
+                :accordion="true"
+                :disabled="method==='view'"
+                @getValue="(value) => {inputForm.evaluationPersonTwo=value}"/>
             </el-form-item>
           </el-col>
+
           <!--<el-col :span="12">
             <el-form-item label="项目状态" prop="status"
                           :rules="[
@@ -362,7 +410,6 @@
         :on-close="closeViewer"
         :url-list="[url]"
         zIndex="9999"/>
-      </el-form>
       <span slot="footer" class="dialog-footer">
       <el-button size="small" @click="close()" icon="el-icon-circle-close">关闭</el-button>
       <el-button size="small" type="primary" v-if="method != 'view'" @click="doSubmit()" icon="el-icon-circle-check" v-noMoreClick>确定</el-button>
@@ -373,6 +420,7 @@
 
 <script>
   import ProjectService from '@/api/sys/ProjectService'
+  import SelectUserTree from '@/views/modules/utils/treeUserSelect'
   import OSSSerive, {
     httpRequest,
     handleRemove,
@@ -443,7 +491,10 @@
         showVi: true
       }
     },
-    components: { ElImageViewer },
+    components: {
+      ElImageViewer,
+      SelectUserTree
+    },
     projectService: null,
     ossService: null,
     created () {
@@ -595,10 +646,10 @@
               item.attachmentName = item.name
               this.inputForm.workAttachments.push(item)
             })
-            if (this.inputForm.evaluationReportDateUi === null || this.inputForm.evaluationReportDateUi === undefined || this.inputForm.evaluationReportDateUi === undefined) {
-              this.inputForm.status = '5'
-            } else {
+            if (this.inputForm.evaluationReportDateUi === null || this.inputForm.evaluationReportDateUi === undefined || this.inputForm.evaluationReportDateUi === '') {
               this.inputForm.status = '1'
+            } else {
+              this.inputForm.status = '5'
             }
             this.projectService.save(this.inputForm).then(({data}) => {
               this.close()
@@ -691,6 +742,50 @@
         if (row.id !== null && row.id !== '' && row.id !== undefined) {
           this.ossService.deleteMsgById(row.id)
         }
+      },
+      twoDecimalPlaces (num) {
+        let str = num.toString()
+        var len1 = str.substr(0, 1)
+        var len2 = str.substr(1, 1)
+        // eslint-disable-next-line eqeqeq
+        if (str.length > 1 && len1 == 0 && len2 != '.') {
+          str = str.substr(1, 1)
+        }
+        // eslint-disable-next-line eqeqeq
+        if (len1 == '.') {
+          str = ''
+        }
+        // eslint-disable-next-line eqeqeq
+        if (str.indexOf('.') != -1) {
+          var str_ = str.substr(str.indexOf('.') + 1)
+          // eslint-disable-next-line eqeqeq
+          if (str_.indexOf('.') != -1) {
+            str = str.substr(0, str.indexOf('.') + str_.indexOf('.') + 1)
+          }
+          if (str_.length > 4) {
+            this.$message.warning(`金额小数点后只能输入四位，请正确输入！`)
+            return (str = '')
+          }
+        }
+        // eslint-disable-next-line no-useless-escape
+        str = str.replace(/[^\d^\.]+/g, '') // 保留数字和小数点
+        return str
+      },
+      positiveInteger (num) {
+        let str = num.toString()
+        var len1 = str.substr(0, 1)
+        var len2 = str.substr(1, 1)
+        // eslint-disable-next-line eqeqeq
+        if (str.length > 1 && len1 == 0 && len2 != '.') {
+          str = str.substr(1, 1)
+        }
+        // eslint-disable-next-line eqeqeq
+        if (len1 == '.') {
+          str = ''
+        }
+        // eslint-disable-next-line no-useless-escape
+        str = str.replace(/[^\d^]+/g, '') // 保留数字
+        return str
       }
     }
   }

src/views/modules/utils/treeUserSelect.vue

@@ -0,0 +1,288 @@
+<template>
+  <el-select :value="valueTitle" :size="size"  :disabled="disabled" :clearable="clearable" :placeholder="placeholderText" @clear="clearHandle">
+    <el-option :value="valueTitle"  :label="valueTitle" class="options">
+      <el-tree  id="tree-option"
+        ref="selectTree"
+        :accordion="accordion"
+        :data="optionData"
+        :show-checkbox="showCheckbox"
+        :props="props"
+        highlight-current
+        :node-key="props.value"
+        :default-expanded-keys="defaultExpandedKey"
+        @check-change="handleCheckChange"
+        @node-click="handleNodeClick">
+      </el-tree>
+    </el-option>
+  </el-select>
+</template>
+
+<script>
+export default {
+  name: 'el-tree-select',
+  props: {
+    /* 配置项 */
+    props: {
+      type: Object,
+      default: () => {
+        return {
+          value: 'id',             // ID字段名
+          label: 'label',         // 显示名称
+          children: 'children'    // 子级字段名
+        }
+      }
+    },
+    /* 选项列表数据(树形结构的对象数组) */
+    data: {
+      type: Array,
+      default: () => { return [] }
+    },
+     /* 选项列表数据(树形结构的对象数组) */
+    list: {
+      type: Array,
+      default: () => { return null }
+    },
+    /* 初始值 */
+    value: {
+      type: String,
+      default: () => { return null }
+    },
+        /* 初始值 */
+    url: {
+      type: String,
+      default: () => { return null }
+    },
+    disabled: {
+      type: Boolean,
+      dafault: () => { return false }
+    },
+    showCheckbox: {
+      type: Boolean,
+      dafault: () => { return false }
+    },
+    /* 初始值 */
+    label: {
+      type: String,
+      default: () => { return null }
+    },
+    /* 可清空选项 */
+    clearable: {
+      type: Boolean,
+      default: () => { return true }
+    },
+    /* 自动收起 */
+    accordion: {
+      type: Boolean,
+      default: () => { return false }
+    },
+    size: {
+      type: String,
+      default: () => { return 'small' }
+    },
+    placeholder: {
+      type: String,
+      default: () => { return '请选择' }
+    },
+    isOnlySelectLeaf: {
+      type: Boolean,
+      default: () => {
+        return false
+      }
+    }
+  },
+  data () {
+    return {
+      valueId: this.value,    // 初始值
+      valueTitle: this.label,
+      defaultExpandedKey: [],
+      placeholderText: this.placeholder,
+      treeList: [],
+      valueData: this.data
+    }
+  },
+  created () {
+    if (this.url !== null) {
+      this.placeholderText = '加载数据中...'
+      let interval = setInterval(() => {
+        this.placeholderText = this.placeholderText + '.'
+      }, 500)
+      this.$http({
+        url: this.url,
+        method: 'get'
+      }).then(({data}) => {
+        this.valueData = data
+        this.setTreeList(this.valueData)
+        this.$nextTick(() => {
+          this.initHandle()
+          this.placeholderText = this.placeholder
+          clearInterval(interval)
+        })
+      })
+    } else {
+      this.valueData = this.data
+      this.setTreeList(this.valueData)
+    }
+  },
+  methods: {
+    setTreeList (datas) { // 遍历树  获取id数组
+      for (var i in datas) {
+        this.treeList.push(datas[i])
+        if (datas[i].children) {
+          this.setTreeList(datas[i].children)
+        }
+      }
+    },
+    // 初始化值
+    initHandle () {
+      if (this.valueId) {
+        if (this.showCheckbox) {
+          let ids = this.valueId.split(',')
+          this.$refs.selectTree.setCheckedKeys(ids)
+          let titles = []
+          ids.forEach((id) => {
+            this.treeList.forEach((d) => {
+              if (id === d[this.props.value]) {
+                titles.push(d[this.props.label])
+              }
+            })
+          })
+
+          this.valueTitle = titles.join(',')
+        } else if (this.$refs.selectTree.getNode(this.valueId)) {
+          this.valueTitle = this.$refs.selectTree.getNode(this.valueId).data[this.props.label]     // 初始化显示
+          this.$refs.selectTree.setCurrentKey(this.valueId)       // 设置默认选中
+          this.defaultExpandedKey = [this.valueId]      // 设置默认展开
+        }
+      }
+      this.initScroll()
+    },
+    getNode (id) {
+      return this.$refs.selectTree.getNode(id)
+    },
+    // 初始化滚动条
+    initScroll () {
+      this.$nextTick(() => {
+        let scrollWrap = document.querySelectorAll('.el-scrollbar .el-select-dropdown__wrap')[0]
+        let scrollBar = document.querySelectorAll('.el-scrollbar .el-scrollbar__bar')
+        if (scrollWrap) { scrollWrap.style.cssText = 'margin: 0px; max-height: none; overflow: hidden;' }
+        if (scrollBar) {
+          scrollBar.forEach(ele => {
+          // eslint-disable-next-line no-return-assign
+            return ele.style.width = 0
+          })
+        }
+      })
+    },
+    // 切换选项
+    handleNodeClick (node) {
+      if (this.showCheckbox) {
+        return
+      }
+      if (node['disabled'] || node['typeFlag']) {
+        // this.$message.warning('节点（' + node[this.props.label] + '）被禁止选择，请重新选择。')
+        return
+      }
+      if (this.isOnlySelectLeaf && node.children.length > 0) {
+        // this.$message.warning('不能选择根节点（' + node[this.props.label] + '）请重新选择。')
+        return
+      }
+      this.valueTitle = node[this.props.label]
+      this.valueId = node[this.props.value]
+      this.$emit('getValue', this.valueId, this.valueTitle, node)
+    },
+    handleCheckChange (data, checked, indeterminate) {
+      let nodes = this.$refs.selectTree.getCheckedNodes()
+      this.valueTitle = nodes.map((node) => {
+        return node[this.props.label]
+      }).join(',')
+      this.valueId = nodes.map((node) => {
+        return node[this.props.value]
+      }).join(',')
+      this.$emit('getValue', this.valueId, this.valueTitle)
+    },
+    // 清除选中
+    clearHandle () {
+      this.valueTitle = ''
+      this.valueId = null
+      this.defaultExpandedKey = []
+      this.clearSelected()
+      this.$emit('getValue', null, null, null)
+    },
+    /* 清空选中样式 */
+    clearSelected () {
+      let allNode = document.querySelectorAll('#tree-option .el-tree-node')
+      allNode.forEach((element) => element.classList.remove('is-current'))
+    }
+  },
+  watch: {
+    value () {
+      this.valueId = this.value
+      if (this.value === '' || this.value === null || this.value === undefined) {
+        this.clearHandle()
+      } else {
+        this.initHandle()
+      }
+    },
+    data () {
+      this.valueData = this.data
+    }
+  },
+  computed: {
+    optionData () {
+      if (this.list) {
+        let cloneData = JSON.parse(JSON.stringify(this.list))      // 对源数据深度克隆
+        return cloneData.filter(father => {                      // 循环所有项，并添加children属性
+          let branchArr = cloneData.filter(child => father.id === child.parentId)       // 返回每一项的子级数组
+            // eslint-disable-next-line no-unused-expressions
+          branchArr.length > 0 ? father.children = branchArr : ''   // 给父级添加一个children属性，并赋值
+          return father.parentId === '0'      // 返回第一层
+        })
+      } else {
+        return this.valueData
+      }
+    }
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+  .el-select{
+    width: 100%;
+  }
+  .el-scrollbar .el-scrollbar__view .el-select-dropdown__item{
+    height: auto;
+    max-height: 274px;
+    padding: 0;
+    overflow: hidden;
+    overflow-y: auto;
+  }
+  .el-select-dropdown__item.selected{
+    font-weight: normal;
+  }
+  ul li >>>.el-tree .el-tree-node__content{
+    height:auto;
+    padding: 0 20px;
+  }
+  .el-tree-node__label{
+    font-weight: normal;
+  }
+  .el-tree >>>.is-current .el-tree-node__label{
+    color: #409EFF;
+    font-weight: 700;
+  }
+  .el-tree >>>.is-current .el-tree-node__children .el-tree-node__label{
+    color:#606266;
+    font-weight: normal;
+  }
+  /* 开发禁用 */
+  /* .el-tree-node:focus>.el-tree-node__content{
+    background-color:transparent;
+    background-color: #f5f7fa;
+    color: #c0c4cc;
+    cursor: not-allowed;
+  }
+  .el-tree-node__content:hover{
+    background-color: #f5f7fa;
+  } */
+</style>