feat: 增加项目分类本身的删除和修改名称功能

client/containers/Group/ProjectList/ProjectList.js

@@ -150,7 +150,11 @@ class ProjectList extends Component {
  } else {
  noGroup = noGroup.concat(projectDataWithGroupMap[item._id] || []);
  }
+ delete projectDataWithGroupMap[item._id];
  });
+ Object.keys(projectDataWithGroupMap).forEach(k => {
+ noGroup = noGroup.concat(projectDataWithGroupMap[k] || [])
+ })
  projectDataWithGroup.push({
  subGroupName: '未分类',
  subGroupId: -1,

client/containers/Group/SubGroupSetting/SubGroupSetting.js

@@ -7,9 +7,10 @@ import React, { PureComponent as Component } from 'react';
 import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { fetchSubGroupList } from '../../../reducer/modules/subGroup.js'
-import { Input, Button, message } from 'antd';
+import { Input, Button, Icon, Alert, message, Modal } from 'antd';
 import Axios from 'axios';
-import './SubGroupSetting.scss'
+import './SubGroupSetting.scss';
+const confirm = Modal.confirm;
 
 @connect(
  state => {
@@ -26,7 +27,8 @@ class SubGroupSetting extends Component {
  constructor(props) {
  super(props);
  this.state = {
- name: ''
+ name: '',
+ currentSubGroup: ''
  }
  }
  static propTypes = {
@@ -51,26 +53,98 @@ class SubGroupSetting extends Component {
  this.setState({
  name: ''
  });
- })
+ });
  }
  handleChange = (e) => {
  this.setState({
  name: e.target.value
+ });
+ }
+ editSubGroup = (e) => {
+ this.setState({
+ currentSubGroup: e.target.dataset.id * 1
+ });
+ }
+ setListRef = element => {
+ this.ulList = element
+ }
+ upSubGroup = (e) => {
+ let id = e.target.dataset.id * 1;
+ let name = e.target.value.trim();
+ if (!name) {
+ return
+ }
+ // 判断是否重复
+ let isExists = this.props.subGroupList.some(g => {
+ return g.name === name && g._id !== id
  })
+ if (isExists) {
+ message.error('分类名称已存在，请重新输入');
+ return
+ }
+ Axios.post('/api/subgroup/edit', {
+ name: name,
+ id: id
+ }).then(res => {
+ console.log(res);
+ this.props.fetchSubGroupList(this.props.currGroup._id);
+ this.setState({
+ currentSubGroup: ''
+ })
+ })
+ }
+ delSubGroup = (e) => {
+ let that = this;
+ let id = e.target.dataset.id * 1;
+ confirm({
+ title: '确认删除该分类吗吗？',
+ content: (
+ <div style={{ marginTop: '10px', fontSize: '13px', lineHeight: '25px' }}>
+ <Alert
+ message="删除分类仅会将该分类下的项目规划到未分类！"
+ type="warning"
+ />
+ </div>
+ ),
+ onOk() {
+ Axios.post('/api/subgroup/del', {
+ id
+ }).then(() => {
+ message.success('已删除');
+ that.props.fetchSubGroupList(that.props.currGroup._id);
+ });
+ },
+ iconType: 'delete',
+ onCancel() {}
+ });
  }
  render () {
  return (
  <div className="sub-group">
  <div className="sub-group__form">
  <div>
- <Input placeholder="请输入分类名称" value={this.state.name} onChange={this.handleChange} onPressEnter={this.handleClick}/>
+ <Input placeholder="请输入分类名称" maxLength={30} value={this.state.name} onChange={this.handleChange} onPressEnter={this.handleClick}/>
  </div>
  <Button type="primary" onClick={this.handleClick}>添加</Button>
  </div>
- <div className="sub-group__title">已添加分组</div>
- <ul className="sub-group__list">
+ <div className="sub-group__title">已添加分类</div>
+ <ul className="sub-group__list" ref={this.setListRef}>
  {this.props.subGroupList.map(subGroup => (
- <li key={subGroup._id}>{subGroup.name}</li>
+ <li key={subGroup._id}>
+ {
+ this.state.currentSubGroup === subGroup._id ? (
+ <Input placeholder="请输入分类名称" maxLength={30} data-id={subGroup._id} defaultValue={subGroup.name} onBlur={this.upSubGroup} onPressEnter={this.upSubGroup} />
+ ) : (
+ <React.Fragment>
+ <div>
+ {subGroup.name}
+ </div>
+ <Icon data-id={subGroup._id} type="edit" onClick={this.editSubGroup} />
+ <Icon data-id={subGroup._id} type="delete" onClick={this.delSubGroup} />
+ </React.Fragment>
+ )
+ }
+ </li>
  ))}
  </ul>
  </div>
@@ -85,6 +159,11 @@ class SubGroupSetting extends Component {
  componentDidMount () {
  this.props.fetchSubGroupList(this.props.currGroup._id)
  }
+ componentDidUpdate () {
+ let input = this.ulList.querySelector('input');
+ input && input.focus();
+ input && input.select();
+ }
 }
 
 export default SubGroupSetting;

client/containers/Group/SubGroupSetting/SubGroupSetting.scss

@@ -17,9 +17,21 @@
  }
  &__list {
  > li {
- line-height: 40px;
+ display: flex;
+ align-items: center;
+ padding: 8px 0;
  border-bottom: 1px solid #d9d9d9;
  text-indent: 10px;
+ > div {
+ flex-grow: 1;
+ }
+ > i {
+ padding: 0 5px;
+ cursor: pointer;
+ }
+ > i:hover {
+ color: #2395f1;
+ }
  }
  }
 }

server/controllers/subGroup.js

@@ -6,6 +6,7 @@
 const baseController = require('./base.js');
 const yapi = require('../yapi.js');
 const subGroupModel = require('../models/subGroup')
+const projectModel = require('../models/project.js');
 
 class subGroupController extends baseController {
  constructor(ctx) {
@@ -21,6 +22,10 @@ class subGroupController extends baseController {
  list: {
  group_id: 'number'
  },
+ up: {
+ id: 'number',
+ name: 'string'
+ }
  }
  }
  async add (ctx) {
@@ -34,8 +39,20 @@ class subGroupController extends baseController {
  let result = await subGroupInst.save(data);
  ctx.body = yapi.commons.resReturn(result);
  }
+ async up (ctx) {
+ let params = ctx.params;
+ let data = {
+ id: params.id,
+ name: params.name,
+ }
+ let subGroupInst = yapi.getInst(subGroupModel);
+ let result = await subGroupInst.up(data.id, data);
+ ctx.body = yapi.commons.resReturn(result);
+ }
  async del (ctx) {
  let params = ctx.params;
+ let projectInst = yapi.getInst(projectModel);
+ await projectInst.upSubGroup(params.id, 0);
  let subGroupInst = yapi.getInst(subGroupModel);
  let result = await subGroupInst.del(params.id);
  ctx.body = yapi.commons.resReturn(result);

server/models/project.js

@@ -302,6 +302,17 @@ class projectModel extends baseModel {
  })
  .limit(10);
  }
+
+ upSubGroup (old_sub_group_id, sub_group_id) {
+ return this.model.update(
+ {
+ sub_group_id: old_sub_group_id
+ },
+ {
+ $set: { 'sub_group_id': sub_group_id }
+ }
+ );
+ }
 }
 
 module.exports = projectModel;

server/models/subGroup.js

@@ -40,6 +40,16 @@ class subGroupModel extends baseModel {
  _id: id
  });
  }
+ up(id, data) {
+ return this.model.update(
+ {
+ _id: id
+ },
+ {
+ name: data.name
+ }
+ );
+ }
 }
 
 module.exports = subGroupModel;

server/router.js

@@ -119,6 +119,11 @@ let routerConfig = {
  path: 'add',
  method: 'post'
  },
+ {
+ action: 'up',
+ path: 'edit',
+ method: 'post'
+ },
  {
  action: 'del',
  path: 'del',