Skip to content

X
xiaomai-cloud-class-web
Commit 5b41df7a by wufan
Options

style:资料云盘样式优化

parent 5a7187a9
Showing with 71 additions and 49 deletions
src/bu-components/CopyFileModal.jsx
......@@ -240,7 +240,7 @@ class CopyFileModal extends React.Component {
<Modal
visible={isOpen}
title={title}
width={560}
width={680}
onCancel={this.handleClose}
maskClosable={false}
footer={[
......@@ -335,7 +335,7 @@ class CopyFileModal extends React.Component {
{
!(folderList.length>0) && showLottieIcon &&
<LottieIcon
title={<span className="desc">此文件夹下无可用文件</span>}
title={<span className="desc">这个文件夹是空的</span>}
/>
}
</div>
......
src/bu-components/CopyFileModal.less
......@@ -2,21 +2,22 @@
margin-left: 34%;
}
.copy-body{
.bread-crumbs {
margin-bottom: 10px;
}
.bread:hover{
color: #FD9A6A;
color: #5289FA;
}
}
.folder-list{
margin-top: 10px;
height: 260px;
// overflow-y: scroll;
height: 100%;
border-top: 1px solid #E8E8E8;
border-top-left-radius:4px;
border-top-right-radius:4px;
border: 1px solid #E8E8E8;
overflow: auto;
.enable{
cursor: pointer;
}
......@@ -29,12 +30,14 @@
.information{
display: flex;
height: 50px;
border: 1px solid #E8E8E8;
border-top: none;
padding-top: 12px;
padding-left: 25px;
position: relative;
border-bottom: 1px solid #E8E8E8;
&:last-child {
border-bottom: none;
}
.folderName{
padding-left: 15px;
}
......
src/bu-components/ManagingMembersModal.jsx
......@@ -277,6 +277,10 @@ class ManagingMembersModal extends React.Component {
return selectColumns;
}
renderTitle = () => {
return <div className="tip-title" style={{width:200}}>不在名单内的员工不可查看此文件/文件夹</div>
}
render() {
const { isOpen, disk } = this.props;
const { addManagingMember, dataSource } = this.state;
......@@ -291,18 +295,20 @@ class ManagingMembersModal extends React.Component {
visible={isOpen}
onCancel={this.handleClose}
title={title}
width={560}
width={680}
maskClosable={false}
>
<div className='managing-header'>
<div className='managing-left'>
已有成员
<Tooltip title="不在名单内的员工不可查看此文件/文件夹" arrowPointAtCenter>
<Tooltip title={this.renderTitle()} arrowPointAtCenter>
<img src="https://image.xiaomaiketang.com/xm/JbGfBpiPjt.png" className='tool-tip-left' alt=""/>
</Tooltip>
</div>
<div className='managing-right' onClick={ () => this.handleChooseModal() }>
<img src="https://image.xiaomaiketang.com/xm/xkZs3C6G5R.png" className='tool-tip-right' alt=""/>
<span className="icon iconfont tool-tip-right">
&#xe61f;
</span>
添加成员
</div>
</div>
......
src/bu-components/ManagingMembersModal.less
......@@ -16,7 +16,7 @@
.managing-right{
float: right;
color: #FD9A6A;
color: #FFB714;
margin-right: 10px;
cursor: pointer;
.tool-tip-right{
......@@ -31,7 +31,7 @@
height: 300px;
overflow: hidden;
border: 1px solid #E9E9E9;
border-radius: 10px;
border-radius: 4px;
.ant-table-tbody{
.ant-table-row{
background-color: #fff !important;
......
src/bu-components/SelectPrepareFileModal.jsx
......@@ -549,7 +549,7 @@ class SelectPrepareFileModal extends React.Component {
title={title}
footer={footer}
maskClosable={false}
width={560}
width={680}
onCancel={this.handleClose}
className="select-prepare-file-modal"
>
......@@ -672,7 +672,7 @@ class SelectPrepareFileModal extends React.Component {
</When>
<Otherwise>
<LottieIcon
title={<span className="desc">此文件夹下无可用文件</span>}
title={<span className="desc">这个文件夹是空的</span>}
/>
</Otherwise>
</Choose>
......
src/bu-components/SelectPrepareFileModal.less
......@@ -38,7 +38,7 @@
&:not(:last-child) {
cursor: pointer;
&:hover {
color: #FF8534;
color: #5289FA;
}
&::before {
content: '/';
......
src/bu-components/UploadProgressModal.jsx
......@@ -296,7 +296,7 @@ class UploadProgressModal extends React.Component {
</div>
{
showFileList &&
<div className="modal-body">
<div className="modal-body" style={{height:`${fileList.length * 53}px`}}>
{
fileList.map((file, index) => {
let { size, type, name } = file.fileContent;
......
src/bu-components/UploadProgressModal.less
......@@ -45,7 +45,7 @@
.modal-body {
max-height: 290px;
overflow: scroll;
overflow: auto;
.file-item {
display: flex;
......
src/common/less/icon-font.less
@font-face {
font-family: 'iconfont'; /* project id 2223403 */
src: url('//at.alicdn.com/t/font_2223403_0pwkijxkqyf.eot');
src: url('//at.alicdn.com/t/font_2223403_0pwkijxkqyf.eot?#iefix') format('embedded-opentype'),
url('//at.alicdn.com/t/font_2223403_0pwkijxkqyf.woff2') format('woff2'),
url('//at.alicdn.com/t/font_2223403_0pwkijxkqyf.woff') format('woff'),
url('//at.alicdn.com/t/font_2223403_0pwkijxkqyf.ttf') format('truetype'),
url('//at.alicdn.com/t/font_2223403_0pwkijxkqyf.svg#iconfont') format('svg');
src: url('//at.alicdn.com/t/font_2223403_5k8dbuf925c.eot');
src: url('//at.alicdn.com/t/font_2223403_5k8dbuf925c.eot?#iefix') format('embedded-opentype'),
url('//at.alicdn.com/t/font_2223403_5k8dbuf925c.woff2') format('woff2'),
url('//at.alicdn.com/t/font_2223403_5k8dbuf925c.woff') format('woff'),
url('//at.alicdn.com/t/font_2223403_5k8dbuf925c.ttf') format('truetype'),
url('//at.alicdn.com/t/font_2223403_5k8dbuf925c.svg#iconfont') format('svg');
}
.iconfont{
font-family:"iconfont" !important;
......
src/index.html
<!--
* @Author: 吴文洁
* @Date: 2020-08-24 12:20:57
<<<<<<< Updated upstream
* @LastEditors: zhangleyuan
* @LastEditTime: 2020-12-24 10:34:16
=======
* @LastEditors: wufan
* @LastEditTime: 2020-12-28 14:04:31
>>>>>>> Stashed changes
* @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有
-->
......@@ -25,7 +30,7 @@
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link rel="stylesheet" href="//at.alicdn.com/t/font_2223403_0pwkijxkqyf.css">
<link rel="stylesheet" href="//at.alicdn.com/t/font_2223403_5k8dbuf925c.css">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
......
src/modules/prepare-lesson/components/FolderList.jsx
......@@ -289,7 +289,7 @@ class FolderList extends React.Component {
Modal.confirm({
title: '确认删除所选的文件吗？',
content: hasRelative ? '此文件已关联了课次，删除后，学员将不能查看到此文件。' : '删除后，数据将无法恢复。',
icon: <span className="icon iconfont default-confirm-icon">&#xe6f4;</span>,
icon: <span className="icon iconfont default-confirm-icon">&#xe834;</span>,
onOk: () => {
const { currentFolder } = this.state;
axios.Apollo(DEL_FOLDER_URL_MAP[disk], {
......
src/modules/prepare-lesson/components/OperateArea.jsx
......@@ -212,6 +212,7 @@ class OperateArea extends React.Component {
Modal.confirm({
title: '确认删除所选的文件吗？',
content: '删除后，数据将无法恢复。',
icon: <span className="icon iconfont default-confirm-icon">&#xe834;</span>,
onOk: () => {
const currentFolder = folderPathList[folderPathList.length - 1];
Service.Hades(DEL_FOLDER_URL_MAP[disk], {
......
src/modules/prepare-lesson/index.less
......@@ -163,7 +163,7 @@
&:not(:last-child) {
cursor: pointer;
&:hover {
color: #FF8534;
color: #5289FA;
}
&::before {
content: '/';
......@@ -200,11 +200,7 @@
}
.file-path {
cursor: pointer;
text-decoration: underline;
&:hover {
color: #FF7519;
}
color: #5289FA;
}
.ant-dropdown-trigger {
cursor: pointer;
......
src/modules/prepare-lesson/modal/SelectPrepareFileModal.jsx
......@@ -526,7 +526,7 @@ class SelectPrepareFileModal extends React.Component {
visible={isOpen}
title={title}
footer={footer}
width={560}
width={680}
maskClosable={false}
onCancel={this.handleClose}
className="select-prepare-file-modal"
......
src/modules/prepare-lesson/modal/SelectPrepareFileModal.less
......@@ -38,7 +38,7 @@
&:not(:last-child) {
cursor: pointer;
&:hover {
color: #FF8534;
color: #5289FA;
}
&::before {
content: '/';
......
src/modules/prepare-lesson/modal/UploadProgressModal.jsx
......@@ -302,7 +302,7 @@ class UploadProgressModal extends React.Component {
</div>
{
showFileList &&
<div className="modal-body">
<div className="modal-body" style={{height:`${fileList.length * 53}px`}}>
{
fileList.map((file, index) => {
let { size, type, name } = file.fileContent;
......
src/modules/prepare-lesson/modal/UploadProgressModal.less
......@@ -44,7 +44,7 @@
.modal-body {
max-height: 290px;
overflow: scroll;
overflow: auto;
.file-item {
display: flex;
......
src/modules/resource-disk/components/FolderList.jsx
......@@ -297,6 +297,7 @@ class FolderList extends React.Component {
Modal.confirm({
title: '确认删除所选的文件吗？',
content: '删除后，数据将无法恢复。',
icon: <span className="icon iconfont default-confirm-icon">&#xe834;</span>,
onOk: () => {
const { currentFolder } = this.state;
Service.Hades(DEL_FOLDER_URL_MAP[disk], {
......
src/modules/resource-disk/components/OperateArea.jsx
......@@ -211,6 +211,7 @@ class OperateArea extends React.Component {
Modal.confirm({
title: '确认删除所选的文件吗？',
content: '删除后，数据将无法恢复。',
icon: <span className="icon iconfont default-confirm-icon">&#xe834;</span>,
onOk: () => {
const currentFolder = folderPathList[folderPathList.length - 1];
Service.Hades(DEL_FOLDER_URL_MAP[disk], {
......@@ -330,8 +331,10 @@ class OperateArea extends React.Component {
disabled={showResultPage}
onClick={this.handleChooseFile}
>
<div className="btn-content">
<span className="icon iconfont">&#xe7a0;</span>
上传文件
<span className="btn-text">上传文件</span>
</div>
</Button>
</Tooltip>
......@@ -339,8 +342,10 @@ class OperateArea extends React.Component {
onClick={this.handleToggleCreateFolderModal}
disabled={showResultPage}
>
<div className="btn-content">
<span className="icon iconfont">&#xe7a2;</span>
新建文件夹
<span className="btn-text">新建文件夹</span>
</div>
</Button>
{
......
src/modules/resource-disk/index.less
.prepare-lesson-page {
.ant-upload-list {
display: none;
}
......@@ -80,7 +79,7 @@
position: absolute;
left: 33px;
bottom: 24px;
color: #FF7519;
color: #5289FA;
}
}
......@@ -116,6 +115,16 @@
&__opt {
width: fit-content;
.btn-content {
width: 100%;
display: flex;
align-items: center;
color:#666;
.btn-text {
width: 100%;
border:none!important;
}
}
&.visible {
display: block;
......@@ -159,7 +168,7 @@
&:not(:last-child) {
cursor: pointer;
&:hover {
color: #FF8534;
color: #5289FA;
}
&::before {
content: '/';
......@@ -191,16 +200,12 @@
}
&__text:hover {
color: #FF7519;
color: #5289FA;
}
}
.file-path {
cursor: pointer;
text-decoration: underline;
&:hover {
color: #FF7519;
}
color: #5289FA;
}
.ant-dropdown-trigger {
cursor: pointer;
......
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