|  | @@ -1,92 +1,126 @@
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  |  <template>
 | 
	
		
			
				|  |  |    <div class='m-container'>
 | 
	
		
			
				|  |  |      <h2>商品类型管理</h2>
 | 
	
		
			
				|  |  |      <div class="m-core">
 | 
	
		
			
				|  |  | -      <!-- <div class='newBand'>添加</div> -->
 | 
	
		
			
				|  |  | +      <div class='newBand' @click="openTypes('create')">添加</div>
 | 
	
		
			
				|  |  |        <!-- 列表 -->
 | 
	
		
			
				|  |  | -      <el-row class="music-title">
 | 
	
		
			
				|  |  | -        <el-col :span="6">
 | 
	
		
			
				|  |  | -          一级分类 
 | 
	
		
			
				|  |  | -          <el-popover placement="right" width="300" trigger="click">
 | 
	
		
			
				|  |  | -            <el-input v-model="oneTypeName" size="medium" style="width: 73%" autocomplete="off"></el-input>
 | 
	
		
			
				|  |  | -            <el-button style="margin: 0;" @click="onAddMusic" type="primary" size="medium" >提交</el-button>
 | 
	
		
			
				|  |  | -            <el-button slot="reference" type="primary" size="mini" round icon="el-icon-plus">添加</el-button>
 | 
	
		
			
				|  |  | -          </el-popover>
 | 
	
		
			
				|  |  | -          
 | 
	
		
			
				|  |  | -        </el-col>
 | 
	
		
			
				|  |  | -        <el-col :span="18">
 | 
	
		
			
				|  |  | -          二级分类
 | 
	
		
			
				|  |  | -        </el-col>
 | 
	
		
			
				|  |  | -      </el-row>
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -      <el-row v-for="(item, index) in subjectList" :key="item.id">
 | 
	
		
			
				|  |  | -        <el-col :span="6">
 | 
	
		
			
				|  |  | -          <el-button @click="subjectDelete(item)" icon="el-icon-delete" circle></el-button>
 | 
	
		
			
				|  |  | -          <span class="one_name">{{ item.name }}</span>
 | 
	
		
			
				|  |  | -        </el-col>
 | 
	
		
			
				|  |  | -        <el-col :span="18" class="tow_col">
 | 
	
		
			
				|  |  | -           
 | 
	
		
			
				|  |  | -          <el-tag v-for="s in item.goodsCategories" :key="s.id" type="info" effect="dark"
 | 
	
		
			
				|  |  | -            closable :disable-transitions="false"
 | 
	
		
			
				|  |  | -            @close="subjectDelete(s)"> {{s.name}}</el-tag>
 | 
	
		
			
				|  |  | -          <span style="display: inline-block;">
 | 
	
		
			
				|  |  | -            <el-input class="input-new-tag"
 | 
	
		
			
				|  |  | -              v-if="item.inputStatus"
 | 
	
		
			
				|  |  | -              v-model="inputValue[index]" key="tag"
 | 
	
		
			
				|  |  | -              ref="saveTagInput"
 | 
	
		
			
				|  |  | -              size="small">
 | 
	
		
			
				|  |  | -            </el-input>
 | 
	
		
			
				|  |  | -            <el-button v-else key="tag" type="primary" size="mini" round icon="el-icon-plus" @click="item.inputStatus = true">添加</el-button>
 | 
	
		
			
				|  |  | -            <el-button v-if="item.inputStatus" type="info" size="mini" round icon="el-icon-check" @click="onSave(item, index)">保存</el-button>
 | 
	
		
			
				|  |  | -          </span>
 | 
	
		
			
				|  |  | -        </el-col>
 | 
	
		
			
				|  |  | -      </el-row>
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | +      <div class="tableWrap">
 | 
	
		
			
				|  |  | +        <el-table :data='tableList'>
 | 
	
		
			
				|  |  | +          <el-table-column align='center' prop="name"
 | 
	
		
			
				|  |  | +                           label="商品名称">
 | 
	
		
			
				|  |  | +          </el-table-column>
 | 
	
		
			
				|  |  | +          <el-table-column align='center' 
 | 
	
		
			
				|  |  | +                           label="声部组合">
 | 
	
		
			
				|  |  | +            <template slot-scope="scope">
 | 
	
		
			
				|  |  | +              {{ scope.row.subjectName | joinArray(',') }}
 | 
	
		
			
				|  |  | +            </template>
 | 
	
		
			
				|  |  | +          </el-table-column>
 | 
	
		
			
				|  |  | +          <el-table-column align='center'
 | 
	
		
			
				|  |  | +                           label="操作">
 | 
	
		
			
				|  |  | +            <template slot-scope="scope">
 | 
	
		
			
				|  |  | +              <el-button @click="openTypes('update', scope.row)" type="text">修改</el-button>
 | 
	
		
			
				|  |  | +              <el-button @click="onTypesDel(scope.row)" type="text">删除</el-button>
 | 
	
		
			
				|  |  | +            </template>
 | 
	
		
			
				|  |  | +          </el-table-column>
 | 
	
		
			
				|  |  | +        </el-table>
 | 
	
		
			
				|  |  | +        <pagination :total="pageInfo.total"
 | 
	
		
			
				|  |  | +                    :page.sync="pageInfo.page"
 | 
	
		
			
				|  |  | +                    :limit.sync="pageInfo.limit"
 | 
	
		
			
				|  |  | +                    :page-sizes="pageInfo.page_size"
 | 
	
		
			
				|  |  | +                    @pagination="getList" />
 | 
	
		
			
				|  |  | +      </div>
 | 
	
		
			
				|  |  |      </div>
 | 
	
		
			
				|  |  | +    <el-dialog :title="formTitle[formActionTitle]" :visible.sync="typeStatus"
 | 
	
		
			
				|  |  | +               @close="onFormClose('ruleForm')" width="500px">
 | 
	
		
			
				|  |  | +      <el-form :model="form" :rules="rules" ref="ruleForm">
 | 
	
		
			
				|  |  | +        <el-form-item label="作业模板名称" prop="name" :label-width="formLabelWidth">
 | 
	
		
			
				|  |  | +          <el-input v-model="form.name" autocomplete="off"></el-input>
 | 
	
		
			
				|  |  | +        </el-form-item>
 | 
	
		
			
				|  |  | +        <el-form-item label="声部选择" v-if="form.classGroupType != 'MIX'"
 | 
	
		
			
				|  |  | +          prop="subjectIds" :label-width="formLabelWidth">
 | 
	
		
			
				|  |  | +          <el-select v-model="form.subjectIds" multiple>
 | 
	
		
			
				|  |  | +              <el-option-group
 | 
	
		
			
				|  |  | +                v-for="group in subjectList"
 | 
	
		
			
				|  |  | +                :key="group.label"
 | 
	
		
			
				|  |  | +                :label="group.label">
 | 
	
		
			
				|  |  | +                <el-option
 | 
	
		
			
				|  |  | +                  v-for="item in group.options"
 | 
	
		
			
				|  |  | +                  :key="item.value"
 | 
	
		
			
				|  |  | +                  :label="item.label"
 | 
	
		
			
				|  |  | +                  :value="item.value">
 | 
	
		
			
				|  |  | +                </el-option>
 | 
	
		
			
				|  |  | +              </el-option-group>
 | 
	
		
			
				|  |  | +          </el-select>
 | 
	
		
			
				|  |  | +        </el-form-item>
 | 
	
		
			
				|  |  | +      </el-form>
 | 
	
		
			
				|  |  | +      <span slot="footer"
 | 
	
		
			
				|  |  | +            class="dialog-footer">
 | 
	
		
			
				|  |  | +        <el-button @click="typeStatus = false">取 消</el-button>
 | 
	
		
			
				|  |  | +        <el-button type="primary" @click="onTypesSubmit('ruleForm')">确 定</el-button>
 | 
	
		
			
				|  |  | +      </span>
 | 
	
		
			
				|  |  | +    </el-dialog>
 | 
	
		
			
				|  |  |    </div>
 | 
	
		
			
				|  |  |  </template>
 | 
	
		
			
				|  |  |  <script>
 | 
	
		
			
				|  |  |  import pagination from '@/components/Pagination/index'
 | 
	
		
			
				|  |  |  import store from '@/store'
 | 
	
		
			
				|  |  | -import { categoryListTree, categoryAdd, categoryUpdate, categoryDel } from '@/api/shopManager'
 | 
	
		
			
				|  |  | +import { chargeTypeList, subjectListTree, chargeTypeUpSet } from '@/api/specialSetting'
 | 
	
		
			
				|  |  |  export default {
 | 
	
		
			
				|  |  |    components: { pagination },
 | 
	
		
			
				|  |  | -  name: 'musicalManager',
 | 
	
		
			
				|  |  | +  name: 'adminManager',
 | 
	
		
			
				|  |  |    data () {
 | 
	
		
			
				|  |  |      return {
 | 
	
		
			
				|  |  | -      organId: store.getters.organ,
 | 
	
		
			
				|  |  | -      oneTypeName: null, // 添加一级分类名称
 | 
	
		
			
				|  |  | -      subjectList: [],
 | 
	
		
			
				|  |  | -      inputValue: []
 | 
	
		
			
				|  |  | +      tableList: [],
 | 
	
		
			
				|  |  | +      subjectList: [], // 声部列表
 | 
	
		
			
				|  |  | +      formActionTitle: 'create',
 | 
	
		
			
				|  |  | +      formTitle: {
 | 
	
		
			
				|  |  | +        create: '添加作业模板',
 | 
	
		
			
				|  |  | +        update: '修改作业模板'
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      typeStatus: false, // 添加教学点 
 | 
	
		
			
				|  |  | +      formLabelWidth: '120px',
 | 
	
		
			
				|  |  | +      form: {
 | 
	
		
			
				|  |  | +        name: null, // 作业模块名称
 | 
	
		
			
				|  |  | +        subjectIds: [],
 | 
	
		
			
				|  |  | +        organId: store.getters.organ
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      rules: {
 | 
	
		
			
				|  |  | +        name: [{ required: true, message: '请输入类型名称', trigger: 'blur' }],
 | 
	
		
			
				|  |  | +        subjectIds: [{ required: true, message: '请选择声部组合', trigger: 'change' }]
 | 
	
		
			
				|  |  | +      },
 | 
	
		
			
				|  |  | +      pageInfo: {
 | 
	
		
			
				|  |  | +        // 分页规则
 | 
	
		
			
				|  |  | +        limit: 10, // 限制显示条数
 | 
	
		
			
				|  |  | +        page: 1, // 当前页
 | 
	
		
			
				|  |  | +        total: 0, // 总条数
 | 
	
		
			
				|  |  | +        page_size: [10, 20, 40, 50] // 选择限制显示条数
 | 
	
		
			
				|  |  | +      }
 | 
	
		
			
				|  |  |      }
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    mounted() {
 | 
	
		
			
				|  |  |      this.getList()
 | 
	
		
			
				|  |  | +    this.getSubjectTree()
 | 
	
		
			
				|  |  |    },
 | 
	
		
			
				|  |  |    methods: {
 | 
	
		
			
				|  |  | -    onAddMusic() {
 | 
	
		
			
				|  |  | -      // 添加一级分类 
 | 
	
		
			
				|  |  | -      if(!this.oneTypeName) return
 | 
	
		
			
				|  |  | -      categoryAdd({
 | 
	
		
			
				|  |  | -        parentId: 0,
 | 
	
		
			
				|  |  | -        name: this.oneTypeName
 | 
	
		
			
				|  |  | -      }).then(res => {
 | 
	
		
			
				|  |  | -        this.messageTips('添加', res)
 | 
	
		
			
				|  |  | -      })
 | 
	
		
			
				|  |  | -    },
 | 
	
		
			
				|  |  | -    onSave(item, index) { 
 | 
	
		
			
				|  |  | -      // 添加二级分类 
 | 
	
		
			
				|  |  | -      if(!this.inputValue[index]) return
 | 
	
		
			
				|  |  | -      categoryAdd({
 | 
	
		
			
				|  |  | -        parentId: item.id,
 | 
	
		
			
				|  |  | -        name: this.inputValue[index]
 | 
	
		
			
				|  |  | -      }).then(res => {
 | 
	
		
			
				|  |  | -        this.messageTips('添加', res)
 | 
	
		
			
				|  |  | -      })
 | 
	
		
			
				|  |  | -    },
 | 
	
		
			
				|  |  | -    subjectDelete(item) { // 删除分类
 | 
	
		
			
				|  |  | -      categoryDel(item.id).then(res => {
 | 
	
		
			
				|  |  | -        this.messageTips('删除', res)
 | 
	
		
			
				|  |  | +    onTypesSubmit (formName) { // 添加数据
 | 
	
		
			
				|  |  | +      this.$refs[formName].validate((valid) => {
 | 
	
		
			
				|  |  | +        if (valid) {
 | 
	
		
			
				|  |  | +          if (this.formActionTitle == 'create') {
 | 
	
		
			
				|  |  | +            if(this.form.id) { // 判断有没有Id,如果有则删除
 | 
	
		
			
				|  |  | +              delete this.form.id
 | 
	
		
			
				|  |  | +            }
 | 
	
		
			
				|  |  | +            chargeTypeUpSet(this.form).then(res => {
 | 
	
		
			
				|  |  | +              this.messageTips('添加', res)
 | 
	
		
			
				|  |  | +            })
 | 
	
		
			
				|  |  | +          } else if (this.formActionTitle == 'update') {
 | 
	
		
			
				|  |  | +            chargeTypeUpSet(this.form).then(res => {
 | 
	
		
			
				|  |  | +              this.messageTips('修改', res)
 | 
	
		
			
				|  |  | +            })
 | 
	
		
			
				|  |  | +          }
 | 
	
		
			
				|  |  | +        } else {
 | 
	
		
			
				|  |  | +          return false;
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  |        })
 | 
	
		
			
				|  |  |      },
 | 
	
		
			
				|  |  |      messageTips(title, res) {
 | 
	
	
		
			
				|  | @@ -95,22 +129,72 @@ export default {
 | 
	
		
			
				|  |  |            message: title + '成功',
 | 
	
		
			
				|  |  |            type: 'success'
 | 
	
		
			
				|  |  |          })
 | 
	
		
			
				|  |  | +        this.typeStatus = false
 | 
	
		
			
				|  |  |          this.getList()
 | 
	
		
			
				|  |  |        } else {
 | 
	
		
			
				|  |  |          this.$message.error(res.msg)
 | 
	
		
			
				|  |  |        }
 | 
	
		
			
				|  |  |      },
 | 
	
		
			
				|  |  | -    getList () {
 | 
	
		
			
				|  |  | -      categoryListTree({
 | 
	
		
			
				|  |  | +    getList () { 
 | 
	
		
			
				|  |  | +      chargeTypeList().then(res => {
 | 
	
		
			
				|  |  | +        let result = res.data
 | 
	
		
			
				|  |  | +        if(res.code == 200) {
 | 
	
		
			
				|  |  | +          result.rows.forEach(row => {
 | 
	
		
			
				|  |  | +            let subjectname = [],
 | 
	
		
			
				|  |  | +              subjectIds = []
 | 
	
		
			
				|  |  | +            row.subjects.forEach(item => {
 | 
	
		
			
				|  |  | +              subjectname.push(item.name)
 | 
	
		
			
				|  |  | +              subjectIds.push(item.id)
 | 
	
		
			
				|  |  | +            })
 | 
	
		
			
				|  |  | +            row.subjectName = subjectname
 | 
	
		
			
				|  |  | +            row.subjectIds = subjectIds
 | 
	
		
			
				|  |  | +          })
 | 
	
		
			
				|  |  | +          this.tableList = result.rows
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  | +      })
 | 
	
		
			
				|  |  | +    },
 | 
	
		
			
				|  |  | +    openTypes(type, row) {
 | 
	
		
			
				|  |  | +      this.typeStatus = true
 | 
	
		
			
				|  |  | +      this.formActionTitle = type
 | 
	
		
			
				|  |  | +      // 修改的时候赋值
 | 
	
		
			
				|  |  | +      if (type == 'update') {
 | 
	
		
			
				|  |  | +        this.form = {
 | 
	
		
			
				|  |  | +          id: row.id,
 | 
	
		
			
				|  |  | +          name: row.name,
 | 
	
		
			
				|  |  | +          subjectIds: row.subjectIds,
 | 
	
		
			
				|  |  | +          organId: store.getters.organ
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  | +      }
 | 
	
		
			
				|  |  | +    },
 | 
	
		
			
				|  |  | +    onFormClose (formName) { // 关闭弹窗重置验证
 | 
	
		
			
				|  |  | +      this.form = {
 | 
	
		
			
				|  |  | +        name: null, // 作业模块名称
 | 
	
		
			
				|  |  | +        subjectIds: [],
 | 
	
		
			
				|  |  | +        organId: store.getters.organ
 | 
	
		
			
				|  |  | +      }
 | 
	
		
			
				|  |  | +      this.$refs[formName].resetFields()
 | 
	
		
			
				|  |  | +    },
 | 
	
		
			
				|  |  | +    getSubjectTree() { // 获取声部列表
 | 
	
		
			
				|  |  | +      subjectListTree({
 | 
	
		
			
				|  |  |          delFlag: 0,
 | 
	
		
			
				|  |  |          rows: 9999
 | 
	
		
			
				|  |  |        }).then(res => {
 | 
	
		
			
				|  |  |          let result = res.data
 | 
	
		
			
				|  |  |          if(res.code == 200) {
 | 
	
		
			
				|  |  |            let tempArray = []
 | 
	
		
			
				|  |  | -          result.rows.forEach(item => {
 | 
	
		
			
				|  |  | -            item.inputStatus = false
 | 
	
		
			
				|  |  | -            tempArray.push(item)
 | 
	
		
			
				|  |  | +          result.rows.forEach((item, index) => {
 | 
	
		
			
				|  |  | +            let subject = []
 | 
	
		
			
				|  |  | +            item.subjects.forEach(s => {
 | 
	
		
			
				|  |  | +              subject.push({
 | 
	
		
			
				|  |  | +                value: s.id,
 | 
	
		
			
				|  |  | +                label: s.name
 | 
	
		
			
				|  |  | +              })
 | 
	
		
			
				|  |  | +            })
 | 
	
		
			
				|  |  | +            
 | 
	
		
			
				|  |  | +            tempArray[index] = {
 | 
	
		
			
				|  |  | +              label: item.name,
 | 
	
		
			
				|  |  | +              options: subject
 | 
	
		
			
				|  |  | +            }
 | 
	
		
			
				|  |  |            })
 | 
	
		
			
				|  |  |            this.subjectList = tempArray
 | 
	
		
			
				|  |  |          }
 | 
	
	
		
			
				|  | @@ -119,58 +203,7 @@ export default {
 | 
	
		
			
				|  |  |    }
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  |  </script>
 | 
	
		
			
				|  |  | -<style lang="scss" scoped>
 | 
	
		
			
				|  |  | -.el-popover {
 | 
	
		
			
				|  |  | -  .el-form {
 | 
	
		
			
				|  |  | -    display: flex;
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -  .el-form-item__content {
 | 
	
		
			
				|  |  | -    margin-left: 0 !important;
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  | -.music-title {
 | 
	
		
			
				|  |  | -  font-size: 14px;
 | 
	
		
			
				|  |  | -  color: #444;
 | 
	
		
			
				|  |  | -  .el-col {
 | 
	
		
			
				|  |  | -    background-color: #EDEEF0;
 | 
	
		
			
				|  |  | -    padding-left: 36px;
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -  .el-button {
 | 
	
		
			
				|  |  | -    float: right;
 | 
	
		
			
				|  |  | -    margin-top: 10px;
 | 
	
		
			
				|  |  | -    margin-right: 16px;
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  | -.el-row {
 | 
	
		
			
				|  |  | -  margin-bottom: 12px;
 | 
	
		
			
				|  |  | -  .el-col {
 | 
	
		
			
				|  |  | -    line-height: 48px;
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -  .el-col-18 {
 | 
	
		
			
				|  |  | -    width: calc(75% - 20px);
 | 
	
		
			
				|  |  | -    margin-left: 20px;
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -  .one_name {
 | 
	
		
			
				|  |  | -    padding-left: 10px;
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -  .tow_col {
 | 
	
		
			
				|  |  | -    padding-left: 20px;
 | 
	
		
			
				|  |  | -    .el-button--primary{
 | 
	
		
			
				|  |  | -      background: #fff;
 | 
	
		
			
				|  |  | -      border-color: #979797;
 | 
	
		
			
				|  |  | -      color: #777;
 | 
	
		
			
				|  |  | -      &:hover, &:active, &:focus {
 | 
	
		
			
				|  |  | -        background: #fff;
 | 
	
		
			
				|  |  | -        border-color: #979797;
 | 
	
		
			
				|  |  | -        color: #777;
 | 
	
		
			
				|  |  | -      }
 | 
	
		
			
				|  |  | -    }
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -  .tow_input {
 | 
	
		
			
				|  |  | -    width: 100px;
 | 
	
		
			
				|  |  | -    margin-right: 12px;
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  | +<style lang="scss">
 | 
	
		
			
				|  |  |  .el-input-group__append, .el-button--primary {
 | 
	
		
			
				|  |  |    background: #14928a;
 | 
	
		
			
				|  |  |    border-color: #14928a;
 | 
	
	
		
			
				|  | @@ -187,27 +220,4 @@ export default {
 | 
	
		
			
				|  |  |  .el-select {
 | 
	
		
			
				|  |  |    width: 98% !important;
 | 
	
		
			
				|  |  |  }
 | 
	
		
			
				|  |  | -.el-tag + .el-tag {
 | 
	
		
			
				|  |  | -  margin-left: 10px;
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  | -.button-new-tag {
 | 
	
		
			
				|  |  | -  margin-left: 10px;
 | 
	
		
			
				|  |  | -  height: 32px;
 | 
	
		
			
				|  |  | -  line-height: 30px;
 | 
	
		
			
				|  |  | -  padding-top: 0;
 | 
	
		
			
				|  |  | -  padding-bottom: 0;
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  | -.input-new-tag {
 | 
	
		
			
				|  |  | -  width: 90px;
 | 
	
		
			
				|  |  | -  // margin-left: 10px;
 | 
	
		
			
				|  |  | -  vertical-align: bottom;
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  | -.el-tag--dark.el-tag--info {
 | 
	
		
			
				|  |  | -  background-color: #F0F2F5;
 | 
	
		
			
				|  |  | -  border-color: #F0F2F5;
 | 
	
		
			
				|  |  | -  color: #5A5E66;
 | 
	
		
			
				|  |  | -  /deep/.el-tag__close {
 | 
	
		
			
				|  |  | -    background-color: #C0C4CC;
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -}
 | 
	
		
			
				|  |  |  </style>
 |