Skip to content

S
saas-weichat
Commit 3ded64db by yanglang123
Options

新增积分页面

parent e627152c
Showing with 714 additions and 1277 deletions
src/common/uploadOSS/uploadOSS.css 0 → 100644
.upload-box .ant-upload-self {
position: relative;
}
.upload-box .ant-upload-self .ant-upload:not(div) {
height: 100%;
width: 100%;
display: inline-block;
position: relative;
}
.upload-box .ant-upload-self .ant-upload:not(div) input {
display: inline-block !important;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
z-index: 999;
}
.ant-upload {
display: flex;
align-items: center;
justify-content: center;
}
src/common/uploadOSS/uploadOSS.jsx
import React, { Component } from 'react';
import { Upload, Icon } from 'antd';
import { Toast } from 'antd-mobile';
import api from '../../util/urlconfig';
import excute from '../../util/fetchUtil';
import './uploadOSS.less'
import intl from 'react-intl-universal';
import React, { Component } from "react";
import { Upload, Icon } from "antd";
import { Toast } from "antd-mobile";
import api from "../../util/urlconfig";
import excute from "../../util/fetchUtil";
import "./uploadOSS.less";
import intl from "react-intl-universal";
/*
组件说明：
该组件仅对蚂蚁的上传组件进行简单的封装，主要解决蚂蚁上传组件在移动端需要双击才能激活问题；
......@@ -29,17 +29,17 @@ class UploadOSS extends Component {
this.state = {
ossSignData: {},
currentUploadedList: [],
}
fileList:[]
};
}
componentDidMount() {
console.log(" UploadOSS ok");
this.getUploadSign();
}
getUploadSign = () => {
let _this = this;
excute.get(
api.ossUrl + '/upload/policy?t=' + new Date().getTime(),
api.ossUrl + "/upload/policy?t=" + new Date().getTime(),
(res) => {
let ossSignData = JSON.parse(res.data);
_this.setState({
......@@ -47,7 +47,7 @@ class UploadOSS extends Component {
});
}
);
}
};
fileTypeToLocal(fileType) {
let fileTypeLocal;
switch (fileType) {
......@@ -80,30 +80,42 @@ class UploadOSS extends Component {
const timeCode = +new Date();
const { ossSignData = {}, currentUploadedList } = this.state;
const {
acceptFileType = '',
maxSize = { "file": 10 },
acceptFileType = "",
maxSize = { file: 10 },
maxlength = null,
tooMoreTip = '',
tooMoreTip = "",
} = this.props;
let fileType = file.type && file.type.split('/')[0];
let fileType = file.type && file.type.split("/")[0];
// 文件基本类型： text，image，audio，video，application;
// let suffix = file.type && file.type.split('/')[1]; //有可能不存在该字段，所以还是用点截取文件名
let suffix = file.name && file.name.substring(file.name.lastIndexOf(".")).toLowerCase().trim();
let suffix =
file.name &&
file.name.substring(file.name.lastIndexOf(".")).toLowerCase().trim();
let acceptTypeArr = acceptFileType.split(",");
if (acceptFileType && !acceptTypeArr.includes(suffix) && !acceptTypeArr.includes(`${fileType}/*`)) {
if (
acceptFileType &&
!acceptTypeArr.includes(suffix) &&
!acceptTypeArr.includes(`${fileType}/*`)
) {
console.error("suffix==", suffix);
console.error("acceptTypeArr==", acceptTypeArr)
Toast.info(intl.get("PleaseUploadRightTypeFiles") || "请上传正确格式的文件。");
return false
};
console.error("acceptTypeArr==", acceptTypeArr);
Toast.info(
intl.get("PleaseUploadRightTypeFiles") || "请上传正确格式的文件。"
);
return false;
}
if (maxlength && !(maxlength > currentUploadedList.length)) {
if (tooMoreTip) {
Toast.info(tooMoreTip);
} else {
Toast.info(`${intl.get("forum17") || "最多上传"}${maxlength}${intl.get("caseAttachmentUploadTip2") || "个文件"}。`);
Toast.info(
`${intl.get("forum17") || "最多上传"}${maxlength}${
intl.get("caseAttachmentUploadTip2") || "个文件"
}。`
);
}
return false;
}
......@@ -112,74 +124,95 @@ class UploadOSS extends Component {
if (typeof maxSize == "object") {
maxSizeKeys = Object.keys(maxSize);
} else {
throw new Error("maxSize was expected a Obejct in UploadOSS Component,like {image:10}");
throw new Error(
"maxSize was expected a Obejct in UploadOSS Component,like {image:10}"
);
return;
}
let currentType = maxSizeKeys[maxSizeKeys.indexOf(fileType)];
if (file.size / 1024 / 1024 > maxSize[currentType]) {
Toast.info(`${intl.get("PleaseUpLesser1") || "请上传小于"}${maxSize[currentType]}${intl.get("Mised") || "M的"}${this.fileTypeToLocal(currentType)}。`);
return false
Toast.info(
`${intl.get("PleaseUpLesser1") || "请上传小于"}${maxSize[currentType]}${
intl.get("Mised") || "M的"
}${this.fileTypeToLocal(currentType)}。`
);
return false;
}
// debugger
Toast.loading(intl.get("fileUploading")+ "...",0);
Toast.loading(intl.get("fileUploading") + "...", 0);
this.setState({
uploadParams: {
'Filename': ossSignData.dir + "/" + file.uid + timeCode + suffix,
'key': ossSignData.dir + "/" + file.uid + timeCode + suffix,
'policy': ossSignData.policy,
'OSSAccessKeyId': ossSignData.accessid,
'success_action_status': '200',
'signature': ossSignData.signature,
Filename: ossSignData.dir + "/" + file.uid + timeCode + suffix,
key: ossSignData.dir + "/" + file.uid + timeCode + suffix,
policy: ossSignData.policy,
OSSAccessKeyId: ossSignData.accessid,
success_action_status: "200",
signature: ossSignData.signature,
},
currentUploadedList: [...currentUploadedList, {
currentUploadedList: [
...currentUploadedList,
{
name: file.name,
size: file.size,
type: file.type,
lastModified: file.lastModified,
uid: file.uid,
fileUrl: ossSignData.host + "/" + ossSignData.dir + "/" + file.uid + timeCode + suffix,
}]
fileUrl:
ossSignData.host +
"/" +
ossSignData.dir +
"/" +
file.uid +
timeCode +
suffix,
},
],
});
}
};
uploadStatusChange = (callbackInfo) => {
this.setState({ fileList:callbackInfo.fileList })
const { currentUploadedList = [] } = this.state;
let { file = {}, fileList = [], event = {} } = callbackInfo;
// file当前上传的文件对象;
// fileList历史上传的文件列表，包括上传中，上传失败的文件；
// 插入文件当前状态；
fileList.length > 0 && fileList.map((item, index) => {
fileList.length > 0 &&
fileList.map((item, index) => {
currentUploadedList.map((el, i) => {
if (el.uid == item.uid) {
el.percent = item.percent;
el.status = item.status;
}
})
});
});
if(currentUploadedList.length>0 &&currentUploadedList[0].status == "done"){
if (
currentUploadedList.length > 0 &&
currentUploadedList[0].status == "done"
) {
Toast.hide();
Toast.success(intl.get("uploadSuccess"),2);
Toast.success(intl.get("uploadSuccess"), 2);
}
console.log("上传进度",currentUploadedList);
console.log("上传进度", currentUploadedList);
this.props.deliveryFiles(currentUploadedList);
if (file.status == "error") {
Toast.info(intl.get("UploaderFailPleaseTryAgain") || "上传失败，请重试。");
}
Toast.info(
intl.get("UploaderFailPleaseTryAgain") || "上传失败，请重试。"
);
}
};
removeFile = (id, callback) => {
// 该方法通过父组件ref来调用；
let { currentUploadedList = [] } = this.state;
let indexDle
let indexDle;
currentUploadedList.forEach((item, index) => {
if (item.uid == id) {
indexDle = index;
}
})
});
let deletedArr = [];
if (indexDle > -1) {
deletedArr = currentUploadedList.splice(indexDle, 1);
......@@ -188,42 +221,46 @@ class UploadOSS extends Component {
deletedArr = [...currentUploadedList];
currentUploadedList = [];
}
this.setState({
this.setState(
{
currentUploadedList: currentUploadedList,
}, () => {
},
() => {
this.props.deliveryFiles(currentUploadedList);
if (callback) {
callback(deletedArr,currentUploadedList);
callback(deletedArr, currentUploadedList);
}
})
}
);
};
render() {
const { ossSignData = {}, uploadParams = {} } = this.state;
const {
launchUploadIcon = <Icon type="plus" className="upload-icon" />
} = this.props;
const { ossSignData = {}, uploadParams = {} ,fileList} = this.state;
const uploadButton = (
<div>
<Icon type="plus" />
</div>
);
// console.log("this.state==", this.state);
return (
<div className="upload-box">
<Upload
style={{ display: "inline-block" }}
headers={{ 'X-Requested-With': null }}
headers={{ "X-Requested-With": null }}
beforeUpload={this.beforeUpload}
action={ossSignData.host}
listType="picture-card"
fileList={fileList}
data={uploadParams}
onChange={this.uploadStatusChange}
showUploadList={false}
accept={this.props.acceptFileType}
// multiple={true}
className="ant-upload-self"
>
<div className="upload-icon-wrapper">
{launchUploadIcon}
</div>
{fileList.length >= this.props.maxlength ? null : uploadButton}
</Upload>
</div >
)
</div>
);
}
}
export default UploadOSS;
src/common/uploadOSS/uploadOSS.less
......@@ -21,3 +21,8 @@
}
}
}
.ant-upload{
display: flex;
align-items: center;
justify-content: center;
}
\ No newline at end of file
src/common/uploadTools/uploadItem/upload.jsx deleted 100644 → 0
import React, { Component } from 'react';
import { Modal, Toast } from 'antd-mobile';
import { Icon, Progress } from 'antd';
import { hashHistory } from "react-router";
import './uploaditem.less';
import func from '../../../util/commonFunc';
import thumbnail from '../../../static/image/poster.jpg';
import mediaIcon from './videoIcon.png';
import intl from "react-intl-universal";
class UploadItem extends Component {
constructor(props) {
super(props);
this.state = {
fileLookVisible: false
};
this.startFileLook = this.startFileLook.bind(this);
console.log(this.props.name);
}
getItemType(title) {
let arr = title.split(".");
let type = arr[arr.length - 1];
type = type.toLocaleLowerCase();
const imageType = ["jpg", "jpeg", "png", "gif"];
const videoType = ["mp4"];
const audioType = ["mp3"];
const docType = ["ppt", "pptx", "doc", "docx", "xls", "xlsx", "pdf"];
const compressionType = ["zip"];
if (imageType.indexOf(type) != -1) {
return "image";
} else if (videoType.indexOf(type) != -1) {
return "video";
} else if (audioType.indexOf(type) != -1) {
return "audio";
} else {
return "file";
}
}
startFileLook(item,noPreview) {
if(noPreview){
return;
}
const fileType = ["jpg", "jpeg", "png","gif","mp4","mp3"];
let typeText = "";
if (item.name) {
typeText = item.name.split(".")[item.name.split(".").length - 1];
} else {
typeText = item.title.split(".")[item.title.split(".").length - 1];
}
if (fileType.indexOf(typeText) != -1) {
hashHistory.push({
pathname: func.routerBefore() + "/mediapreview",
state: item.img ? item.img : item.imgUrl
});
} else {
console.log("startFileLook-item", item)
//下载
hashHistory.push({
pathname:func.routerBefore()+"/browserdownload",
query:{
fileUrl:encodeURIComponent(item.imgUrl)
}
});
// Toast.info("该文件格式不支持手机端在线预览，请登陆PC端查看或下载", 2);
}
}
resultItemName(name) {
let nameArr = name.split(".");
let onlyNameArr = nameArr.filter((item, index) => {
return index < nameArr.length - 1;
});
let onlyNameStr = onlyNameArr.join(".");
if (onlyNameStr.length > 10) {
return onlyNameStr.slice(0, 10) + "..." + nameArr[nameArr.length - 1];
} else {
return name;
}
}
render() {
const { item,isResult,noPreview } = this.props;
// console.log("upload-render-item", item);
if (this.props.type == "feedback") {
return (
<div className="upload-item" onClick={() => this.startFileLook(item)}>
<p>{item.title}</p>
{
item.upLoadTime ?
<div className="upload-time-homework-daying">
{func.dateFormat(item.upLoadTime)}
</div> :
<div>
<span style={{
fontSize: 24,
color: "#666",
marginLeft: 20
}}>{func.sizeFormat(item.size)}</span>
</div>
}
<div className="upload-thumbnail">
{
this.getItemType(item.title) == "image" ?
<img src={item.img} alt="" />
: <img src={mediaIcon} alt={""} />
}
</div>
</div>
);
} else if (this.props.type == "makeCourse") {
return (
<div className="upload-item">
<p>{item.title}</p>
<div className="upload-thumbnail">
<img src={item.img} alt="" />
</div>
</div>
);
} else {
if (isResult) {
return <div className="upload-result-item" onClick={() => this.startFileLook(item)}>
{this.resultItemName(item.name)}
<span>
/
{func.sizeFormat(item.size)}
</span>
</div>
} else {
return (
<div className="upload-item" onClick={() => this.startFileLook(item,noPreview)}>
<p>{item.name}</p>
{
item.statusCode == "progress" ?
<Progress style={{ width: "89%", float: "left", marginTop: 3 }} percent={item.percent} />
: item.upLoadTime ?
<div className="upload-time-homework-daying">
{func.dateFormat(item.upLoadTime)}
</div> : ""
}
{
item.statusCode == "progress" ?
<div style={{ clear: "both" }}></div> : ""
}
{
item.statusCode == "success" || item.statusCode == "progress" ?
<div>
{
item.statusCode == "success" ?
<span style={{ fontSize: 24, color: "#76C482" }}>{intl.get('uploadSuccess')||'上传成功'}</span> : ""
}
<span style={{
fontSize: 24,
color: "#666",
marginLeft: item.statusCode == "success"?20:0
}}>{func.sizeFormat(item.size)}</span>
</div> :
item.statusCode == "fail" ?
<div>
<span style={{ fontSize: 24, color: "#ee6157" }}>{intl.get('homework8')||'上传失败'}</span>
</div> : ""
}
{
item.statusCode == "progress" ?
<div className="upload-item-progressText">
{intl.get('homework9')||'上传中'}
</div> : ""
}
<div className="upload-thumbnail">
{
item.statusCode == "progress" ?
<Icon type="file" style={{ fontSize: 80 }} />
: this.getItemType(item.name) == "image" ?
<img src={item.imgUrl ? item.imgUrl : thumbnail} alt="" />
: this.getItemType(item.name) == "video" || this.getItemType(item.name) == "audio" ?
<img src={mediaIcon} alt={""} /> :
<Icon type="file" style={{ fontSize: 80 }} />
}
</div>
</div>
);
}
}
}
}
export default UploadItem;
\ No newline at end of file
src/common/uploadTools/uploadItem/uploaditem.css deleted 100644 → 0
.upload-item {
width: 100%;
height: 107px;
font-size: 28px;
color: #4a4a4a;
padding-left: 124px;
padding-right: 50px;
position: relative;
}
.upload-item .upload-time-homework-daying {
font-size: 24px;
color: #999999;
margin-top: 10px;
}
.upload-item p {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.upload-item .upload-thumbnail {
width: 100px;
height: 100px;
position: absolute;
left: 0;
top: 0;
text-align: center;
line-height: 80px;
}
.upload-item .upload-thumbnail img {
width: 100px;
height: 100px;
}
.upload-item .file-look {
width: 50px;
height: 80px;
position: absolute;
right: 0;
top: 0;
text-align: center;
line-height: 80px;
font-size: 22px;
}
.upload-item .file-look a {
color: #9b9b9b;
}
.upload-item .file-look a:hover {
color: #9b9b9b;
text-decoration: none;
}
.file-preview {
width: 100%!important;
}
.file-preview .am-modal-content {
padding: 0!important;
}
.file-preview .am-modal-body {
width: 100%;
text-align: center!important;
padding: 0!important;
}
src/common/uploadTools/uploadItem/uploaditem.less deleted 100644 → 0
.upload-item {
width: 100%;
height: 107px;
font-size: 28px;
color: #4a4a4a;
padding-left: 124px;
padding-right: 50px;
position: relative;
.upload-time-homework-daying{
font-size: 24px;
color: #999999;
margin-top: 10px;
}
p {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-right: 10%;
}
.upload-item-progressText{
position: absolute;
top: 0;
right: 0;
height: 107px;
line-height: 105px;
font-size: 24px;
color: #76c482;
}
.upload-thumbnail {
width: 100px;
height: 100px;
position: absolute;
left: 0;
top: 0;
text-align: center;
line-height: 80px;
img {
width: 100px;
height: 100px;
}
}
.file-look {
width: 50px;
height: 80px;
position: absolute;
right: 0;
top: 0;
text-align: center;
line-height: 80px;
font-size: 22px;
a{
color: #9b9b9b;
}
a:hover{
color: #9b9b9b;
text-decoration: none;
}
}
}
.upload-result-item{
width: 100%;
height: 100px;
line-height: 98px;
font-size: 28px;
color: #666;
border-bottom:1px solid #ccc;
span{
font-size: 28px;
color: #999;
}
}
.file-preview{
width: 100%!important;
.am-modal-content{
padding: 0!important;
}
.am-modal-body{
width: 100%;
text-align: center!important;
padding: 0!important;
}
}
src/common/uploadTools/uploadTllo.less deleted 100644 → 0
.publish-forum-upload{
.upload-btn {
width: 100%;
height: 100px;
text-align: left;
margin-top: 20px;
padding-bottom: 160px;
padding-left: 20px;
span {
font-size: 28px;
color: #4a4a4a;
}
}
.upload-list {
width: 100%;
padding: 30px 20px;
h5 {
font-size: 24px;
color: #4a4a4a;
}
.publish-list-list{
>div{
>div{
// margin-top: 10px;
// padding-top: 10px;
// padding-bottom: 10px;
.am-list-item{
padding-left: 20px;
padding-top: 10px;
padding-bottom: 10px;
}
}
}
}
.upload-item-list{
.am-list-line{
padding-top: 0px;
padding-bottom: 0px;
}
}
.upload-item-result-list{
height: 100px;
padding-left:0;
.am-list-line{
padding-top: 10px;
padding-bottom: 0px;
padding-right: 0;
}
}
}
.forum-menu {
width : 100%;
// height : 32px;
// line-height : 90px;
padding-left : 22px;
padding-right: 30px;
padding-top: 14px;
.menu-title {
font-size: 20px;
color : #9B9B9B;
}
.menu-delete {
float : right;
font-size: 28px;
color : #666;
}
}
}
.forum-upload-option {
.am-list-content {
text-align: center !important;
a {
width: 100%;
height: 51px;
display: block;
color: #000;
}
}
}
\ No newline at end of file
src/components/Mailbox/action.js
import excute from '../../util/fetchUtil';
import API from '../../util/urlconfig';
import { Toast } from "antd-mobile";
//获取投稿类型list
export function getContributeListApi(params, callback) {
const url = `${API.getContributeListApi}?id=${params.id}`;
return (dispatch) => {
return excute.get(
url,
(response) => {
if (callback) {
callback(response.data);
}
}
);
};
}
//提交投稿
export function commitContributeApi(params, callback) {
//纪检信箱
export function systemMailboxApi(params, callback) {
return (dispatch) => {
return excute.post(
API.commitContributeApi,
API.systemMailboxApi,
params,
(response) => {
Toast.info('提交成功')
if (callback) {
callback(response.data);
}
......@@ -29,14 +16,14 @@ export function commitContributeApi(params, callback) {
);
};
}
//我的投稿列表
export function getContributeMyListApi(params, callback) {
const url = `${API.getContributeMyListApi}`;
//党委书记信箱
export function dwsystemMailboxApi(params, callback) {
return (dispatch) => {
return excute.post(
url,
{},
API.dwsystemMailboxApi,
params,
(response) => {
Toast.info('提交成功')
if (callback) {
callback(response.data);
}
......
src/components/Mailbox/index.jsx
......@@ -2,15 +2,14 @@ import React, { Component } from "react";
import "./style.less";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { getContributeListApi } from "./action";
import { Input, Upload, Icon, Modal } from "antd";
import UploaderTools from "./../../common/uploadTools/UploadTool";
import { systemMailboxApi, dwsystemMailboxApi } from "./action";
import { Input, Radio } from "antd";
import PostUploadFile from "../../common/uploadOSS/uploadOSS";
const { TextArea } = Input;
class ContributeDetail extends Component {
constructor(props) {
super(props);
this.state = {
ossParam: {},
activeId: 0,
authValue: "",
delValue: "",
......@@ -18,7 +17,9 @@ class ContributeDetail extends Component {
contentValue: "",
previewVisible: false,
previewImage: "",
remark: "",
fileList: [],
anonymousFlag: "",
mailList: [
{ name: "意见建议", id: 1 },
{ name: "线索提供", id: 2 },
......@@ -30,8 +31,16 @@ class ContributeDetail extends Component {
{ name: "寻求帮助", id: 3 },
],
};
document.title = "我要投稿";
document.title =
location.hash.indexOf("committeeMailbox") != -1
? "党委书记信箱"
: "纪检信箱";
}
getUploadImg = (files) => {
this.setState({
fileList: files,
});
};
componentDidMount() {}
handleClick = (item, index) => {
const { activeId } = this.state;
......@@ -39,24 +48,40 @@ class ContributeDetail extends Component {
if (activeId != index) {
_this.setState({
activeId: index,
targetFrom: item.name,
});
}
};
handleTo = () => {
console.log(this.state.titleValue, "点击情况~~~~~~~~~");
// let { typeOne, typeTwo, typeThree } = this.props.location.query;
// let params = {
// id: data.id,
// };
// this.props.getContributeListApi(params, (response) => {
// console.log(response);
// });
let imgs = [];
let videos = [];
this.state.fileList.map((item) => {
if (item.type == "video/mp4") {
videos.push(item.fileUrl);
} else {
imgs.push(item.fileUrl);
}
});
let params = {
fileName: this.state.titleValue,
contactName: "联系人名称",
contactNumber: "联系人手机号/邮箱",
content: this.state.contentValue,
ossPicUrl: JSON.stringify(imgs),
ossVideoUrl: JSON.stringify(videos),
remark: this.state.remark,
targetFrom: this.state.targetFrom ? this.state.targetFrom : "意见建议",
anonymousFlag: this.state.anonymousFlag, //是否匿名：1是，0否
};
getFileList = (list) => {
this.setState({
fileList: list,
if (location.hash.indexOf("committeeMailbox") != -1) {
this.props.systemMailboxApi(params, (response) => {
console.log(response);
});
} else {
this.props.dwsystemMailboxApi(params, (response) => {
console.log(response);
});
console.log(this.state.fileList, "2222222222222");
}
};
render() {
const { mailList, mailListCommit, activeId } = this.state;
......@@ -126,9 +151,9 @@ class ContributeDetail extends Component {
<div className="contribute-detail-box">
<div className="top-tit">期望结果</div>
<TextArea
value={this.state.contentValue}
value={this.state.remark}
onChange={(event) =>
this.setState({ contentValue: event.target.value })
this.setState({ remark: event.target.value })
}
placeholder="请输入期望结果"
rows={4}
......@@ -139,13 +164,37 @@ class ContributeDetail extends Component {
)}
<div className="contribute-detail-box">
<div className="top-tit">上传附件</div>
<UploaderTools
getFileList={this.getFileList}
fileList={this.state.fileList}
noPreview={true}
isResult={false}
<PostUploadFile
acceptFileType="image/*,video/*"
maxSize={{ image: 10 }}
maxlength={9}
tooMoreTip={"最多上传9张图片。"}
deliveryFiles={this.getUploadImg}
ref={(ref) => (this.upLoadComponent = ref)}
/>
</div>
<div
className="contribute-detail-box"
style={{
display: "flex",
justifyContent: "space-between",
alignItems: "center",
}}
>
<div className="top-tit">
是否匿名 <span className="red-star">*</span>
</div>
<Radio.Group
size="large"
value={this.state.anonymousFlag}
onChange={(event) =>
this.setState({ anonymousFlag: event.target.value })
}
>
<Radio value={1}>是</Radio>
<Radio value={0}>否</Radio>
</Radio.Group>
</div>
<div className="contribute-detail-btn">
<div className="sumbit-btn" onClick={this.handleTo}>
提交
......@@ -160,7 +209,8 @@ const mapStateToProps = (state) => {
};
const mapDispatchToProps = (dispatch) => {
return {
getContributeListApi: bindActionCreators(getContributeListApi, dispatch),
systemMailboxApi: bindActionCreators(systemMailboxApi, dispatch),
dwsystemMailboxApi: bindActionCreators(dwsystemMailboxApi, dispatch),
};
};
export default connect(mapStateToProps, mapDispatchToProps)(ContributeDetail);
src/components/Mailbox/style.css
......@@ -132,17 +132,36 @@
font-size: 30px !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-list-picture-card-container {
width: 200px !important;
height: 200px !important;
width: 32% !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-list-picture-card .ant-upload-list-item {
width: 200px !important;
width: 100% !important;
height: 200px !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-select-picture-card {
width: 200px !important;
width: 32% !important;
height: 200px !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-select-picture-card .ant-upload {
display: flex;
align-items: center;
justify-content: center;
}
.contribute-detail-out .contribute-detail-box .ant-radio-wrapper .ant-radio-inner {
width: 30px !important;
height: 30px !important;
}
.contribute-detail-out .contribute-detail-box .ant-radio-wrapper .ant-radio-inner::after {
width: 30px !important;
height: 30px !important;
top: 0 !important;
left: 0 !important;
border-radius: 50%;
}
.contribute-detail-out .contribute-detail-box .ant-radio-wrapper span {
color: #000;
font-size: 30px !important;
}
.contribute-detail-out .contribute-detail-box .anticon {
font-size: 40px;
}
......
src/components/Mailbox/style.less
......@@ -131,16 +131,37 @@
font-size: 30px !important;
}
.ant-upload-list-picture-card-container {
width: 200px !important;
height: 200px !important;
width: 32% !important;
}
.ant-upload-list-picture-card .ant-upload-list-item {
width: 200px !important;
width: 100% !important;
height: 200px !important;
}
.ant-upload-select-picture-card {
width: 200px !important;
width: 32% !important;
height: 200px !important;
.ant-upload {
display: flex;
align-items: center;
justify-content: center;
}
}
.ant-radio-wrapper{
.ant-radio-inner{
width: 30px !important;
height: 30px !important;
}
.ant-radio-inner::after{
width: 30px !important;
height: 30px !important;
top: 0 !important;
left: 0 !important;
border-radius: 50%;
}
span{
color: #000;
font-size: 30px !important;
}
}
.anticon {
font-size: 40px;
......
src/components/integral/SelectPointTypeLayout.jsx deleted 100644 → 0
import React,{ Component } from 'react';
import { Icon } from 'antd-mobile';
class SelectPointTypeLayout extends Component{
constructor(props){
super(props)
let pointTypeList = this.props.data;
console.log("pointTypeList", pointTypeList);
this.state={
pointTypeList:pointTypeList,
}
}
componentDidMount(){
// nothing to do currently.
}
render(){
const { getName = 0 } = this.props;
const { pointTypeList } = this.state;
var typeList = pointTypeList.map((item, index)=>{
return <div key={item.type}>
<div style={{display: 'flex', alignItems: 'center', justifyContent: 'center',
marginLeft: '0.3rem', marginRight: '0.3rem', height: '0.48rem'
}} onClick={()=>{this.props.onClick(index)}}>
<div style={{fontSize: '0.24rem', lineHeight: '0.32rem', color: '#666666'}}>
{getName ? item.name : item.type}
</div>
{
item.hasSelected ?
<Icon type="check" style={{fontSize: 20, color: 'ef901c', marginLeft: '0.16rem', width: '0.4rem'}}/> :
<div style={{marginLeft: '0.16rem', width: '0.4rem'}}/>
}
</div>
{
index < pointTypeList.length-1 ?
<div style={{width: '100%', height: '0.01rem', backgroundColor: '#e3e3e3'}}/> : ""
}
</div>
});
return <div style={{zIndex: '999', position: 'absolute', top: '0.96rem', left: '24%',
backgroundColor: '#ffffff', border: '0.02rem solid #e6e6e6'
}}>
{typeList}
</div>
}
}
export default SelectPointTypeLayout;
\ No newline at end of file
src/components/integral/SelectType.jsx deleted 100644 → 0
import React, { Component } from 'react';
import { Icon } from 'antd-mobile';
import './less/SelectType.less';
import Iconfont from '../../common/iconfontcomNew/index'
class SelectType extends Component {
constructor(props) {
super(props)
let pointTypeList = this.props.data;
console.log("pointTypeList", pointTypeList);
this.state = {
pointTypeList: pointTypeList,
}
}
componentDidMount() {
}
render() {
const { getName = 0 } = this.props;
const { pointTypeList } = this.state;
let choseItem = {};
pointTypeList.map(item => {
console.log(item)
if (item.hasSelected == true) {
choseItem = item
}
})
console.log(getName, '0000000000000000')
var typeList = pointTypeList.map((item, index) => {
return (
<div key={item.type} className="typelist">
<div onClick={() => { this.props.onClick(index) }}>
<div className={`itemStyle `}>
<span className={`itemName ${item.hasSelected ? 'choseStyle' : ''}`}>{item.name} </span>
</div>
</div>
</div>)
});
let bgHeight = document.body.clientHeight-400;
return <div className="integral_selectType">
<div className="visible">
<div className="visibleChose">
<div className="visibleChoseItem" onClick={this.props.closeVisible}>
{getName ? choseItem.name : choseItem.type}
<Iconfont type='icon-solidarrow-up' className='playLeft' />
</div>
</div>
<div className="listFlex">
{typeList}
</div>
</div>
<div className="integral-select-type-bg" style={{height:bgHeight}} onClick={this.props.closeVisible}></div>
</div >
}
}
export default SelectType;
\ No newline at end of file
src/components/integral/integrallist/integralcommon.less deleted 100644 → 0
.integral-item{
width: 100%;
height: 116px;
padding-left: 129px;
padding-right: 126px;
position: relative;
border-bottom: 2px solid #e9e9e9;
.time-get{
font-size: 24px;
color: #9b9b9b;
width: 100px;
height: 100%;
position: absolute;
left: 29px;
top: 15;
}
.integral-data{
width: 100%;
height: 116px;
padding-top: 19px;
p{
margin: 0;
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
}
.integral-type{
font-size: 30px;
color: #505050;
}
.integral-descri{
font-size: 24px;
color: #9b9b9b;
}
}
.integral-get{
font-size: 30px;
color: #ff8564;
line-height: 116px;
width: 100px;
height: 116px;
position: absolute;
text-align: right;
right: 26px;
top: 0;
}
}
\ No newline at end of file
src/components/integral/integrallist/integralitem.jsx deleted 100644 → 0
import React,{Component} from 'react';
import './integralcommon.less';
class IntegralItem extends Component{
render(){
const {data} = this.props;
let DataTime = Number(data.time);
let dateString = '';
let timeString = '';
let hour = new Date(DataTime).getHours(), min = new Date(DataTime).getMinutes(),month = new Date(DataTime).getMonth()+1,day = new Date(DataTime).getDate();
let today = new Date();
if(DataTime==today){
timeString = hour+':'+min;
}else{
dateString = `${month}-${day}`;
timeString = `${hour}:${min>=10?min:'0'+min}`;
}
let sign = data.flag==1?'+':'';
return (
<div className="integral-item">
<div className="time-get">
<div style={{paddingTop:20}}>{dateString}</div>
<div>{timeString}</div>
</div>
<div className="integral-data">
<p className="integral-type">{data.learnSource}</p>
<p className="integral-descri">{data.learnName}</p>
</div>
<div className="integral-get" style={{color:data.point>0?'#ff8564':'#cfcfcf'}}>
{sign}{data.point}
</div>
</div>
);
}
}
export default IntegralItem;
\ No newline at end of file
src/components/integral/integrallist/integrallist.jsx deleted 100644 → 0
import React, {Component} from 'react';
import {ListView} from 'antd-mobile';
import {StickyContainer, Sticky} from 'react-sticky';
import './integrallist.less';
var data = [
{
img: 'https://zos.alipayobjects.com/rmsportal/dKbkpPXKfvZzWCM.png',
title: 'Meet hotel',
des: '不是所有的兼职汪都需要风吹日晒',
},
{
img: 'https://zos.alipayobjects.com/rmsportal/XmwCzSeJiqpkuMB.png',
title: 'McDonald\'s invites you',
des: '不是所有的兼职汪都需要风吹日晒',
},
{
img: 'https://zos.alipayobjects.com/rmsportal/hfVtzEhPzTUewPm.png',
title: 'Eat the week',
des: '不是所有的兼职汪都需要风吹日晒',
},
{
img: 'https://zos.alipayobjects.com/rmsportal/hfVtzEhPzTUewPm.png',
title: 'Eat the week',
des: '不是所有的兼职汪都需要风吹日晒',
},
{
img: 'https://zos.alipayobjects.com/rmsportal/hfVtzEhPzTUewPm.png',
title: 'Eat the week',
des: '不是所有的兼职汪都需要风吹日晒',
},
];
const NUM_SECTIONS = 5;
const NUM_ROWS_PER_SECTION = 5;
let pageIndex = 0;
const dataBlobs = {};
let sectionIDs = [];
let rowIDs = [];
function genData(pIndex = 0) {
for (let i = 0; i < NUM_SECTIONS; i++) {
const ii = (pIndex * NUM_SECTIONS) + i;
const sectionName = `Section ${ii}`;
sectionIDs.push(sectionName);
dataBlobs[sectionName] = sectionName;
rowIDs[ii] = [];
for (let jj = 0; jj < NUM_ROWS_PER_SECTION; jj++) {
const rowName = `S${ii}, R${jj}`;
rowIDs[ii].push(rowName);
dataBlobs[rowName] = rowName;
}
}
sectionIDs = [...sectionIDs];
rowIDs = [...rowIDs];
}
class Demo extends Component {
constructor(props) {
super(props);
const getSectionData = (dataBlob, sectionID) => dataBlob[sectionID];
const getRowData = (dataBlob, sectionID, rowID) => dataBlob[rowID];
const dataSource = new ListView.DataSource({
getRowData,
getSectionHeaderData: getSectionData,
rowHasChanged: (row1, row2) => row1 !== row2,
sectionHeaderHasChanged: (s1, s2) => s1 !== s2,
});
this.state = {
dataSource,
isLoading: true,
};
this.onEndReached = this.onEndReached.bind(this);
}
componentDidMount() {
// you can scroll to the specified position
// setTimeout(() => this.lv.scrollTo(0, 120), 800);
// simulate initial Ajax
var _this = this;
setTimeout(() => {
genData();
console.log(dataBlobs,rowIDs,sectionIDs);
_this.setState({
dataSource: this.state.dataSource.cloneWithRowsAndSections(dataBlobs, sectionIDs, rowIDs),
isLoading: false,
});
}, 600);
}
// If you use redux, the data maybe at props, you need use `componentWillReceiveProps`
// componentWillReceiveProps(nextProps) {
// if (nextProps.dataSource !== this.props.dataSource) {
// this.setState({
// dataSource: this.state.dataSource.cloneWithRowsAndSections(nextProps.dataSource),
// });
// }
// }
onEndReached(event) {
// load new data
// hasMore: from backend data, indicates whether it is the last page, here is false
if (this.state.isLoading && !this.state.hasMore) {
return;
}
console.log('reach end', event);
data = data.concat(data);
this.setState({isLoading: true});
var _this = this;
setTimeout(() => {
genData(++pageIndex);
_this.setState({
dataSource: this.state.dataSource.cloneWithRowsAndSections(dataBlobs, sectionIDs, rowIDs),
isLoading: false,
});
}, 1000);
}
render() {
const {HeaderSection,initTop,Item} = this.props;
let index = data.length - 1;
const row = (rowData, sectionID, rowID) => {
if (index < 0) {
index = data.length - 1;
}
const obj = data[index--];
return (
<Item key={rowID} />
);
};
return (
<ListView
dataSource={this.state.dataSource}
useBodyScroll
renderSectionHeader={sectionData => (
<StickyContainer>
<Sticky>
{({
distanceFromTop
}) => {
return (
<div className="sticky-section" style={{position:distanceFromTop<=initTop?'fixed':'static',top:initTop}}>
<HeaderSection content={sectionData} />
</div>
);
}
}
</Sticky>
</StickyContainer>
)}
renderFooter={() => (<div style={{padding: 30, textAlign: 'center'}}>
{this.state.isLoading ? 'Loading...' : 'Loaded'}
</div>)}
renderRow={row}
pageSize={5}
scrollEventThrottle={200}
onEndReached={this.onEndReached}
onEndReachedThreshold={10}
/>
);
}
}
export default Demo;
\ No newline at end of file
src/components/integral/integrallist/integrallist.less deleted 100644 → 0
.sticky-list .sticky-container .am-list-item {
padding-left: 0;
}
.sticky-list .sticky-container .am-list-line {
padding-right: 0;
}
.sticky-list .sticky-container .am-list-line .am-list-content {
padding-top: 0;
padding-bottom: 0;
}
.sticky-list .sticky-container .sticky {
padding: 7px 15px;
transform: none;
}
.sticky-section {
z-index: 101;
width: 100%;
left: 0;
}
.am-list-content {
padding: 0 !important;
margin: 0 !important;
}
.my-integral {
.am-list-item {
border: none !important;
padding: 0 !important;
margin: 0 !important;
min-height: 0 !important;
.am-list-line {
min-height: 0 !important;
padding: 0 !important;
margin: 0 !important;
}
}
}
\ No newline at end of file
src/components/integral/integrallist/integralsection.jsx deleted 100644 → 0
import React, { Component } from 'react';
class IntegralSection extends Component {
render() {
const { content } = this.props;
return (
<div style={{
width: '100%',
// height:60,
// paddingTop: 20,
// paddingBottom: 20,
// paddingLeft: 20,
// paddingRight: 20,
fontSize: 24,
color: '#000',
background: '#fff',
}}>
<div
style={{
width: '95%',
margin: '0 auto',
height: '76px',
lineHeight: '76px',
borderBottom: '1px solid #f5f5f5'
}}>
{content}
</div>
</div>
);
}
}
export default IntegralSection;
\ No newline at end of file
src/components/integral/less/SelectType.less deleted 100644 → 0
.integral_selectType {
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.45);
z-index: 999;
position: fixed;
top: 0;
.visible {
height: 400px;
border-radius: 0 0 20px 20px;
background-color: #fff;
z-index: 999;
.visibleChose {
font-size: 28px !important;
height: 100px;
width: 90%;
margin: 0 auto;
position: relative;
.visibleChoseItem {
position: absolute;
right: 0;
bottom: 20px;
}
.playLeft {
margin-left: 10px;
font-size: 40px !important;
position: relative;
right: 0px;
bottom: 0px;
}
}
.listFlex {
display: flex;
flex-wrap: wrap;
width: 90%;
margin: 0 auto;
.typelist {
width: 25%;
height: 80px;
text-align: center;
font-size: 32px;
margin-bottom: 20px;
.itemStyle {
height: 100px;
line-height: 100px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.choseStyle {
background-color: rgba(66, 133, 244, 0.05);
border: 1px solid #4285F4 !important;
color: #4285F4;
}
.itemName {
padding: 15px 40px;
border: 1px solid #EFEFF4;
border-radius: 10px;
}
}
}
}
.integral-select-type-bg{
position: absolute;
left: 0;
bottom: 0;
width: 100%;
}
}
\ No newline at end of file
src/components/integral/less/myintegral.less deleted 100644 → 0
.my-integral {
width: 100%;
height: 100%;
overflow-y: scroll;
background-color: #f5f5f5;
position: relative;
top: 0;
left: 0;
.am-list-body::before {
height: 0 !important;
}
.am-list-content {
font-weight: bold;
}
.integral-item {
border-bottom: 0.01rem solid #f4f4f4 !important;
}
.integralTop {
width: 100%;
height: 240px;
background-color: #f5f5f5;
position: absolute;
top: 0;
left: 0;
z-index: 101;
padding: 0 30px;
.integralBar {
width: 100%;
height: 200px;
margin: 0 auto;
margin-top: 40px;
background-color: #fff;
background-image: url('../image/background.png');
background-size: 100% 100%;
.integralChild {
flex: 1;
position: relative;
.jifen {
height: 80px;
font-size: 28px;
color: #666666;
position: relative;
}
.points {
height: 120px;
line-height: 120px;
font-size: 60px;
color: #333333;
font-weight: bold;
}
.integralTypes {
font-size: 28px;
display: inline;
padding: 10px 60px 10px 30px;
border: 2px solid #C8CEDA;
border-radius: 50px;
position: absolute;
right: 20px;
bottom: 30px;
.playLeft {
margin-left: 5px;
font-size: 40px !important;
position: absolute;
// right: -2px;
}
}
}
}
}
.integral-sum {
// width: 100%;
height: 96px;
line-height: 96px;
background-color: #fff;
text-align: center;
font-size: 40px;
color: #ff8564;
// border-bottom: 2px solid #e4e4e4;
left: 0;
z-index: 101;
}
.integral-content {
width: 100%;
margin-top: 260px;
padding: 0 30px;
}
.am-list-body {
width: 100%;
background-color: #f5f5f5 !important;
border: none !important;
.am-list-item {
width: 100%;
margin: 0 auto !important;
background-color: #f5f5f5 !important;
}
}
.am-list-view-scrollview {
background-color: #f5f5f5 !important;
}
}
.my-integral .list-view-section-body {
width: 100%;
margin: 0 auto;
background-color: #fff !important;
.integral-item {
background: #fff !important;
width: 95%;
margin: 0 auto;
}
.integral-item .time-get {
left: 0;
}
}
\ No newline at end of file
src/components/menume/menume.jsx
......@@ -19,7 +19,6 @@ import {
// import FavoriteAndSign from "./favoriteAndSign/fas";
import IconFont from "../../common/iconfontcomponent/index";
import intl from "react-intl-universal";
import IconfontD from "../../common/iconfontd";
import MyCollect from "./image/MyCollect.png";
import BrowsingHistory from "./image/BrowsingHistory.png";
import jinbi from "./image/jinbi.png";
......@@ -38,7 +37,7 @@ const mapList = {
},
pl: {
text: "我的评论",
url: "/integral/myintegral",
url: "/myComment",
},
tg: {
text: "我的投稿",
......@@ -403,7 +402,7 @@ class Menume extends React.Component {
className="study-jf"
onClick={() =>
hashHistory.push(
func.routerBefore() + "/integral/myintegral"
func.routerBefore() + "/myintegral"
)
}
>
......
src/components/myComment/action.js 0 → 100644
import excute from '../../util/fetchUtil';
import API from '../../util/urlconfig';
import { Toast } from "antd-mobile";
//纪检信箱
export function myCommentListApi(params, callback) {
return (dispatch) => {
return excute.post(
API.myCommentListApi,
params,
(response) => {
Toast.info('提交成功')
if (callback) {
callback(response.data);
}
}
);
};
}
\ No newline at end of file
src/components/myComment/index.jsx 0 → 100644
import React, { Component } from "react";
import "./style.less";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { myCommentListApi } from "./action";
class myComment extends Component {
constructor(props) {
super(props);
this.state = {
};
document.title = "我的评论";
}
componentDidMount() {
// this.props.myCommentListApi();
}
render() {
return (
<div className="comment-out">
</div>
);
}
}
const mapStateToProps = (state) => {
return {};
};
const mapDispatchToProps = (dispatch) => {
return {
myCommentListApi: bindActionCreators(myCommentListApi, dispatch),
};
};
export default connect(mapStateToProps, mapDispatchToProps)(myComment);
src/components/myIntegral/action.js 0 → 100644
import excute from '../../util/fetchUtil';
import API from '../../util/urlconfig';
import { Toast } from "antd-mobile";
//纪检信箱
export function myCommentListApi(params, callback) {
return (dispatch) => {
return excute.post(
API.myCommentListApi,
params,
(response) => {
Toast.info('提交成功')
if (callback) {
callback(response.data);
}
}
);
};
}
\ No newline at end of file
src/components/myIntegral/index.jsx 0 → 100644
import React, { Component } from "react";
import "./style.less";
import { connect } from "react-redux";
import { hashHistory } from "react-router";
import func from "../../util/commonFunc";
import { bindActionCreators } from "redux";
import { myCommentListApi } from "./action";
import giftImg from "./image/gift.png";
import shopImg from "./image/shop-icon.png";
import jinbi from "./image/jinbi.png";
class myComment extends Component {
constructor(props) {
super(props);
this.state = {
score: "320",
scoreNow: "6",
showBtn: false,
contList: [
{
title: "登录",
titleVal: "1分/每日首次登录",
statu: true,
},
{
title: "阅读文章（0/5）",
titleVal: "1分/每有效阅读文章一篇（阅读时长超过20秒）",
url: "/",
statu: false,
},
{
title: "我要投稿",
titleVal: "5分/每投稿一篇有效内容（审核通过）",
url: "/mycontribute",
statu: false,
},
{
title: "发表评论",
titleVal: "3分/每发表一个有效评论（审核通过）",
url: "/",
statu: false,
},
{
title: "参加活动",
titleVal: "3分/报名并成功打卡参与活动",
url: "/menutrain",
statu: false,
},
{
title: "培训测试",
titleVal: "根据答题分数获得相应积分",
url: "/exam/MyExam",
statu: false,
},
],
};
document.title = "我的积分";
}
componentDidMount() {
// this.props.myCommentListApi();
}
handleTo = (url) => {
hashHistory.push({
pathname: func.routerBefore() + url,
});
};
render() {
let { score, scoreNow, showBtn, contList } = this.state;
return (
<div className="integral-out">
<div className="integral-head">
<div className="head-item">
<div className="item-score">{score}</div>
<div className="item-more">
<img src={shopImg} alt="" style={{ width: "48px" }} />
<p>
积分商城 <span style={{ fontSize: "24px" }}>（建设中）</span>
</p>
</div>
</div>
<div className="head-img">
<img src={giftImg} alt="" style={{ width: "100%" }} />
</div>
</div>
<div className="integral-box">
<div className="box-head">
<div style={{ display: "flex", alignItems: "center" }}>
<img
src={jinbi}
alt=""
style={{ width: "42px", marginRight: "15px" }}
/>
<div
style={{ color: "#333", fontWeight: "600", fontSize: "30px" }}
>
积分规则
</div>
</div>
<div style={{ color: "#9E9E9E", fontSize: "32px" }}>
今日已累计 <span style={{ color: "#E6624A" }}>{scoreNow}</span>{" "}
积分
</div>
</div>
{contList.map((item) => {
return (
<div className="box-content">
<div className="content-items">
<div className="title">{item.title}</div>
<div className="titValue">{item.titleVal}</div>
</div>
{item.statu ? (
<div className="unactive-btn">已完成</div>
) : (
<div
className="active-btn"
onClick={() => this.handleTo(item.url)}
>
去完成
</div>
)}
</div>
);
})}
</div>
</div>
);
}
}
const mapStateToProps = (state) => {
return {};
};
const mapDispatchToProps = (dispatch) => {
return {
myCommentListApi: bindActionCreators(myCommentListApi, dispatch),
};
};
export default connect(mapStateToProps, mapDispatchToProps)(myComment);
src/components/myIntegral/style.css 0 → 100644
.integral-out {
width: 100%;
height: 100%;
background: linear-gradient(180deg, #d23a29 10%, #fff 50%, #f5f5f5 100%);
}
.integral-out .integral-head {
width: 90%;
margin: 0 auto;
display: flex;
justify-content: space-between;
padding-top: 10%;
}
.integral-out .integral-head .head-item {
padding-top: 20px;
}
.integral-out .integral-head .head-item .item-score {
padding-left: 15px;
font-family: PingFang SC, PingFang SC-600;
font-weight: 600;
font-size: 120px;
color: #fff;
}
.integral-out .integral-head .head-item .item-more {
display: flex;
align-items: center;
color: #fff;
font-size: 30px;
}
.integral-out .integral-head .head-img {
width: 42%;
}
.integral-out .integral-box {
width: 92%;
margin: 0 auto;
border-radius: 40px;
background-color: #fff;
padding: 30px;
}
.integral-out .integral-box .box-head {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.integral-out .integral-box .box-content {
padding: 10px 15px;
display: flex;
justify-content: space-between;
align-items: center;
}
.integral-out .integral-box .box-content .content-items {
width: 72%;
margin-bottom: 20px;
}
.integral-out .integral-box .box-content .content-items .title {
color: #333333;
font-weight: 500;
font-size: 32px;
}
.integral-out .integral-box .box-content .content-items .titValue {
color: #9e9e9e;
font-size: 24px;
}
.integral-out .integral-box .box-content .active-btn {
width: max-content;
padding: 8px 22px;
border-radius: 30px;
background: linear-gradient(90deg, #d23a29, #eb6c53 100%);
font-size: 36px;
color: #fff;
}
.integral-out .integral-box .box-content .unactive-btn {
width: max-content;
padding: 8px 22px;
border-radius: 30px;
background-color: rgba(158, 158, 158, 0.1);
font-size: 36px;
color: #999999;
}
src/components/myIntegral/style.less 0 → 100644
.integral-out {
width: 100%;
height: 100%;
background: linear-gradient(180deg, #d23a29 10%, #fff 50%,#f5f5f5 100%);
.integral-head {
width: 90%;
margin: 0 auto;
display: flex;
justify-content: space-between;
padding-top: 10%;
.head-item {
padding-top: 20px;
.item-score {
padding-left: 15px;
font-family: PingFang SC, PingFang SC-600;
font-weight: 600;
font-size: 120px;
color: #fff;
}
.item-more {
display: flex;
align-items: center;
color: #fff;
font-size: 30px;
}
}
.head-img {
width: 42%;
}
}
.integral-box {
width: 92%;
margin: 0 auto;
border-radius: 40px;
background-color: #fff;
padding: 30px;
.box-head {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.box-content {
padding: 10px 15px;
display: flex;
justify-content: space-between;
align-items: center;
.content-items {
width: 72%;
margin-bottom: 20px;
.title {
color: #333333;
font-weight: 500;
font-size: 32px;
}
.titValue {
color: #9e9e9e;
font-size: 24px;
}
}
.active-btn {
width: max-content;
padding: 8px 22px;
border-radius: 30px;
background: linear-gradient(90deg, #d23a29, #eb6c53 100%);
font-size: 36px;
color: #fff;
}
.unactive-btn {
width: max-content;
padding: 8px 22px;
border-radius: 30px;
background-color: rgba(158, 158, 158, 0.1);
font-size: 36px;
color: #999999;
}
}
}
}
src/components/myLeaveMessage/index.jsx
......@@ -4,7 +4,7 @@ import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { VoteListApi } from "./action";
import { Input, Radio } from "antd";
import UploaderTools from "./../../common/uploadTools/UploadTool";
import PostUploadFile from "../../common/uploadOSS/uploadOSS";
const { TextArea } = Input;
class MyLeaveMessage extends Component {
constructor(props) {
......@@ -39,11 +39,10 @@ class MyLeaveMessage extends Component {
document.title = "我要留言";
}
componentDidMount() {}
getFileList = (list) => {
getUploadImg = (files) => {
this.setState({
fileList: list,
fileList: files,
});
console.log(this.state.fileList, "2222222222222");
};
handleMessageClick(data, index) {
let _this = this;
......@@ -119,11 +118,13 @@ class MyLeaveMessage extends Component {
<div className="top-tit">
图片<span>(0/9)</span>
</div>
<UploaderTools
getFileList={this.getFileList}
fileList={this.state.fileList}
noPreview={true}
isResult={false}
<PostUploadFile
acceptFileType="image/*,video/*"
maxSize={{ image: 10 }}
maxlength={9}
tooMoreTip={"最多上传9张图片。"}
deliveryFiles={this.getUploadImg}
ref={(ref) => (this.upLoadComponent = ref)}
/>
<div style={{ fontSize: "30px", color: "#9E9E9E" }}>
支持.png.jepg格式，每张最大5MB
......
src/components/mycontribute/contributeDetail.jsx
......@@ -2,9 +2,9 @@ import React, { Component } from "react";
import "./style.less";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { getContributeListApi } from "./action";
import { getContributeListApi, commitContributeApi } from "./action";
import { Input, Modal } from "antd";
import UploaderTools from "./../../common/uploadTools/UploadTool";
import PostUploadFile from "../../common/uploadOSS/uploadOSS";
const { TextArea } = Input;
class ContributeDetail extends Component {
constructor(props) {
......@@ -23,6 +23,12 @@ class ContributeDetail extends Component {
this.showVideoModal = this.showVideoModal.bind(this);
this.closeVideoModal = this.closeVideoModal.bind(this);
}
getUploadImg = (files) => {
this.setState({
fileList: files,
});
console.log(this.state.fileList, "333333333333");
};
showVideoModal() {
this.setState({
videoVisible: true,
......@@ -34,22 +40,26 @@ class ContributeDetail extends Component {
});
}
componentDidMount() {}
getFileList = (list) => {
this.setState({
fileList: list,
handleClick = () => {
let imgs = [];
this.state.fileList.map((item) => {
imgs.push(item.fileUrl);
});
console.log(this.state.fileList,'2222222222222')
};
handleClick = () => {
console.log(this.state.titleValue, "点击情况~~~~~~~~~");
// let { typeOne, typeTwo, typeThree } = this.props.location.query;
// let params = {
// id: data.id,
// };
// this.props.getContributeListApi(params, (response) => {
// console.log(response);
// });
let { typeOne, typeTwo, typeThree } = this.props.location.query;
let params = {
fileName: this.state.titleValue,
typeOne: typeOne,
typeTwo: typeTwo,
typeThree: typeThree,
author: this.state.authValue,
content: this.state.contentValue,
ossUrl: JSON.stringify(imgs),
deptName: this.state.delValue,
};
this.props.commitContributeApi(params, (response) => {
console.log(response);
});
};
render() {
const { fileList } = this.state;
......@@ -83,11 +93,13 @@ class ContributeDetail extends Component {
</div>
<div className="contribute-detail-box">
<div className="top-tit">图片或视频上传</div>
<UploaderTools
getFileList={this.getFileList}
fileList={this.state.fileList}
noPreview={true}
isResult={false}
<PostUploadFile
acceptFileType="image/*,video/*"
maxSize={{ image: 10 }}
maxlength={9}
tooMoreTip={"最多上传9张图片。"}
deliveryFiles={this.getUploadImg}
ref={(ref) => (this.upLoadComponent = ref)}
/>
</div>
<div className="contribute-detail-box">
......@@ -140,7 +152,7 @@ class ContributeDetail extends Component {
<div className="preview-mid">
<div className="preview-imgs">
{fileList.map((item, index) => {
return <img src={item.url} alt="" key={index} />;
return <img src={item.fileUrl} alt="" key={index} />;
})}
</div>
<div className="perview-con">{this.state.contentValue}</div>
......@@ -157,6 +169,7 @@ const mapStateToProps = (state) => {
const mapDispatchToProps = (dispatch) => {
return {
getContributeListApi: bindActionCreators(getContributeListApi, dispatch),
commitContributeApi: bindActionCreators(commitContributeApi, dispatch),
};
};
export default connect(mapStateToProps, mapDispatchToProps)(ContributeDetail);
src/components/mycontribute/index.jsx
......@@ -6,7 +6,7 @@ import moment from "moment";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { getContributeListApi } from "./action";
import { Modal } from "antd-mobile";
import { Toast } from "antd-mobile";
class Mycontribute extends Component {
constructor(props) {
super(props);
......@@ -56,7 +56,7 @@ class Mycontribute extends Component {
typeTwo: null,
activeThreeId: null,
typeThree: null,
mapThreeList:[]
mapThreeList: [],
});
}
};
......@@ -93,6 +93,9 @@ class Mycontribute extends Component {
};
handleTo = () => {
let { typeOne, typeTwo, typeThree } = this.state;
if (!typeOne) {
Toast.info("请选择投稿类型");
} else {
hashHistory.push({
pathname: func.routerBefore() + "/contributeDetail",
query: {
......@@ -101,6 +104,7 @@ class Mycontribute extends Component {
typeThree: typeThree,
},
});
}
};
render() {
let {
......
src/components/mycontribute/style.css
......@@ -107,17 +107,21 @@
font-size: 30px !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-list-picture-card-container {
width: 200px !important;
height: 200px !important;
width: 32% !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-list-picture-card .ant-upload-list-item {
width: 200px !important;
width: 100% !important;
height: 200px !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-select-picture-card {
width: 200px !important;
width: 32% !important;
height: 200px !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-select-picture-card .ant-upload {
display: flex;
align-items: center;
justify-content: center;
}
.contribute-detail-out .contribute-detail-box .anticon {
font-size: 40px;
}
......
src/components/mycontribute/style.less
......@@ -106,16 +106,20 @@
font-size: 30px !important;
}
.ant-upload-list-picture-card-container {
width: 200px !important;
height: 200px !important;
width: 32% !important;
}
.ant-upload-list-picture-card .ant-upload-list-item {
width: 200px !important;
width: 100% !important;
height: 200px !important;
}
.ant-upload-select-picture-card {
width: 200px !important;
width: 32% !important;
height: 200px !important;
.ant-upload {
display: flex;
align-items: center;
justify-content: center;
}
}
.anticon {
font-size: 40px;
......
src/main.js
......@@ -97,7 +97,7 @@ const GlobalSearch = LazyLoad(() =>
const Comment = LazyLoad(() => import('./components/comment/comment'));
const MyIntegral = LazyLoad(() => import('./components/integral/myintegral'));
const MyIntegral = LazyLoad(() => import('./components/myIntegral'));
// //我的活动
const Training = LazyLoad(() => import('./components/Training/Training'));
const TrainSearch = LazyLoad(() =>
......@@ -210,6 +210,10 @@ const MediaPreview = LazyLoad(() =>
const Mailbox = LazyLoad(() =>
import('./components/Mailbox')
)
//我的评论
const MyComment = LazyLoad(() =>
import('./components/myComment')
)
// 首页组件库
const IndexComponentPage = LazyLoad(() => import('./components/indexComponent'));
......@@ -359,9 +363,7 @@ class AppRouter extends React.Component {
</Route>
{/*我的积分*/}
<Route path="/*/*/integral">
<Route path="/*/*/myintegral" component={MyIntegral} />
</Route>
{/*全局搜索*/}
<Route path={'/*/*/search'} component={GlobalSearch} />
......@@ -394,6 +396,9 @@ class AppRouter extends React.Component {
{/* 纪检信箱 */}
<Route path="/*/*/mailbox" component={Mailbox} />
<Route path="/*/*/committeeMailbox" component={Mailbox} />
{/* 我的评论 */}
<Route path="/*/*/myComment" component={MyComment} />
{/*empty Committee*/}
<Route path="/*/*/empty" component={Empty} />
......
src/util/urlconfig.js
......@@ -21,10 +21,10 @@ if (
host.indexOf("172.") != -1
) {
//本地环境
baseUrl = "http://192.168.1.107:8090";
// baseUrl = "http://192.168.1.107:8090";
//服务器环境
// baseUrl = "https://10.23.1.180:8090";
// baseUrl = "https://hqjddj.shanghaiairport.com";
baseUrl = "https://hqjddj.shanghaiairport.com";
} else if (
host.indexOf("192.168.1.131") != -1 ||
......@@ -460,5 +460,11 @@ const url = {
commitContributeApi:`${baseUrl}${WEBMANAGE}manage/site/classify/publication/insert`,
//我的投稿
getContributeMyListApi:`${baseUrl}${WEBMANAGE}manage/site/classify/publication/list`,
//纪检信箱
systemMailboxApi:`${baseUrl}${WEBMANAGE}manage/systemMailbox/save/1`,
//党委书记信箱
dwsystemMailboxApi:`${baseUrl}${WEBMANAGE}manage/systemMailbox/save/2`,
//我的评论
myCommentListApi:`${baseUrl}${WEBSTUDENT}api/tpComment/pc/listByMyself`,
};
export default url;
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment