init

src/views/studySystemChoice.vue

@@ -10,7 +10,16 @@
       <!-- 右侧：学制选择 -->
       
       <Col span="20" class="right-select-wrap" :style="'height:'+(useTableHeight({ isSearch: true, isOperat: true })+160)+'px'">
-        <div class="select-title">学制选择</div>
+        <div class="select-title">
+          学制选择
+          <Button class="fr" style="margin-right:10px;" type="primary" @click="openAddModal">添加学校</Button>
+        </div>
+        <TreeSelect
+  v-model="addForm.systemlist"
+  :data="schsystemtree"
+  multiple
+  transfer
+/>
         <!-- 幼儿园分组 -->
         <div class="group-wrap" v-for="(itt,index) in schsystemlist" :key="index">
           <div class="group-label">{{ itt.academicStageName }}</div>
@@ -34,22 +43,61 @@
         </div>
       </Col>
     </Row>
+    <!-- 新增弹窗 -->
+    <Modal v-model="addModalVisible" title="添加学校" width="520">
+      <Form ref="addFormRef" :model="addForm" :rules="formRules" label-width="90">
+        <FormItem label="学校名称" prop="schname">
+          <Input size="large" v-model="addForm.schname" placeholder="请输入学校名称" />
+        </FormItem>
+        <FormItem label="学制" prop="systemlist">
+          <treeselect
+            v-model="addForm.systemlist"
+            :options="schsystemtree"
+            :multiple="true"
+            :disable-branch-nodes="true"
+            :defaultExpandLevel="Infinity"
+            :normalizer="node => ({
+              id: node.id,
+              label: node.label,
+              children: node.children ? node.children : undefined
+            })"
+            placeholder="请选择学制"
+          />
+        </FormItem>
+      </Form>
+      <div slot="footer" align="right">
+        <Button @click="addModalVisible = false" style="margin-right: 10px">取消</Button>
+        <Button type="primary" @click="submitAdd">提交</Button>
+      </div>
+    </Modal>
   </div>
 </template>
 
 <script>
+import Treeselect from '@riophae/vue-treeselect'
+import '@riophae/vue-treeselect/dist/vue-treeselect.css'
 import myTree from "../components/my_tree";
 import { self_viewport } from "@/mixins/self_viewport";
 export default {
   name: "EduYearSelect",
-  components: { myTree},
+  components: { myTree,Treeselect },
   data() {
     return {
       selectedEdu: "",
       selectedSchool: null,
       treeData: [],
       schsystemlist:[],
-      selectnodeid:0
+      schsystemtree:[],
+      selectnodeid:0,
+      addModalVisible:false,
+      addForm: {
+        schname:'',
+        systemlist:[]
+      },
+      formRules: {
+        schname: [{ required: true, message: "请输入学校名称", trigger: "blur" }],
+        systemlist: [{ required: true, type: 'array', min: 1, message: '请选择学制', trigger: 'change' }]
+      }
     };
     
   },
@@ -103,6 +151,54 @@ export default {
       }
     });
   },
+  //添加学校
+  openAddModal() {
+      this.$nextTick(() => {
+        this.$refs.addFormRef?.resetFields();
+      });
+      this.addForm = {
+        schname: '',
+        systemlist: [],
+      };
+      this.getselectTree();
+      this.addModalVisible = true;
+    },
+    //获取学制下拉树
+    getselectTree:function(){
+      const _this = this;
+      var item={};
+      _this.$api.get(APIConfig.BschClassSystem.selectTree, item, resp => {
+        if(resp.code==0)
+        {
+            _this.schsystemtree = resp.data;
+        }else{
+            _this.schsystemtree=[];
+        }
+      });
+    },
+    //提交学制事件
+    submitAdd() {
+      this.$refs.addFormRef.validate(valid => {
+        if (!valid) return;
+        const form = this.addForm;
+        const submitData = {
+          schname: form.schname,
+          systemlist: form.systemlist
+        };
+        // const url = APIConfig.BschClassSystem.yeartermadd;
+        this.$api.post(url, JSON.stringify(submitData), resp => {
+          if (resp.code == 0) {
+            this.$Message.success("添加成功！");
+            this.addModalVisible = false;
+            this.getGroupTree();
+            this.getschsystemlist();
+          } else if (resp.code == 4) {
+            this.$Message.info(resp.msg);
+          }
+        });
+      });
+    },
+    //选中学制事件
     selectEduType(val,index,index2) {
       const list = this.schsystemlist[index].academicStageList;
       // 先记录当前点击项原本的勾选状态
@@ -166,7 +262,7 @@ export default {
   flex-direction: column;
 }
 .tree-title {
-  font-size: 22px;
+  font-size: 20px;
   font-weight: 500;
   padding: 10px 10px 10px;
   border-bottom: 1px solid #eee;