调整界面

package.json

 {
-  "name": "hnyc-data",
+  "name": "data-platform1",
   "version": "0.1.0",
   "private": true,
   "dependencies": {
@@ -12,7 +12,7 @@
     "@testing-library/user-event": "^7.1.2",
     "@typescript-eslint/eslint-plugin": "^2.10.0",
     "@typescript-eslint/parser": "^2.10.0",
-    "antd": "^3.26.0",
+    "antd": "3.26.16",
     "babel-eslint": "10.1.0",
     "babel-jest": "^24.9.0",
     "babel-loader": "8.1.0",
@@ -73,7 +73,8 @@
     "redux": "^4.0.1",
     "redux-saga": "^1.0.5",
     "axios": "^0.19.0",
-    "crypto-js": "^4.0.0"
+    "crypto-js": "^4.0.0",
+    "moment": "^2.24.0"
   },
   "scripts": {
     "start": "node scripts/start.js",
@@ -148,5 +149,6 @@
       "react-app"
     ]
   },
-  "proxy": "http://139.198.127.54:18391"
+  "proxy": "http://192.168.0.216:8762",
+  "homepage": "http://myhost/data-platform1"
 }

src/global.less

@@ -56,3 +56,35 @@
     max-width: 100%;
   }
 }
+
+.ant-modal-body {
+  .ant-descriptions-item-label, .ant-table-column-title {
+    color: #333 !important;
+  }
+
+  .ant-descriptions-item-content, .ant-table-tbody {
+    color: #666 !important;
+  }
+
+  .ant-tabs-nav {
+    color: #999 !important;
+  }
+}
+
+/* 滚动条 */
+::-webkit-scrollbar-track-piece {
+  background-color:#ededed;
+}
+
+::-webkit-scrollbar {
+  width:5px;
+  height:5px;
+}
+::-webkit-scrollbar-thumb {
+  background-color:#bbb;
+  background-clip:padding-box;
+  min-height:30px;
+}
+::-webkit-scrollbar-thumb:hover {
+  background-color:#bbb;
+}
\ No newline at end of file

src/model/user.js

@@ -25,6 +25,10 @@ export function* questions(payload) {
   return yield call(service.questions, payload); 
 }
 
+export function* saveQuestion(payload) {
+  return yield call(service.saveQuestion, payload);
+}
+
 export function* domains(payload) {
   return yield call(service.domains, payload);
 }

src/routes.js

@@ -52,10 +52,10 @@ export const routes = [
         name: 'authorized',
         text: '已获授权'
       },
-      {
-        name: 'question',
-        text: '我的问题'
-      }
+      // {
+      //   name: 'question',
+      //   text: '我的问题'
+      // }
     ]
   },
 ];

src/service/user.js

@@ -23,6 +23,10 @@ export async function questions(payload) {
   return GetJSON("/questionfeedback/rest/issuetrack/mylist", payload);
 }
 
+export async function saveQuestion(payload) {
+  return PostJSON("/questionfeedback/rest/issuetrack/save", payload);
+}
+
 export async function domains(payload) {
   return GetJSON(`/authservice/users/${payload.userId}/domains`, payload);
 }

src/util/index.js

@@ -4,7 +4,7 @@ import { Redirect } from 'react-router-dom';
 import { dispatchLatest, action } from '../model';
 import { set_sess_state } from "../model/reducer";
 
-export const ContextPath = '/data-platform';
+export const ContextPath = '/data-platform1';
 
 const routeMap = {};
 export const ConvertToRouteMap = function (routes, pPath, pRoute) {

src/view/Home/HomeHelper.js

@@ -109,7 +109,7 @@ const homeMenu = [
   { title: '元数据', img: menuImg2, url: `${ContextPath}/manage/metadata` },
   { title: '数据指标', img: menuImg3, url: `${ContextPath}/manage/indicator` },
   { title: '数据标准', img: menuImg4, url: `${ContextPath}/manage/standard` },
-  { title: '数据质量', img: menuImg5 },
+  // { title: '数据质量', img: menuImg5 },
 ];
 
 export class HomeMenu extends Component {

src/view/Manage/Assets/components/AssetList.js

@@ -14,7 +14,7 @@ import {
 } from 'antd';
 
 import { DataDesc, DataPreview, DataDetail, ApplyDesc } from './AssetListHelper';
-import styles from '../style.less';
+import '../style.less';
 import { dispatch, dispatchLatest } from '../../../../model';
 
 const { Text } = Typography;
@@ -185,7 +185,7 @@ class AssetListCOM extends Component {
         </Row>
         <Row>
           <Col md={18}>
-            <Text>资产摘要：</Text>
+            <Text>资产备注：</Text>
             <span dangerouslySetInnerHTML={{ __html: item.remarks }} />
           </Col>
           <Col md={6}>
@@ -259,7 +259,7 @@ class AssetListCOM extends Component {
     return (
       <React.Fragment>
         <List
-          className={styles['asset-list']}
+          className='asset-list'
           loading={loading}
           itemLayout="vertical"
           dataSource={tableModels || []}

src/view/Manage/Assets/components/AssetListHelper.js

 import React, { Component, Fragment, useState } from 'react';
-import { Table, Descriptions, Icon, Row, Col, Input, Checkbox, Divider, Pagination, Form, DatePicker, Button, message } from 'antd';
+import { Table, Descriptions, Row, Col, Input, Checkbox, Divider, Pagination, Form, DatePicker, Button, message } from 'antd';
 import classnames from 'classnames';
+import { CheckOutlined } from '@ant-design/icons';
 
 import { paginate } from '../../../../util';
 
@@ -11,7 +12,7 @@ const despColumns = [
   {
     key: 'privileged',
     title: '已授权',
-    render: (val) => (val === true ? <Icon type="key" /> : <span>无</span>),
+    render: (val) => (val.privileged === true ? <CheckOutlined className='text-primary' /> : <span>无</span>),
   },
   { key: 'ordinalPosition', dataIndex: 'ordinalPosition', title: '序号' },
   { key: 'name', dataIndex: 'name', title: '名称' },
@@ -58,6 +59,7 @@ export const DataDesc = ({ dataDesc }) => {
           pageSize={pageSize}
           defaultCurrent={1}
           total={dataDesc.columns.length}
+          showTotal={total => `共 ${total} 条`}
           />
       )}
     </Fragment>
@@ -239,6 +241,7 @@ const ApplyDescFunc = ({ dataDesc, form, apply }) => {
           pageSize={pageSize}
           defaultCurrent={1}
           total={dataDesc.columns.length}
+          showTotal={total => `共 ${total} 条`}
         />
       )}
       <Divider />

src/view/Manage/Assets/components/AssetTree.js

 import React, { Component } from "react"
 import { Tree, Card, Spin } from 'antd';
 
+import '../style.less';
+
 const { TreeNode } = Tree;
 
 class AssetTreeCOM extends Component {
@@ -36,7 +38,7 @@ class AssetTreeCOM extends Component {
       return [];
     };
     return (
-      <Card bordered={false} >
+      <Card bordered={false} className="asset-tree">
         {treeData ? (
           <Tree
             defaultExpandedKeys={['0-0']}

src/view/Manage/Assets/index.jsx

@@ -5,6 +5,7 @@ import AssetTreeCOM from './components/AssetTree';
 import AssetListCOM from './components/AssetList';
 import { dispatchLatest } from '../../../model';
 import PageHeaderWrapper from '../../../layout/PageHeaderWrapper';
+import './style.less';
 
 const { Search } = Input;
 
@@ -75,12 +76,12 @@ class Assets extends Component {
           />
         }
       >
-        <Row gutter={16}>
+        <Row gutter={16} className="manage-asset">
           <Col md={6}>
             <AssetTreeCOM treeData={treeData} onSelect={this.getList} />
           </Col>
           <Col md={18}>
-            <Card bordered={false}>
+            <Card bordered={false} className='asset-table'>
               <AssetListCOM
                 loading={loading}
                 tableModels={items}
@@ -100,6 +101,7 @@ class Assets extends Component {
                   pageSize={pageSize}
                   defaultCurrent={1}
                   total={total}
+                  showTotal={total => `共 ${total} 条`}
                 />
             </Card>
           </Col>

src/view/Manage/Assets/style.less

-.asset-list :global(.ant-list-item-action) {
+.asset-list {
+  height: calc(100vh - 148px - 48px - 42px) !important;
+  overflow: auto;
+  margin-bottom: 10px;
+  & .ant-list-item-action {
     text-align: right;
-}
-.asset-list :global(.ant-rate) {
+  }
+  & .ant-rate {
     font-size: 14px;
+  }
+}
+
+.asset-table {
+  height: calc(100vh - 148px);
+  overflow: auto;
 }
 
-.asset-tree:global(.ant-card) {
-  min-height: 300px;
-  max-height: calc(100vh - 180px);
+.asset-tree {
+  height: calc(100vh - 148px);
   overflow: auto;
+  border-right: 1px solid #ededed;
 }
 
 .download {

src/view/Manage/Search/index.jsx

@@ -4,6 +4,7 @@ import { SearchBar } from './components/SearchHelper';
 import AssetListCOM from '../Assets/components/AssetList';
 import { dispatchLatest } from '../../../model';
 import PageHeaderWrapper from '../../../layout/PageHeaderWrapper';
+import './style.less'; 
 
 class SearchResult extends Component {
   constructor(props) {
@@ -42,7 +43,7 @@ class SearchResult extends Component {
     const { items, total, pageNum, pageSize, loading, keyword, domain } = this.state;
     return (
       <PageHeaderWrapper {...this.props}>
-        <Card bordered={false}>
+        <Card bordered={false} className="asset-search">
           <SearchBar 
             onChange={this.onSearchBarChange} 
             {...this.props}
@@ -66,6 +67,7 @@ class SearchResult extends Component {
               pageSize={pageSize}
               defaultCurrent={1}
               total={total}
+              showTotal={total => `共 ${total} 条`}
             />
         </Card>
       </PageHeaderWrapper>

src/view/Manage/Search/style.less

+.asset-search {
+  .asset-list {
+    height: calc(100vh - 148px - 48px - 42px - 133px) !important;
+  }
+}
\ No newline at end of file

src/view/Metadata/Indicator/components/MetadataList.js

@@ -9,6 +9,7 @@ import {
   Tabs
 } from 'antd';
 import { DataDetail, DataDesc } from "./MetadataListHelper";
+import '../style.less';
 
 const { Text } = Typography;
 const { TabPane } = Tabs;
@@ -81,6 +82,7 @@ export default class MetadataListCOM extends Component {
       <React.Fragment>
         <List
           loading={loading}
+          className='metadata-list'
           itemLayout="vertical"
           dataSource={_tableModels || []}
           renderItem={item => (

src/view/Metadata/Indicator/components/MetadataTree.js

@@ -134,7 +134,7 @@ class MetadataTreeCOM extends Component {
   render() {
     const { treeData, expandedKeys, selectedKeys, domains, currentDomainValue  } = this.state;
     return (
-      <Card bordered={false} >
+      <Card bordered={false} className="metadata-tree">
         <Row style={{ marginBottom: '16px' }}>
           <Select 
             style={{ width: '100%' }}
@@ -152,7 +152,6 @@ class MetadataTreeCOM extends Component {
         <Row>
         {treeData ? (
           <Tree 
-            className="metadata-tree"
             showLine
             expandedKeys={expandedKeys}
             selectedKeys={selectedKeys}

src/view/Metadata/Indicator/index.jsx

@@ -54,7 +54,6 @@ export default class Indicator extends Component {
     return (
       <PageHeaderWrapper 
         {...this.props} 
-        className="indicator-container"
         extra={
           <Search 
             placeholder="请输入"
@@ -67,7 +66,7 @@ export default class Indicator extends Component {
           />
         }
       >
-        <Row gutter={16}>
+        <Row gutter={16} className="indicator-container" >
           <Col md={6}>
             <MetadataTreeCOM type="IndicatorCatalog" onSelect={this.onTreeSelect} />
           </Col>
@@ -91,6 +90,7 @@ export default class Indicator extends Component {
                 pageSize={pageSize}
                 defaultCurrent={1}
                 total={total}
+                showTotal={total => `共 ${total} 条`}
               />
             </Card>
           </Col>

src/view/Metadata/Indicator/style.less

-.indicator-container {
-  .metadata-tree {
-    min-height: 300px;
-    max-height: calc(100vh - 180px);
+.metadata-tree {
+  height: calc(100vh - 148px);
   overflow: auto;
-  }
+}
+
+.metadata-list {
+  height: calc(100vh - 148px - 48px - 42px) !important;
+  overflow: auto;
+  margin-bottom: 10px;
 }
\ No newline at end of file

src/view/Metadata/Standard/index.jsx

@@ -89,6 +89,7 @@ export default class Standard extends Component {
                 pageSize={pageSize}
                 defaultCurrent={1}
                 total={total}
+                showTotal={total => `共 ${total} 条`}
               />
             </Card>
           </Col>

src/view/Signin/index.jsx

 import React, { Component } from "react";
-import { Card, Form, Icon, Input, Button, message } from 'antd';
+import { Card, Form, Input, Button, message, Icon } from 'antd';
 import { connect } from 'react-redux';
 import CryptoJS from "crypto-js";
 

src/view/User/Authorized/index.jsx

@@ -61,6 +61,7 @@ export default class Authorized extends Component {
             pageSize={pageSize}
             defaultCurrent={1}
             total={items.length}
+            showTotal={total => `共 ${total} 条`}
           />
         </Card>
       </PageHeaderWrapper>

src/view/User/Question/components/QuestionDetail.js

+import React, { Component } from "react";
+import { Form, Input, DatePicker, Select } from 'antd';
+import moment from 'moment';
+
+const { Option } = Select;
+
+function range(start, end) {
+  const result = [];
+  for (let i = start; i < end; i++) {
+    result.push(i);
+  }
+  return result;
+}
+
+class QuestionDetail extends Component {
+
+  handleDisabledDate = (current) => {
+    const { questionItem } = this.props;
+    return current < moment(questionItem.problemFoundDate);
+  }
+
+  handleDisabledTime = (current) => {
+    const { questionItem } = this.props;
+    const _foundDate = moment(questionItem.problemFoundDate);
+
+    if (_foundDate.isSame(current, 'day')) {
+      const hours = _foundDate.hour();
+      return {
+        disabledHours: () => range(0, hours),
+      };
+    }
+
+    return {};
+  }
+
+  render() {
+    const { questionItem } = this.props;
+    const { getFieldDecorator } = this.props.form;
+    
+    const layout = {
+      labelCol: {
+        span: 6,
+      },
+      wrapperCol: {
+        span: 18,
+      },
+    };
+
+    const dateFormat = 'YYYY/MM/DD HH:mm:ss';
+
+    let remainTime = '';
+    if (questionItem.completeTime) {
+      remainTime = `${moment(questionItem.completeTime).diff(questionItem.problemFoundDate, 'days', true).toFixed(1)}天`;
+    } else {
+      remainTime = `${moment().diff(questionItem.problemFoundDate, 'days', true).toFixed(1)}天`;
+    }
+
+    return (
+      <Form {...layout} name="basic">
+        <Form.Item label="项目编号">
+          {getFieldDecorator('itemNo', {
+            initialValue: questionItem.itemNo||'',
+          })(<Input disabled />)}
+        </Form.Item>
+        <Form.Item label="项目名称">
+          {getFieldDecorator('projectName', {
+            initialValue: questionItem.projectName||'',
+          })(<Input disabled />)}
+        </Form.Item>
+        <Form.Item label="融资金额">
+          {getFieldDecorator('financeAmount', {
+            initialValue: questionItem.financeAmount||'',
+          })(<Input disabled />)}
+        </Form.Item>
+        <Form.Item label="问题描述">
+          {getFieldDecorator('problemDesc', {
+            initialValue: questionItem.problemDesc||'',
+          })(<Input disabled />)}
+        </Form.Item>
+        <Form.Item label="项目经理">
+          {getFieldDecorator('projectManager', {
+            initialValue: questionItem.projectManager||'',
+          })(<Input disabled />)}
+        </Form.Item>
+        <Form.Item label="项目团队">
+          {getFieldDecorator('projectTeam', {
+            initialValue: questionItem.projectTeam||'',
+          })(<Input disabled />)}
+        </Form.Item>
+        <Form.Item label="发现问题日期">
+          {getFieldDecorator('problemFoundDate', {
+            initialValue: moment(moment(questionItem.problemFoundDate||''),dateFormat),
+          })(<DatePicker 
+            showTime 
+            format={dateFormat} 
+            disabled />)}
+        </Form.Item>
+        <Form.Item label="停留时间">
+          {getFieldDecorator('remainTime', {
+            initialValue: remainTime,
+          })(<Input disabled />)}
+        </Form.Item>
+        <Form.Item label="完成时间">
+          {getFieldDecorator('completeTime', {
+            initialValue: moment(moment(questionItem.completeTime||''),dateFormat),
+          })(<DatePicker 
+            showTime
+            format={dateFormat}
+            disabledDate={this.handleDisabledDate}
+            disabledTime={this.handleDisabledTime} />)}
+        </Form.Item>
+        <Form.Item label="完成情况">
+          {getFieldDecorator('performance', {
+            initialValue: questionItem.performance,dateFormat,
+            rules: [
+              {
+                required: true,
+                message: '请选择',
+              },
+            ],
+          })(<Select>
+              <Option value="confirm">确认问题</Option>
+              <Option value="dealing">正在解决</Option>
+              <Option value="solve">解决问题</Option>
+            </Select> )}
+        </Form.Item>
+        <Form.Item label="完成描述" name="solveDesc">
+          {getFieldDecorator('solveDesc', {
+            initialValue: questionItem.solveDesc||'',
+          })(<Input.TextArea placeholder="请输入完成描述" autoSize /> )}
+        </Form.Item>
+      </Form>
+    );
+  }
+}
+
+export default Form.create({ name: "question_datail"})(QuestionDetail);
+
+

src/view/User/Question/index.jsx

 import React, { Component } from "react";
-import { Card, Table, Radio, Pagination, Input, Button } from 'antd';
+import { Card, Table, Radio, Pagination, Input, Button, Modal } from 'antd';
 
-import { dispatchLatest } from '../../../model';
+import { dispatchLatest, dispatch } from '../../../model';
 import PageHeaderWrapper from '../../../layout/PageHeaderWrapper';
+import QuestionDetail from './components/QuestionDetail';
 
 export default class Question extends Component {
 
   constructor(props) {
     super(props);
+
+    this.formRef = React.createRef()
+
     this.state = { 
       items: null,
       loading: false, 
@@ -48,7 +52,9 @@ export default class Question extends Component {
             </Button>
           ),
         },
-      ]
+      ],
+      questionItem: null,
+      showModal: false,
     };
   }
 
@@ -96,11 +102,42 @@ export default class Question extends Component {
   }
 
   onQuestionUpdate = (record) => {
+    this.setState({ showModal: true, questionItem: record });
+  };
+
+  onQuestionDetailOK = (e) => {
+    const { questionItem, type, keyword, pageNum, pageSize } = this.state;
+
+    const _this = this;
+    this.formRef.current.validateFields((err, values) => {
+      if (!err) {
 
+        const _item = {
+          ...questionItem,
+          performance: values.performance,
+          completeTime: values.completeTime,
+          remainTime: values.remainTime,
+          solveDesc: values.solveDesc,
         };
 
+        console.log(_item);
+
+        dispatch({
+          type: 'user.saveQuestion',
+          payload: _item,
+          callback: data => {
+            console.log('save question success');
+            _this.formRef.current.resetFields();
+            _this.setState({ showModal: false });
+            _this.getList(type, keyword, pageNum, pageSize);
+          }
+        })
+      }
+    });
+  }
+
   render() {
-    const { keyword, type, loading, columns, items, pageNum, pageSize, total } = this.state;
+    const { keyword, type, loading, columns, items, pageNum, pageSize, total, questionItem, showModal } = this.state;
     return (
       <PageHeaderWrapper {...this.props}>
         <Card
@@ -133,7 +170,7 @@ export default class Question extends Component {
               loading={loading}
             />
           <Pagination
-              className="text-center"
+              className="text-center mt-3"
               showSizeChanger
               showQuickJumper
               onChange={(_pageNum, _pageSize) => {
@@ -146,9 +183,25 @@ export default class Question extends Component {
               pageSize={pageSize}
               defaultCurrent={1}
               total={total}
+              showTotal={total => `共 ${total} 条`}
             />
-
         </Card>
+
+        {questionItem && (
+          <Modal
+            className="modal-lg"
+            title="更新我的问题"
+            visible={showModal}
+            width="520px"
+            onCancel={e => {
+              this.setState({ showModal: false });
+            }}
+            onOk={this.onQuestionDetailOK}
+          >
+            <QuestionDetail ref={this.formRef} questionItem={questionItem} />
+          </Modal>
+        )}
+
       </PageHeaderWrapper>
     );
   }

src/view/User/Subscrible/index.jsx

@@ -61,6 +61,7 @@ export default class Subscrible extends Component {
             pageSize={pageSize}
             defaultCurrent={1}
             total={items.length}
+            showTotal={total => `共 ${total} 条`}
           />
         </Card>
       </PageHeaderWrapper>