Merge branch 'merge_music' into ol_12_30

src/main.js

@@ -5,6 +5,7 @@ import dayjs from 'dayjs'
 import numeral from 'numeral'
 import lodash from 'lodash'
 import qs from 'qs'
+import { permission } from "@/utils/directivePage";
 
 import * as constant from '@/constant'
 
@@ -118,6 +119,7 @@ Vue.mixin({
         numeral,
         lodash,
         qs,
+        permission,
       }
     },
     $constant() {

src/views/teamBuild/api.js

@@ -0,0 +1,9 @@
+import request2 from '@/utils/request2'
+
+// 填加学员接口
+export const addMusicGroupRegs = data => request2({
+  url: '/api-web/musicGroup/addMusicGroupRegs',
+  data,
+  method: 'post',
+  requestType: 'json'
+})

src/views/teamBuild/components/merge-music.vue

@@ -0,0 +1,214 @@
+<template>
+  <div class="merge-music">
+    <el-button type="primary" @click="visible = true">选择乐团</el-button>
+    <el-button type="primary" @click="studentsVisible = true">已合并学生</el-button>
+    <empty v-if="isEmpty" desc="暂未选择乐团"/>
+    <el-collapse v-model="active" @change="changeActive" class="items" v-else>
+      <el-collapse-item class="item" v-for="(item, key) in items" :key="key" :name="key" >
+        <template #title>
+          <div class="header">
+            <span class="title">
+              <span>{{item.name}}</span>
+            </span>
+            <span style="width: 20%;">
+              <span>学员人数：已选{{item.num}}人</span>
+              <i @click.stop="remove(key)" class="icon el-icon-circle-close"></i>
+            </span>
+          </div>
+        </template>
+        <selectItem :active="active" :id="item.id" @selected="selected"/>
+      </el-collapse-item>
+    </el-collapse>
+    <div class="btns">
+      <el-button type="primary" @click="$emit('chiosetab', 1)">上一步</el-button>
+      <el-button type="primary" @click="merge">确认合并</el-button>
+    </div>
+    <el-dialog
+      title="选择乐团"
+      :visible.sync="visible"
+      width="700px"
+    >
+      <selectMusic
+        :visible="visible"
+        @close="visible = false"
+        @submited="submited"
+      />
+    </el-dialog>
+    <el-dialog
+      title="查看已合并学生"
+      :visible.sync="studentsVisible"
+      width="700px"
+    >
+      <mergedStudents
+        @close="studentsVisible = false"
+        @submited="submited"
+      />
+    </el-dialog>
+  </div>
+</template>
+<script>
+import { getTeamList, getPayType } from "@/api/teamServer";
+import { addMusicGroupRegs } from '../api'
+import selectMusic from './select-msic'
+import selectItem from './select-item'
+import mergedStudents from './merged-students'
+export default {
+  components: {
+    selectMusic,
+    selectItem,
+    mergedStudents,
+  },
+  data() {
+    return {
+      active: '',
+      visible: false,
+      studentsVisible: false,
+      tableData: [],
+      passed: [],
+      items: {},
+      studentsByMusicId: {}
+    };
+  },
+  computed: {
+    isEmpty() {
+      return Object.keys(this.items).length === 0
+    },
+  },
+  mounted() {
+    // this.FetchList()
+  },
+  methods: {
+    changeActive(val) {
+      this.active = val
+    },
+    submited(vals) {
+      const data = {}
+      for (const item of vals) {
+        if (!data[item.id]) {
+          data[item.id] = {...item, num: 0}
+        } else {
+          data[item.id] = {
+            ...data[item.id],
+            ...item,
+          }
+        }
+      }
+      this.items = data
+    },
+    remove(key) {
+      const data = {...this.items}
+      const select = {...this.studentsByMusicId}
+      delete data[key]
+      delete select[key]
+      this.items = {...data}
+      this.studentsByMusicId = {...select}
+    },
+    selected(list, key) {
+      const data = this.studentsByMusicId
+      if (!data[key]) {
+        data[key] = []
+      }
+      data[key] = list
+      this.items[key].num = list.length
+      this.items = this.items
+      this.studentsByMusicId = data
+    },
+    async merge() {
+      let allId = []
+      for (const key in this.studentsByMusicId) {
+        if (Object.hasOwnProperty.call(this.studentsByMusicId, key)) {
+          const item = this.studentsByMusicId[key]
+          allId = allId.concat(item)
+        }
+      }
+      try {
+        await this.$confirm('是否确认合并乐团？', '提示', {
+          type: 'warning'
+        })
+        await addMusicGroupRegs({
+          musicGroupId: this.$route.query.id,
+          registerIds: allId
+        })
+        this.$message.success('合并成功')
+        this.$emit('chiosetab', 2)
+      } catch (error) {}
+    },
+    handleSelectionChange(arr) {
+      const passed = [];
+      for (let i in arr) {
+        passed.push(arr[i].id);
+      }
+      this.passed = passed;
+    },
+    async FetchList() {
+      try {
+        const res = await getTeamList()
+        this.tableData = res.data.rows
+      } catch (error) {}
+    },
+  },
+};
+</script>
+<style lang="less" scoped>
+.merge-music{
+  /deep/ .items{
+    margin-top: 20px;
+  }
+  /deep/ .item{
+    /deep/ .el-collapse-item__header.is-active {
+      border-bottom-color: #EBEEF5;
+    }
+    >div:first-child{
+      margin-bottom: 10px;
+    }
+    // margin-bottom: 10px;
+  }
+  /deep/ .header{
+    display: flex;
+    align-items: center;
+    width: 98%;
+    justify-content: space-between;
+    // margin-bottom: 10px;
+    >span:first-child{
+      display: flex;
+      &::before{
+        content: '';
+        display: inline-block;
+        width: 5px;
+        background-color: #14928A;
+        margin-right: 10px;
+        border-radius: 2px;
+        height: 48px;
+        position: absolute;
+      }
+    }
+    .icon{
+      font-size: 18px;
+      font-weight: normal;
+      margin-right: 20px;
+    }
+  }
+}
+.title{
+  position: relative;
+  display: block;
+  max-width: 60%;
+  >span{
+    display: block;
+    margin-left: 20px;
+    font-weight: normal;
+    flex: 1;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    height: 48px;
+    line-height: 48px;
+    white-space: pre;
+  }
+}
+.btns{
+  margin-top: 20px;
+  text-align: right;
+}
+</style>

src/views/teamBuild/components/merged-students.vue

@@ -0,0 +1,101 @@
+<template>
+  <div>
+    <el-form ref="search" :model="search" inline @submit.stop.native="submit" @reset.stop.native="reset">
+      <el-form-item prop="keyword">
+        <el-input v-model.trim="search.keyword" clearable placeholder="学生姓名(手机、编号)"/>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" native-type="submit">搜索</el-button>
+        <el-button type="danger" native-type="reset">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <el-table
+      style="width: 100%"
+      max-height="300px"
+      :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+      :data="filterlist"
+    >
+      <el-table-column prop="realName" align="center" label="学员姓名">
+        <template slot-scope="scope">
+          <copy-text>{{ scope.row.realName }}</copy-text>
+        </template>
+      </el-table-column>
+      <el-table-column prop="phone" align="center" label="手机号码">
+        <template slot-scope="scope">
+          <copy-text>{{ scope.row.phone }}</copy-text>
+        </template>
+      </el-table-column>
+      <el-table-column prop="subjectName" align="center" label="声部">
+        <template slot-scope="scope">
+          <copy-text>{{ scope.row.subjectName }}</copy-text>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+<script>
+import { getTeamStudentList } from '@/api/buildTeam'
+export default {
+  data() {
+    return {
+      id: this.$route.query.id,
+      list: [],
+      filterlist: [],
+      passed: [],
+      search: {
+        keyword: '',
+        hastimer: ''
+      }
+    }
+  },
+  mounted() {
+    this.FetchDetail()
+  },
+  methods: {
+    filter() {
+      const { keyword, hastimer } = this.search
+      this.filterlist = this.list.filter(item => {
+        const user = !keyword || (
+          ('' + item.userId).indexOf(keyword) > -1 ||
+          ('' + item.phone).indexOf(keyword) > -1 ||
+          ('' + item.realName).indexOf(keyword) > -1
+        )
+        return user
+      })
+    },
+    submit(evt) {
+      evt.stopPropagation()
+      evt.stopImmediatePropagation()
+      evt.preventDefault()
+      this.filter()
+    },
+    reset(evt) {
+      evt.stopPropagation()
+      evt.stopImmediatePropagation()
+      evt.preventDefault()
+      this.search = {
+        keyword: '',
+        hastimer: ''
+      }
+      this.filter()
+    },
+    handleSelectionChange(arr) {
+      const passed = [];
+      for (let i in arr) {
+        passed.push(arr[i].id);
+      }
+      this.passed = passed;
+      this.$emit('selected', this.passed, this.id)
+    },
+    async FetchDetail() {
+      try {
+        const res = await getTeamStudentList({
+          musicGroupId: this.id,
+        })
+        this.list = res.data.rows
+        this.filterlist = res.data.rows
+      } catch (error) {}
+    }
+  }
+}
+</script>

src/views/teamBuild/components/select-item.vue

@@ -0,0 +1,123 @@
+<template>
+  <div>
+    <el-form ref="search" :model="search" inline @submit.stop.native="submit" @reset.stop.native="reset">
+      <el-form-item prop="keyword">
+        <el-input v-model.trim="search.keyword" clearable placeholder="学生姓名(手机、编号)"/>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" native-type="submit">搜索</el-button>
+        <el-button type="danger" native-type="reset">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <el-table
+      style="width: 100%"
+      max-height="300px"
+      @selection-change="handleSelectionChange"
+      :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+      :data="filterlist"
+    >
+      <el-table-column type="selection"
+        width="50">
+      </el-table-column>
+        <el-table-column prop="id" width="100" align="center" label="乐团编号">
+          <template slot-scope="scope">
+            <copy-text>{{ scope.row.id }}</copy-text>
+          </template>
+        </el-table-column>
+        <el-table-column prop="name" align="center" label="学员姓名">
+          <template slot-scope="scope">
+            <copy-text>{{ scope.row.name }}</copy-text>
+          </template>
+        </el-table-column>
+        <el-table-column prop="parentsName" align="center" label="家长姓名">
+          <template slot-scope="scope">
+            <copy-text>{{ scope.row.parentsName }}</copy-text>
+          </template>
+        </el-table-column>
+        <el-table-column prop="parentsPhone" align="center" label="家长电话">
+          <template slot-scope="scope">
+            <copy-text>{{ scope.row.parentsPhone }}</copy-text>
+          </template>
+        </el-table-column>
+        <el-table-column prop="subjectName" align="center" label="声部">
+          <template slot-scope="scope">
+            <copy-text>{{ scope.row.subjectName }}</copy-text>
+          </template>
+        </el-table-column>
+    </el-table>
+  </div>
+</template>
+<script>
+import { getMusicGroupStu } from '@/views/resetTeaming/api'
+export default {
+  props: ['id', 'active', 'name'],
+  data() {
+    return {
+      list: [],
+      filterlist: [],
+      passed: [],
+      search: {
+        keyword: '',
+        hastimer: ''
+      }
+    }
+  },
+  watch: {
+    active: {
+      immediate: true,
+      handler() {
+        if (this.active.includes(this.id) && !this.list.length) {
+          this.FetchDetail()
+        }
+      }
+    }
+  },
+  methods: {
+    filter() {
+      const { keyword, hastimer } = this.search
+      this.filterlist = this.list.filter(item => {
+        const user = !keyword || (
+          ('' + item.userId).indexOf(keyword) > -1 ||
+          ('' + item.parentsName).indexOf(keyword) > -1 ||
+          ('' + item.parentsPhone).indexOf(keyword) > -1 ||
+          ('' + item.name).indexOf(keyword) > -1
+        )
+        return user
+      })
+    },
+    submit(evt) {
+      evt.stopPropagation()
+      evt.stopImmediatePropagation()
+      evt.preventDefault()
+      this.filter()
+    },
+    reset(evt) {
+      evt.stopPropagation()
+      evt.stopImmediatePropagation()
+      evt.preventDefault()
+      this.search = {
+        keyword: '',
+        hastimer: ''
+      }
+      this.filter()
+    },
+    handleSelectionChange(arr) {
+      const passed = [];
+      for (let i in arr) {
+        passed.push(arr[i].id);
+      }
+      this.passed = passed;
+      this.$emit('selected', this.passed, this.id)
+    },
+    async FetchDetail() {
+      try {
+        const res = await getMusicGroupStu({
+          musicGroupId: this.id,
+        })
+        this.list = res.data
+        this.filterlist = res.data
+      } catch (error) {}
+    }
+  }
+}
+</script>

src/views/teamBuild/components/select-msic.vue

@@ -0,0 +1,150 @@
+<template>
+  <div class="container" style="width: 100%">
+    <el-form ref="search" :model="search" inline @submit.stop.native="submit" @reset.stop.native="reset">
+      <el-form-item prop="musicGroupName">
+        <el-input v-model.trim="search.musicGroupName" clearable placeholder="乐团名称"/>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" native-type="submit">搜索</el-button>
+        <el-button type="danger" native-type="reset">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <el-table
+      style="width: 100%"
+      max-height="300px"
+      ref="table"
+      @selection-change="handleSelectionChange"
+      :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+      :data="tableData"
+    >
+      <el-table-column type="selection"
+        :selectable="checkSelectable"
+        width="50">
+      </el-table-column>
+      <el-table-column prop="id" width="100" align="center" label="乐团编号">
+        <template slot-scope="scope">
+          <copy-text>{{ scope.row.id }}</copy-text>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="name"
+        width="200px"
+        align="center"
+        label="乐团名称"
+      >
+        <template slot-scope="scope">
+          <copy-text>{{ scope.row.name }}</copy-text>
+        </template>
+      </el-table-column>
+      <el-table-column
+        align="center"
+        prop="cooperationOrganName"
+        max-width="274"
+        label="合作单位"
+      >
+      </el-table-column>
+    </el-table>
+    <pagination
+      :total.sync="rules.total"
+      :page.sync="rules.page"
+      :limit.sync="rules.limit"
+      :page-sizes="rules.page_size"
+      layout="prev, pager, next"
+      style="padding: 10px"
+      @pagination="FetchList" />
+    <div class="footer" slot="footer">
+      <el-button @click="$emit('close')">取消</el-button>
+      <el-button @click="submited" type="primary">确认</el-button>
+    </div>
+  </div>
+</template>
+<script>
+import pagination from '@/components/Pagination/index'
+import { getTeamList, getPayType } from "@/api/teamServer";
+export default {
+  props: ['visible'],
+  components: { pagination },
+  data() {
+    return {
+      tableData: [],
+      passed: [],
+      rules: {
+        // 分页规则
+        limit: 10, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [10, 20, 40, 50] // 选择限制显示条数
+      },
+      search: {
+        musicGroupName: '',
+        hastimer: ''
+      }
+    };
+  },
+  mounted() {
+    this.FetchList()
+  },
+  watch: {
+    visible() {
+      this.$refs.table.clearSelection()
+      this.passed = []
+    }
+  },
+  methods: {
+    submit(evt) {
+      this.rules.page = 1;
+      evt.stopPropagation()
+      evt.stopImmediatePropagation()
+      evt.preventDefault()
+      this.FetchList()
+    },
+    reset(evt) {
+      this.rules.page = 1;
+      evt.stopPropagation()
+      evt.stopImmediatePropagation()
+      evt.preventDefault()
+      this.search = {
+        musicGroupName: '',
+        hastimer: ''
+      }
+      this.FetchList()
+    },
+    checkSelectable (row) {
+      return true
+    },
+    handleSelectionChange(arr) {
+      const passed = [];
+      for (let i in arr) {
+        let obj = {};
+        obj.id = arr[i].id;
+        obj.name = arr[i].name;
+        passed.push(obj);
+      }
+      this.passed = passed;
+    },
+    async FetchList() {
+      try {
+        const res = await getTeamList({
+          rows: this.rules.limit,
+          page: this.rules.page,
+          ...this.search
+        })
+        this.tableData = res.data.rows
+          this.rules.total = res.data.total
+      } catch (error) {}
+    },
+    submited() {
+      this.$emit('close')
+      this.$emit('submited', this.passed)
+    }
+  },
+};
+</script>
+<style lang="less" scoped>
+.container{
+  /deep/ .footer{
+    text-align: right;
+    margin-top: 20px;
+  }
+}
+</style>

src/views/teamBuild/components/teamBaseInfo.vue

@@ -291,20 +291,7 @@
         <div
           class="nextBtn"
           @click="gotoNext(1)"
-          v-if="
-            teamStatus == 'newTeam' ||
-            teamStatus == 'teamDraft' ||
-            teamStatus == 'teamAudit' ||
-            teamStatus == 'feeAudit'
-          "
-        >
-          下一步
-        </div>
-        <!-- 跨团调整的下一步 -->
-        <div
-          class="nextBtn"
-          v-if="teamStatus == 'teamList'"
-          @click="gotoNext(2)"
+          v-if="showNext"
         >
           下一步
         </div>
@@ -829,6 +816,16 @@ export default {
         })
         .join(",");
     },
+    showNext() {
+      const teamStatus = this.teamStatus
+      console.log(teamStatus)
+      return (
+        teamStatus == 'newTeam' ||
+        teamStatus == 'teamDraft' ||
+        teamStatus == 'teamAudit' ||
+        teamStatus == 'feeAudit'
+      )
+    }
   },
 };
 </script>

src/views/teamBuild/components/teamSoundSet.vue

@@ -9,17 +9,34 @@
                   @getBaseInfo="getBaseInfo"
                   @getNumber="getNumber" />
     <div class="btnWrap">
-      <div class="PrevBtn"
-           @click="goback">上一步</div>
+      <el-button type="primary" @click="goback" style="margin-right: 10px;">上一步</el-button>
       <!--  v-if="teamStatus != 'teamAudit'" -->
-      <div class="submitBtn"
+      <el-button class="submitBtn"
            v-permission="{
           child: 'musicGroup/createGroup',
           parent: '/teamBuild/soundMoney',
         }"
-           @click="submitInfo()">
-        下一步
-      </div>
+        v-if="!$helpers.permission('musicGroup/addMusicGroupRegs')"
+        @click="submitInfo()">
+        创建缴费
+      </el-button>
+      <el-dropdown
+        split-button
+        v-permission="{
+          child: 'musicGroup/createGroup',
+          parent: '/teamBuild/soundMoney',
+        }"
+        v-if="$helpers.permission('musicGroup/addMusicGroupRegs')"
+        type="primary"
+        @click="submitInfo()"
+      >
+        创建缴费
+        <el-dropdown-menu slot="dropdown">
+          <el-dropdown-item>
+            <el-button @click="$emit('chiosetab', 3)" type="text">选择乐团</el-button>
+          </el-dropdown-item>
+        </el-dropdown-menu>
+      </el-dropdown>
       <!-- <div
         class="submitBtn"
         @click="submitAudit(1)"
@@ -76,6 +93,7 @@ export default {
     };
   },
   mounted () {
+    console.log(this)
     this.teamid = this.$route.query.id;
     this.teamStatus = this.$route.query.type;
   },
@@ -84,6 +102,9 @@ export default {
     this.teamStatus = this.$route.query.type;
   },
   methods: {
+    handleClick(evt) {
+      console.log(evt)
+    },
     goback () {
       this.$emit("chiosetab", 0);
     },
@@ -206,4 +227,4 @@ export default {
     width: 120px;
   }
 }
-</style>
+</style>

src/views/teamBuild/index.vue

@@ -5,42 +5,9 @@
       <el-page-header @back="goBack"
                       :content="pageName"> </el-page-header>
     </h2>
-    <div class="m-core">
-      <div class="stepbox">
-        <!--  @click="activeIndex = 0" -->
-        <span class="stepspan stepspan1">
-          <div class="step1 sptep"
-               :class="activeIndex >= 0 ? 'activestep' : ''">
-            基本信息
-          </div>
-          <img :src="activeIndex  >=  0 ? stepImgs.nol : stepImgs.active"
-               alt=""
-               class="arrow" />
-        </span>
-        <!-- @click="activeIndex = 1" -->
-        <span class="stepspan stepspan2"
-              v-if="showFlag?activeIndex>= 1:true">
-          <!--    -->
-          <div class="step2 sptep"
-               :class="activeIndex  >= 1 ? 'activestep' : ''">
-            声部设置
-          </div>
-          <img :src="activeIndex >=  1 ? stepImgs.nol : stepImgs.active"
-               alt=""
-               class="arrow" />
-        </span>
-        <!--  @click="activeIndex = 2" -->
-        <span class="stepspan stepspan3"
-              v-if="showFlag?activeIndex  >=  2:true">
-          <div class="step2 sptep"
-               :class="activeIndex  >=  2 ? 'activestep' : ''">
-            创建缴费
-          </div>
-          <img :src="activeIndex >= 2 ? stepImgs.nol : stepImgs.active"
-               alt=""
-               class="arrow" />
-        </span>
-      </div>
+    <h2>
+      <div class="squrt"></div><h3 style="font-size: 22px;">{{getIndexName(activeIndex)}}</h3>
+    </h2>
 
       <!-- 下面显示的内容 -->
       <div class="stepcontent">
@@ -60,6 +27,10 @@
                        :getTeamList="getTeamList"
                        :baseInfo="baseInfo" />
         </div>
+        <div v-if="activeIndex == 3">
+          <mergeMusic @chiosetab="chiosetab"
+                       :getTeamList="getTeamList" />
+        </div>
       </div>
     </div>
   </div>
@@ -68,8 +39,9 @@
 import teamBaseInfo from "@/views/teamBuild/components/teamBaseInfo";
 import teamSoundMoney from "@/views/teamBuild/components/teamSoundSet";
 import teamPayInfo from "@/views/teamBuild/components/teamPayInfo";
+import mergeMusic from "@/views/teamBuild/components/merge-music";
 export default {
-  components: { teamBaseInfo, teamSoundMoney, teamPayInfo },
+  components: { teamBaseInfo, teamSoundMoney, teamPayInfo, mergeMusic },
   name: "teamBuild",
   data () {
     return {
@@ -85,7 +57,7 @@ export default {
   },
   created () {
     // 判断 是新建乐团还是修改乐团
-    this.activeIndex = 0;
+    this.activeIndex = 3;
     this.init();
   },
   activated () {
@@ -101,10 +73,10 @@ export default {
       if (this.teamStatus == "newTeam") {
         // 新建团
         this.pageName = "建团申请";
-        this.activeIndex = 0;
+        // this.activeIndex = 0;
       } else {
         this.pageName = "乐团修改";
-        this.activeIndex = 0;
+        // this.activeIndex = 0;
       }
     },
     chiosetab (val) {
@@ -122,11 +94,20 @@ export default {
       this.baseInfo = baseInfo
       this.pageName = baseInfo.musicGroup?.name
     },
+    getIndexName(index) {
+      const data = {
+        0: '基本信息',
+        1: '声部设置',
+        2: '创建缴费',
+        3: '合并乐团',
+      }
+      return data[index]
+    }
   },
   computed: {
     showFlag () {
       return (this.teamStatus == 'newTeam' || this.teamStatus == 'teamList')
-    }
+    },
   }
 };
 </script>