机构管理机构树改成下拉

src/views/AgreementManage/CarInsurance/AgreementEntry.vue

@@ -1,21 +1,9 @@
 <template>
   <div>
     <el-main ref="elMain" style="padding: 0px">
-      <Split :gutterSize="2" style="height: calc(100vh - 120px)">
-        <!-- 左侧树Start -->
-        <SplitArea :size="leftSplitWidth" :minSize="200">
-          <el-radio-group v-model="supplierType" @input="supplierChange" size="mini">
-            <el-radio v-for="(item, index) in supplierTypeEnumoptions" :key="index" :label="item.dictValue">{{
-              item.dictTag }}</el-radio>
-          </el-radio-group>
-          <el-divider></el-divider>
-          <tree :setting="ztreeSetting" :nodes="ztreeNodes" @onClick="onZTreeClick" @onCreated="onZTreeCreated" />
-        </SplitArea>
-        <!-- 左侧树End -->
         <!-- 右侧列表页面Start -->
-        <SplitArea :size="rightSplitWidth">
           <!-- 工具区域Start -->
-          <el-form class="queryForm p-2 flex" ref="queryFormRef" :model="queryForm" :inline="true" label-width="80px">
+          <el-form class="queryForm p-2 flex" ref="queryFormRef" :model="queryForm" :inline="true" label-width="100px">
             <el-form-item>
               <el-button :size="overSize" type="success" @click="handleAdd">添加协议</el-button>
             </el-form-item>
@@ -24,6 +12,16 @@
                 type="daterange" align="left" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
               </el-date-picker>
             </el-form-item>
+            <el-form-item label="供应商类型">
+              <el-select :size="overSize" v-model="supplierType" placeholder="请选择供应商" clearable >
+                <el-option v-for="(item,index) in supplierTypeEnumoptions" :key="index" :label="item.dictTag" :value="item.dictValue"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="保险公司">
+              <el-cascader  style="width:220px" v-model="agreement.partnerCompaniesId" :size="overSize"
+                    :show-all-levels="false" :options="ztreeNodes" :props="optionProps" @change="handleChange"  clearable
+                    filterable></el-cascader>
+            </el-form-item>
             <el-form-item label="是否有效">
               <el-select :size="overSize" v-model="queryForm.validStatus" placeholder="请选择" clearable style="width: 100%">
                 <el-option label="有效" :value="1"></el-option>
@@ -82,10 +80,6 @@
                         <el-button type="text" :size="overSize"
                           @click="productCost(scope.$index, scope.row)">产品费用</el-button>
                       </el-dropdown-item>
-                      <el-dropdown-item>
-                        <el-button type="text" :size="overSize"
-                          @click="nonAutoProductCost(scope.$index, scope.row)">非车产品费用</el-button>
-                      </el-dropdown-item>
                       <el-dropdown-item>
                         <el-button type="text" :size="overSize" @click="
                           underwritingRulesButton(scope.$index, scope.row)
@@ -101,8 +95,6 @@
             :page-sizes="[20, 50, 100, 200]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper"
             :total="totalSize">
           </el-pagination>
-        </SplitArea>
-      </Split>
     </el-main>
     <!-- 新增协议的对话框 -->
     <el-dialog :title="dialogTitle" v-dialogDrag :visible.sync="agreementdialogVisible" width="70%"
@@ -152,7 +144,7 @@
               <el-col :span="12">
                 <el-form-item label="合作公司" prop="partnerCompaniesId">
                   <el-cascader :disabled="operType == 'EDIT'" style="width: 100%" v-model="agreement.partnerCompaniesId"
-                    :show-all-levels="false" :options="options" :props="optionProps" @change="handleChange" clearable
+                    :show-all-levels="false" :options="ztreeNodes" :props="optionProps" @change="handleChange" clearable
                     filterable></el-cascader>
                 </el-form-item>
               </el-col>
@@ -1519,8 +1511,6 @@ export default {
     this.labelWidth = "auto";
     this.findLeftTreeData();
     this.getAllCompany();
-    //用像素初始化左边的split的宽度
-    this.changeTreeWidth(250); // 初始化树的宽度
   },
   methods: {
     productCostFactoropenDialog() {
@@ -2149,13 +2139,13 @@ export default {
     },
     //获取所有机构列表End
     /**Split 开始 */
-    changeTreeWidth(widthVal) {
-      // 初始化树的宽度
-      this.leftSplitWidth = Math.ceil(
-        (widthVal / this.$refs.elMain.$el.clientWidth) * 100
-      );
-      this.rightSplitWidth = 100 - this.leftSplitWidth;
-    },
+    // changeTreeWidth(widthVal) {
+    //   // 初始化树的宽度
+    //   this.leftSplitWidth = Math.ceil(
+    //     (widthVal / this.$refs.elMain.$el.clientWidth) * 100
+    //   );
+    //   this.rightSplitWidth = 100 - this.leftSplitWidth;
+    // },
     // 获取树数据
     findLeftTreeData: function () {
       let params = {
@@ -2176,20 +2166,21 @@ export default {
         this.ztreeNodes = res.data;
       });
     },
-    onZTreeClick: function (evt, treeId, treeNode) {
-      // 点击事件
-      this.containsSubChecked = false;
-      this.agreement.partnerCompaniesId = treeNode.id;
+    // onZTreeClick: function (evt, treeId, treeNode) {
+    //   // 点击事件
+    //   this.containsSubChecked = false;
+    //   this.agreement.partnerCompaniesId = treeNode.id;
 
-      this.findPage();
-    },
-    onZTreeCreated: function (ztreeObj) {
-      this.ztreeObj = ztreeObj;
-      // onCreated 中操作ztreeObj对象展开第一个节点
-      ztreeObj.expandNode(ztreeObj.getNodes()[0], true);
-      this.currentTreeNode = ztreeObj.getNodes()[0];
-      this.options = ztreeObj.getNodes();
-    },
+    //   this.findPage();
+    // },
+    // onZTreeCreated: function (ztreeObj) {
+    //   this.ztreeObj = ztreeObj;
+    //   // onCreated 中操作ztreeObj对象展开第一个节点
+    //   ztreeObj.expandNode(ztreeObj.getNodes()[0], true);
+    //   this.currentTreeNode = ztreeObj.getNodes()[0];
+    //   console.log(ztreeObj)
+    //   this.options = ztreeObj.getNodes();
+    // },
     //-- tree end-------
     //--数据字典 begin --
     getDicType(type) {