-
-
+ /**
+ * 全部错误和全部正确
+ */
+ const successErrAll = () => {
+ return (
+
{uploadTop()}
- {uploadExcel()}
+ {showUpType ? upFilesExcel() : uploadExcel()}
{uploadFooter()}
+ );
+ };
+
+ /**
+ * 部分正确
+ */
+ const partSuccess = () => {
+ return (
+
+
+ 文件上传成功.共 20 条手机号,其中 10 条可成功导入
+
+
+ 发现以下 10 条不符合要求,将不会被导入
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+ };
+
+ return (
+
+ {visible ? (
+
+
+
+
+
+ {partSuccessTag ? partSuccess() : successErrAll()}
+
+
+
+ ) : null}
);
};
diff --git a/src/components/UseUploadExcel/style.less b/src/components/UseUploadExcel/style.less
index 943b9a09..dc3ff594 100644
--- a/src/components/UseUploadExcel/style.less
+++ b/src/components/UseUploadExcel/style.less
@@ -70,11 +70,29 @@
.upload-input{
opacity: 0;
- width: 300px;
+ width: 100px;
height: 48px;
position: absolute;
z-index: 5;
+ cursor: pointer;
+ left: 32px;
}
+
+.upload-input1{
+ opacity: 0;
+ width: 80px;
+ height: 30px;
+ position: absolute;
+ z-index: 5;
+ cursor: pointer;
+ border: 1px solid red;
+ left: 0;
+}
+
+.import-close{
+ cursor: pointer;
+}
+
.dialog-main-footer{
margin-top: 40px;
}
@@ -95,3 +113,82 @@
margin-top: 10px;
margin-left: 40px;
}
+
+
+.user-file-box {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ border-radius: 4px;
+ padding: 0 10px;
+ margin-bottom: 5px;
+ background: #f0f0f0;
+}
+
+/* .user-file-box-actv {
+ background: #409eff;
+ border: 1px solid #409eff !important;
+ color: #fff;
+} */
+.user-file-box-actv p:first-child {
+ background: #409eff !important;
+ border: 1px solid #409eff !important;
+ color: #fff;
+}
+
+.user-file-box-actv p:last-child {
+ font-weight: bold !important;
+}
+
+
+.file-update-box {
+ position: relative;
+ cursor: pointer;
+}
+.file-update-box span,
+.file-update-box i {
+ color: #409eff;
+ cursor: pointer;
+}
+.user-file-name {
+ margin: 0;
+ padding: 5px 10px;
+}
+.user-upload-btn {
+ position: relative;
+}
+.upload-error {
+ color: #f56c6c;
+ padding-left: 10px;
+}
+.upload-success {
+ color: #67c23a;
+ padding-left: 10px;
+}
+.upload-title-p {
+ font-weight: bold;
+}
+.black-title {
+ font-weight: bold;
+ font-size: 25px;
+}
+.up-files-excel,.upload-excel-01{
+ width: 80%;
+ margin: 0 auto;
+}
+.upload-excel-01{
+ margin-top: 40px;
+ margin-bottom: 40px;
+}
+.file-errmsg1{
+ margin-top: 10px;
+ color: #000000;
+ font-size: 14px;
+ margin-left: 40px;
+}
+.gridpanel1{
+ width: 90%;
+ height: 400px;
+ margin: 0 auto;
+ margin-top: 30px;
+}
diff --git a/src/pages/plan/key/detail/list.js b/src/pages/plan/key/detail/list.js
index e5be0d34..15e89ba7 100644
--- a/src/pages/plan/key/detail/list.js
+++ b/src/pages/plan/key/detail/list.js
@@ -1,7 +1,7 @@
/* key列表 */
-import React from 'react'
-import { Button, Alert } from 'zent'
-import './list.less'
+import React from "react";
+import { Button, Alert } from "zent";
+import "./list.less";
import {
Input,
RadioGroup,
@@ -15,24 +15,24 @@ import {
Icon,
MenuItem,
DropdownContent,
- Menu
-} from 'zent'
-import Ipt from '../../../../components/input/main'
-import Grid from '../../../../components/gird/main.js'
-import TabPage from '../../../../components/tabPage/main.js'
+ Menu,
+} from "zent";
+import Ipt from "../../../../components/input/main";
+import Grid from "../../../../components/gird/main.js";
+import TabPage from "../../../../components/tabPage/main.js";
import {
keyCancel,
keyUsage,
keyBatchUsage,
keyBatchCancel,
handelResponse,
- getkeyDetailList
-} from '../../../../assets/api.js'
-import _ from 'lodash'
-import menu from '../../../../assets/enum.js'
+ getkeyDetailList,
+} from "../../../../assets/api.js";
+import _ from "lodash";
+import menu from "../../../../assets/enum.js";
-import UseUploadExcel from '../../../../components/UseUploadExcel'
-import KeysFind from '@/components/keysFind'
+import UseUploadExcel from "../../../../components/UseUploadExcel";
+import KeysFind from "@/components/keysFind";
//
//
@@ -40,44 +40,44 @@ import KeysFind from '@/components/keysFind'
//
export default class acclist extends React.Component {
constructor(props) {
- super(props)
+ super(props);
this.state = {
dataCount: 0,
page: 1,
limit: 10,
tabList: [
- { title: '全部', index: 0 },
- { title: '可使用', index: 1 },
- { title: '已使用', index: 2 },
- { title: '已完结', index: 3 },
- { title: '已作废', index: 4 }
+ { title: "全部", index: 0 },
+ { title: "可使用", index: 1 },
+ { title: "已使用", index: 2 },
+ { title: "已完结", index: 3 },
+ { title: "已作废", index: 4 },
],
- distdata: [{ title: '士大夫大师傅' }],
+ distdata: [{ title: "士大夫大师傅" }],
filterList: [
{
id: 0,
- label: '状态',
- prop: 'status',
+ label: "状态",
+ prop: "status",
menuList: [
- { id: 999, name: '全部' },
- { id: 0, name: '创建中' },
- { id: 2, name: '审核中' },
- { id: 3, name: '待生效' },
- { id: 4, name: '进行中' },
- { id: 5, name: '暂停中' },
- { id: 6, name: '已完结' }
- ]
- }
+ { id: 999, name: "全部" },
+ { id: 0, name: "创建中" },
+ { id: 2, name: "审核中" },
+ { id: 3, name: "待生效" },
+ { id: 4, name: "进行中" },
+ { id: 5, name: "暂停中" },
+ { id: 6, name: "已完结" },
+ ],
+ },
],
tableHeight: 500,
- menuList: [{ id: 0, name: '状态', check: false }],
+ menuList: [{ id: 0, name: "状态", check: false }],
phone_list: [],
email_list: [],
- phone: '',
- email: '',
+ phone: "",
+ email: "",
email_radio: -1,
phone_radio: -1,
- search: '',
+ search: "",
audit_visible: false,
cur_item: null,
@@ -92,164 +92,164 @@ export default class acclist extends React.Component {
outdateTotal: 0,
invalidTotal: 0,
multiple: true,
- dialogTitle: '',
- bachVisible: false
- }
+ dialogTitle: "",
+ bachVisible: false,
+ };
}
//分页
onPageChange(e) {
- this.setState({ page: e })
+ this.setState({ page: e });
setTimeout(() => {
- this.getpageFn()
- }, 0)
+ this.getpageFn();
+ }, 0);
}
componentDidMount(e) {}
componentWillMount() {
- this.setState({ tableHeight: window.innerHeight - 430 })
+ this.setState({ tableHeight: window.innerHeight - 430 });
}
getKeyCodeList(data) {
let queryParams = _.omitBy(data, (value) => {
- return _.isNaN(value) || _.isNil(value)
- })
- let id = sessionStorage.getItem('key_batch_id')
+ return _.isNaN(value) || _.isNil(value);
+ });
+ let id = sessionStorage.getItem("key_batch_id");
getkeyDetailList(id, queryParams).then((res) => {
handelResponse(
res,
(req, msg) => {
- this.setState({ distdata: req.data })
- this.setState({ dataCount: req.total })
+ this.setState({ distdata: req.data });
+ this.setState({ dataCount: req.total });
},
(err) => {}
- )
- })
+ );
+ });
}
onCountChange(e) {
- this.setState({ page: 1, limit: e })
+ this.setState({ page: 1, limit: e });
setTimeout(() => {
- this.getpageFn()
- }, 0)
+ this.getpageFn();
+ }, 0);
}
getpageFn() {
let data = {
page: this.state.page,
limit: this.state.limit,
- key: this.state.key
- }
- console.log(155, this.state.status)
- let status = this.state.status > 0 ? this.state.status : null
+ key: this.state.key,
+ };
+ console.log(155, this.state.status);
+ let status = this.state.status > 0 ? this.state.status : null;
if (status) {
- data.status = status
+ data.status = status;
}
- this.getKeyCodeList(data)
+ this.getKeyCodeList(data);
}
//清空
clearFn() {
- this.refs.plan_list.allChecked(false)
- this.setState({ multiple: true })
- this.setState({ selectiondata: [] })
+ this.refs.plan_list.allChecked(false);
+ this.setState({ multiple: true });
+ this.setState({ selectiondata: [] });
}
//选中表格的选框
selection(selection) {
if (selection.length > 0) {
- this.setState({ multiple: false })
+ this.setState({ multiple: false });
} else {
- this.setState({ multiple: true })
+ this.setState({ multiple: true });
}
// this.setState({multiple:false})
- this.setState({ selectiondata: selection })
- let grantTotal = 0
- let surplusTotal = 0
- let usageTotal = 0
- let receive_total = 0
- let usage_total = 0
- let silent_total = 0
- let invalidTotal = 0
- let outdateTotal = 0
+ this.setState({ selectiondata: selection });
+ let grantTotal = 0;
+ let surplusTotal = 0;
+ let usageTotal = 0;
+ let receive_total = 0;
+ let usage_total = 0;
+ let silent_total = 0;
+ let invalidTotal = 0;
+ let outdateTotal = 0;
selection.forEach((item) => {
- grantTotal += Number(item.total)
- surplusTotal += Number(item.residue)
- usageTotal += Number(item.usage)
- outdateTotal += Number(item.overdue)
- invalidTotal += Number(item.invalid)
+ grantTotal += Number(item.total);
+ surplusTotal += Number(item.residue);
+ usageTotal += Number(item.usage);
+ outdateTotal += Number(item.overdue);
+ invalidTotal += Number(item.invalid);
// receive_total+=Number(item.receive_total);
- usage_total += Number(item.usage_total)
- silent_total += Number(item.silent_total)
- })
+ usage_total += Number(item.usage_total);
+ silent_total += Number(item.silent_total);
+ });
this.setState({
grantTotal,
usageTotal,
invalidTotal,
outdateTotal,
- surplusTotal
- })
+ surplusTotal,
+ });
}
// 监听组件内部状态的变化:
componentDidUpdate(prevProps, prevState) {
// 参数分别为改变之前的数据状态对象
if (prevState.search != this.state.search && !this.state.search) {
- this.iptsureFn()
+ this.iptsureFn();
}
}
iptsureFn(e) {
- let status = this.state.status > 0 ? this.state.status : null
- this.setState({ page: 1 })
- this.setState({ limit: 10 })
+ let status = this.state.status > 0 ? this.state.status : null;
+ this.setState({ page: 1 });
+ this.setState({ limit: 10 });
let data = {
page: 1,
limit: 10,
- key: this.state.search
+ key: this.state.search,
+ };
+ if (status) {
+ data.status = status;
}
if (status) {
- data.status = status
+ data.status = status;
}
- if (status) {
- data.status = status
- }
- this.getKeyCodeList(data)
+ this.getKeyCodeList(data);
}
onFilterClose(prop) {
- let data = {}
- data[prop] = null
+ let data = {};
+ data[prop] = null;
- this.setState(data)
+ this.setState(data);
let params = {
page: 1,
limit: 10,
- key: this.state.search
- }
- this.getKeyCodeList(params)
+ key: this.state.search,
+ };
+ this.getKeyCodeList(params);
}
tabFn(e) {
- let status = e > 0 ? e : null
- this.setState({ status: e })
- this.setState({ search: '' })
- this.setState({ page: 1 })
- this.setState({ limit: 10 })
+ let status = e > 0 ? e : null;
+ this.setState({ status: e });
+ this.setState({ search: "" });
+ this.setState({ page: 1 });
+ this.setState({ limit: 10 });
let params = {
page: 1,
limit: 10,
- status: status
- }
- this.getKeyCodeList(params)
+ status: status,
+ };
+ this.getKeyCodeList(params);
}
menuItemClick(e, key, rowData) {
if (key == 1) {
let formdata = {
- key: rowData.key
- }
+ key: rowData.key,
+ };
keyUsage(formdata).then((res) => {
handelResponse(
@@ -257,44 +257,44 @@ export default class acclist extends React.Component {
(req, msg) => {
let data = {
page: 1,
- limit: 10
- }
- this.setState({ page: 1, limit: 10 })
- this.getKeyCodeList(data)
- Notify.success('标记为使用成功')
+ limit: 10,
+ };
+ this.setState({ page: 1, limit: 10 });
+ this.getKeyCodeList(data);
+ Notify.success("标记为使用成功");
},
(err) => {
- Notify.error(err)
+ Notify.error(err);
}
- )
- })
+ );
+ });
}
if (key == 2) {
let formdata = {
- key: rowData.key
- }
+ key: rowData.key,
+ };
keyCancel(formdata).then((res) => {
handelResponse(
res,
(req, msg) => {
let data = {
page: 1,
- limit: 10
- }
- this.setState({ page: 1, limit: 10 })
- this.getKeyCodeList(data)
- Notify.success('作废成功')
+ limit: 10,
+ };
+ this.setState({ page: 1, limit: 10 });
+ this.getKeyCodeList(data);
+ Notify.success("作废成功");
},
(err) => {
- Notify.error(err)
+ Notify.error(err);
}
- )
- })
+ );
+ });
}
if (key == 3) {
- sessionStorage.setItem('keyCode', rowData.key)
+ sessionStorage.setItem("keyCode", rowData.key);
// this.props.history.push("/home/key-log");
- window.open('#/home/key-log')
+ window.open("#/home/key-log");
// sessionStorage.setItem("pathname2", "/home/key-log");
// let cur_nav = sessionStorage.getItem("breakchangenav");
@@ -309,61 +309,61 @@ export default class acclist extends React.Component {
}
}
multipleCancel() {
- console.log(this.state.selectiondata)
+ console.log(this.state.selectiondata);
let keys = _.map(this.state.selectiondata, (item) => {
- return item.key
- })
+ return item.key;
+ });
let formdata = {
- keys: keys
- }
+ keys: keys,
+ };
keyBatchCancel(formdata).then((res) => {
handelResponse(
res,
(req, msg) => {
- Notify.success('批量作废成功')
+ Notify.success("批量作废成功");
let data = {
page: 1,
- limit: 10
- }
- this.setState({ page: 1, limit: 10 })
- this.clearFn()
- this.getKeyCodeList(data)
+ limit: 10,
+ };
+ this.setState({ page: 1, limit: 10 });
+ this.clearFn();
+ this.getKeyCodeList(data);
},
(err) => {
- Notify.error(err)
+ Notify.error(err);
}
- )
- })
+ );
+ });
}
multipleUse() {
let keys = _.map(this.state.selectiondata, (item) => {
- return item.key
- })
+ return item.key;
+ });
let formdata = {
- keys: keys
- }
+ keys: keys,
+ };
keyBatchUsage(formdata).then((res) => {
handelResponse(
res,
(req, msg) => {
- Notify.success('批量标记为使用成功')
+ Notify.success("批量标记为使用成功");
let data = {
page: 1,
- limit: 10
- }
- this.setState({ page: 1, limit: 10 })
- this.clearFn()
- this.getKeyCodeList(data)
+ limit: 10,
+ };
+ this.setState({ page: 1, limit: 10 });
+ this.clearFn();
+ this.getKeyCodeList(data);
},
(err) => {
- Notify.error(err)
+ Notify.error(err);
}
- )
- })
+ );
+ });
}
/**
@@ -372,8 +372,8 @@ export default class acclist extends React.Component {
// 查询
bachUploadQuery() {
- this.setState({ dialogTitle: '批量上传查询' })
- this.setState({ bachVisible: true })
+ this.setState({ dialogTitle: "批量上传查询" });
+ this.setState({ bachVisible: true });
}
// 作废
@@ -384,138 +384,142 @@ export default class acclist extends React.Component {
// 取消安妮
bachOnClose() {
- this.setState({ bachVisible: false })
+ this.setState({ bachVisible: false });
}
render() {
- const { current, pageSize } = this.state
+ const { current, pageSize } = this.state;
const Column = [
{
- title: 'key码',
- name: 'key_code',
- prop: 'key_code',
- type: 'normal',
- width: 'auto'
+ title: "key码",
+ name: "key_code",
+ prop: "key_code",
+ type: "normal",
+ width: "auto",
},
{
- title: '归属营销计划',
- width: 'auto',
- type: 'normal',
- prop: 'plan_title',
- name: 'plan_title'
+ title: "归属营销计划",
+ width: "auto",
+ type: "normal",
+ prop: "plan_title",
+ name: "plan_title",
},
{
- title: '状态',
- prop: 'status',
- name: 'status',
- width: 'auto',
- type: 'slot'
+ title: "状态",
+ prop: "status",
+ name: "status",
+ width: "auto",
+ type: "slot",
},
{
- title: '操作',
- name: 'opearo',
- prop: 'opearo',
- type: 'slot',
- width: 'auto'
+ title: "操作",
+ name: "opearo",
+ prop: "opearo",
+ type: "slot",
+ width: "auto",
},
{
- title: '发放总数',
- prop: 'total',
- name: 'total',
- width: 'auto',
- type: 'normal'
+ title: "发放总数",
+ prop: "total",
+ name: "total",
+ width: "auto",
+ type: "normal",
},
{
- title: '剩余总数',
- prop: 'residue',
- name: 'residue',
- width: 'auto',
- type: 'normal'
+ title: "剩余总数",
+ prop: "residue",
+ name: "residue",
+ width: "auto",
+ type: "normal",
},
{
- title: '使用总数',
- name: 'usage',
- prop: 'usage',
- type: 'normal',
- width: 'auto'
+ title: "使用总数",
+ name: "usage",
+ prop: "usage",
+ type: "normal",
+ width: "auto",
},
{
- title: '失效总数',
- name: 'overdue',
- prop: 'overdue',
- type: 'normal',
- width: 'auto'
+ title: "失效总数",
+ name: "overdue",
+ prop: "overdue",
+ type: "normal",
+ width: "auto",
},
{
- title: '作废总数',
- name: 'invalid',
- prop: 'invalid',
- type: 'normal',
- width: 'auto'
+ title: "作废总数",
+ name: "invalid",
+ prop: "invalid",
+ type: "normal",
+ width: "auto",
},
{
- title: '已完结总数',
- name: 'end',
- prop: 'end',
- type: 'normal',
- width: 'auto'
+ title: "已完结总数",
+ name: "end",
+ prop: "end",
+ type: "normal",
+ width: "auto",
},
{
- title: '更新时间',
- name: 'update_time',
- prop: 'update_time',
- type: 'normal',
- width: 'auto'
- }
- ]
+ title: "更新时间",
+ name: "update_time",
+ prop: "update_time",
+ type: "normal",
+ width: "auto",
+ },
+ ];
const date = (
- )
+ );
return (
-
+
-
+
console.log(va)} />
-
+
{/* 批量上传操作 */}
@@ -525,33 +529,34 @@ export default class acclist extends React.Component {
onChange={(e) => this.setState({ search: e })}
value={this.state.search}
wordSearch={this.iptsureFn.bind(this)}
- icon='search'
- placeholder={'请完整输入key'}
+ icon="search"
+ placeholder={"请完整输入key"}
countShow={false}
- height={'36px'}
- width={'260px'}
+ height={"36px"}
+ width={"260px"}
onClearItem={(e) => {
- this.setState({ search: '' })
+ this.setState({ search: "" });
let data = {
page: 1,
- limit: 10
- }
- this.getKeyCodeList(data)
+ limit: 10,
+ };
+ this.getKeyCodeList(data);
}}
- alignment={'left'}
+ alignment={"left"}
/>
-
+
{this.state.selectiondata.length > 0 ? (
+
- }>
+ }
+ >
已选择
-
+
{this.state.selectiondata.length}
发放key总数:{this.state.grantTotal},剩余key总数:
@@ -561,162 +566,170 @@ export default class acclist extends React.Component {
) : null}
{
- this.onPageChange(e)
+ this.onPageChange(e);
}}
countChange={(e) => {
- this.onCountChange(e)
+ this.onCountChange(e);
}}
checkChange={this.selection.bind(this)}
ComponentHandler={(com, rowData) => {
- if (com == 'dates') {
+ if (com == "dates") {
return (
{rowData.begin_time} 至 {rowData.end_time}
- )
+ );
}
- if (com == 'title') {
+ if (com == "title") {
return (
{
- this.linkTo(rowData)
- }}>
+ this.linkTo(rowData);
+ }}
+ >
{rowData.title}
- )
+ );
}
- if (com == 'switch') {
+ if (com == "switch") {
return (
{
- this.onSwitchChange(e, rowData)
- }}>
- )
+ this.onSwitchChange(e, rowData);
+ }}
+ >
+ );
}
- if (com == 'status') {
+ if (com == "status") {
return (
-
+
+ ),
+ }}
+ >
{rowData.status_text}
- )
+ );
}
- if (com == 'opearo') {
- let str = null
+ if (com == "opearo") {
+ let str = null;
if (rowData.status == 1) {
str = (
+ className="grid-link"
+ style={{ paddingLeft: "2px", color: "#d8dbdd" }}
+ >
详情
- {}}>
- {' '}
- 更多
{' '}
+
{}}>
+ {" "}
+ 更多 {" "}
- )
+ );
} else {
str = (
+ className="grid-link"
+ style={{ paddingLeft: "2px", color: "#d8dbdd" }}
+ >
详情
- {}}>
- {' '}
- 更多
{' '}
+
{}}>
+ {" "}
+ 更多 {" "}
- )
+ );
}
- return str
+ return str;
}
}}
/>
{this.state.audit_visible ? (
-
-
+
+
{
- this.cancel(e)
+ this.cancel(e);
}}
/>
- 发送
-
+
发送
+
是否立即发送key以及解压密码?
-
+
接收手机号
-
+
{
- this.onPhoneChange(e)
- }}>
+ this.onPhoneChange(e);
+ }}
+ >
{this.state.phone_list.map((item, index) => {
return (
+ }}
+ >
{item}
- )
+ );
})}
-
+
接收邮箱
-
+
{
- this.onEmailChange(e)
- }}>
+ this.onEmailChange(e);
+ }}
+ >
{this.state.email_list.map((item, index) => {
return (
+ }}
+ >
{item}
- )
+ );
})}
-
+
-1}>
+ disabled={this.state.phone_radio > -1}
+ >
-
+
-1}>
+ disabled={this.state.email_radio > -1}
+ >
-
+
@@ -797,11 +817,14 @@ export default class acclist extends React.Component {
) : null}
+
+ {/* 批量上传 */}
+ onClose={this.bachOnClose.bind(this)}
+ >
- )
+ );
}
}