Skip to content

X
xiaomai-cloud-class-web
Commit b1651ccb by zhangleyuan
Options

feat:处理按钮的公共样式

parent 843b8102
Showing with 163 additions and 124 deletions
src/core/antd.less
......@@ -40,17 +40,6 @@
display: block;
}
.ant-btn-primary {
text-shadow: none !important;
box-shadow: none !important;
i {
color: #fff !important;
}
span {
color: #fff !important;
}
}
.ant-switch-small:after {
top: 0.3px;
......@@ -221,22 +210,12 @@
}
/* 按钮padding改成8px */
.ant-btn {
height: 28px !important;
line-height:20px !important;
font-weight: 400 !important;
border: 1px solid #e8e8e8;
box-shadow: none !important;
}
.ant-input-search-button {
height: 32px !important;
}
.ant-btn-loading {
padding-left:18px !important;
}
.ant-avatar {
width: 35px;
......@@ -349,10 +328,7 @@ mr0 {
transform: translate(-8px, -8px) scale(0.7) !important;
}
.ant-input,
.ant-btn {
border-color: @xm-color-border;
}
.ant-select-selection {
border-color: @xm-color-border !important;
......@@ -372,18 +348,7 @@ mr0 {
color:#ffb000;
}
.ant-btn-primary.ant-btn {
background-color: @xm-color-text-select-primary !important;
border-color: @xm-color-text-select-primary !important;
&:hover {
background-color: #fdb089 !important;
border-color: #fdb089 !important;
}
span {
color: #fff !important;
}
}
.ant-select-open .ant-select-selection {
box-shadow: none;
......@@ -427,11 +392,7 @@ mr0 {
background: rgba(204, 204, 204, 1);
}
.ant-modal-footer {
.ant-btn {
font-weight: normal !important;
}
}
.ant-avatar {
background: #e8e8e8;
......@@ -516,12 +477,7 @@ mr0 {
margin: 0 12px;
}
.ant-btn-danger:hover,
.ant-btn-danger:focus {
color: #fff !important;
background-color: #ffb000 !important;
border-color: #ffb000 !important;
}
.ant-modal-confirm-info .ant-modal-confirm-body > .anticon {
color: #ffb000!important;
......@@ -609,16 +565,6 @@ mr0 {
padding: 16px 24px !important;
}
}
.ant-btn-dangerous{
background:#FF4F4F !important;
color:#FFF !important;
border:none !important;
}
.ant-btn-dangerous:hover, .ant-btn-dangerous:focus{
background:#FF4F4F !important;
color:#FFF !important;
border:none !important;
}
.row-dragging {
background: #fafafa;
......@@ -634,6 +580,7 @@ mr0 {
visibility: visible;
}
//滚动条的公共样式处理
.ant-select-dropdown .rc-virtual-list-scrollbar .rc-virtual-list-scrollbar-thumb{
background: #D6D6D6 !important;
width:6px !important;
......@@ -642,6 +589,10 @@ mr0 {
.ant-select-dropdown .rc-virtual-list-scrollbar .rc-virtual-list-scrollbar-thumb:hover{
background: #ADADAD !important;
}
//table的公共的样式的处理
.ant-table.ant-table-bordered > .ant-table-container > .ant-table-content > table > thead > tr > .ant-table-cell-fix-right-first::after,
.ant-table.ant-table-bordered > .ant-table-container > .ant-table-content > table > tbody > tr > .ant-table-cell-fix-right-first::after
{
......@@ -650,4 +601,91 @@ mr0 {
.ant-table tbody tr:nth-child(2n) td{
background: #FAFAFA !important;
}
.ant-table-thead > tr > th{
font-weight:normal !important;
}
//按钮的颜色的公共处理
.ant-btn-danger:hover,
.ant-btn-danger:focus {
color: #fff !important;
background-color: #ffb000 !important;
border-color: #ffb000 !important;
}
.ant-btn-loading {
padding-left:18px !important;
}
.ant-input,
.ant-btn {
border-color: @xm-color-border;
}
.ant-btn-dangerous{
background:#FF4F4F !important;
color:#FFF !important;
border:none !important;
}
.ant-btn-dangerous:hover, .ant-btn-dangerous:focus{
background:#FF4F4F !important;
color:#FFF !important;
border:none !important;
}
/* 按钮padding改成8px */
.ant-btn {
height:28px !important;
font-weight: normal !important;
border: 1px solid #e8e8e8;
box-shadow: none !important;
padding:0px 12px !important;
color:#666 !important;
.span{
line-height:1;
}
&:hover {
border:1px solid rgba(232, 232, 232, 1) !important;
opacity: 0.7;
}
&:focus,
&:active{
color:#C6C6C6 !important;
border:1px solid #C6C6C6 !important;
}
}
//主要按钮样式
.ant-btn-primary.ant-btn {
text-shadow: none !important;
box-shadow: none !important;
i {
color: #fff !important;
}
span {
color: #fff !important;
}
background-color: @xm-color-text-select-primary !important;
border-color: @xm-color-text-select-primary !important;
border:none !important;
&:hover {
background-color: #FFB714 !important;
opacity: 0.8 !important;
}
&:focus,
&:active{
background-color:#FFA100 !important;
}
}
.ant-modal-footer {
.ant-btn {
font-weight: normal !important;
}
}
\ No newline at end of file
src/core/global.less
......@@ -1278,10 +1278,10 @@ input:focus {
margin-right: 16px;
}
.ant-btn-primary.ant-btn:hover {
border-color: rgba(255, 183, 20, .8) !important;
background-color: rgba(255, 183, 20, .8) !important;
}
// .ant-btn-primary.ant-btn:hover {
// border-color: rgba(255, 183, 20, .8) !important;
// background-color: rgba(255, 183, 20, .8) !important;
// }
.noTitleModal {
.ant-modal-close {
......@@ -1320,10 +1320,10 @@ input:focus {
display: none !important;
}
.ant-btn.subButton {
border: 1px solid #fdb089;
color: #fdb089;
}
// .ant-btn.subButton {
// border: 1px solid #fdb089;
// color: #fdb089;
// }
.ant-form-explain-holder[aria-hidden=true] {
display: none;
......
src/core/page.less
......@@ -78,9 +78,9 @@
margin-left: 16px;
height: 40px;
}
>.ant-btn {
height: 28px!important;
}
// >.ant-btn {
// height: 28px!important;
// }
*:first-child {
margin-left: 0px;
}
......
src/modules/course-manage/components/AddLiveBasic.jsx
......@@ -232,17 +232,6 @@ class AddLiveBasic extends React.Component {
<img src={coverUrl} />
</div>
<div className="opt-btns">
{/* <input
type="file"
value={fileName} // 避免选择同一文件 value不改变 不触发onChange事件
accept="image/png, image/jpeg, image/bmp, image/jpg"
ref="stagePicInputFile"
style={{display: 'none'}}
onChange={() => { this.setState({
showSelectFileModal: true
}) }}
/> */}
<Button onClick={() => {
this.setState({
showSelectFileModal: true
......@@ -259,10 +248,10 @@ class AddLiveBasic extends React.Component {
<div className="course-catalog">
<span className="label"><span className="require">*</span>课程分类：</span>
{ pageType === 'add' &&
<Cascader options={courseCatalogList} displayRender={ label => label.join('-')} fieldNames={fieldNames} onChange={this.catalogChange} style={{ width: 240 }} placeholder="请选择课程分类" />
<Cascader options={courseCatalogList} displayRender={ label => label.join('-')} fieldNames={fieldNames} onChange={this.catalogChange} style={{ width: 240 }} placeholder="请选择课程分类" suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>}/>
}
{ (pageType === 'edit' && categoryName) &&
<Cascader disabled={!isEdit ? true: false} defaultValue={[categoryName]} options={courseCatalogList} displayRender={ label => label.join('-')} fieldNames={fieldNames} onChange={this.catalogChange} style={{ width: 240 }} placeholder="请选择课程分类" />
<Cascader disabled={!isEdit ? true: false} defaultValue={[categoryName]} options={courseCatalogList} displayRender={ label => label.join('-')} fieldNames={fieldNames} onChange={this.catalogChange} style={{ width: 240 }} placeholder="请选择课程分类" suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>} />
}
</div>
<ImgCutModalNew
......
src/modules/course-manage/components/AddLiveClass.jsx
......@@ -273,14 +273,13 @@ class AddLiveClass extends React.Component {
<span className="label"><span className="require">* </span>讲师：</span>
<Select
placeholder="请选择讲师"
// key={teacherName}
// defaultValue={teacherName}
value={teacherName}
style={{ width: 240, marginTop: 6 }}
disabled={!isEdit ? true: false}
showSearch
filterOption={(input, option) => option}
onPopupScroll={this.handleScrollTeacherList}
suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>}
onChange={(value,option) => {
console.log("value",value);
this.props.onChange('teacherId',value,'teacherType',option.children)
......
src/modules/course-manage/components/LiveCourseFilter.jsx
......@@ -9,9 +9,6 @@
import React from 'react';
import { withRouter } from 'react-router-dom';
import { Row,Col, Input, Select ,Tooltip} from 'antd';
import Bus from '@/core/bus';
import TeacherSearchSelect from "@/modules/common/TeacherSearchSelect";
import RangePicker from "@/modules/common/DateRangePicker";
import moment from 'moment';
import StoreService from "@/domains/store-domain/storeService";
......@@ -230,6 +227,7 @@ class LiveCourseFilter extends React.Component {
allowClear={true}
value={courseState}
onChange={(value) => { this.handleChangeQuery('courseState', value) }}
suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>}
>
<Option value="UN_START">待开课</Option>
<Option value="STARTING">上课中</Option>
......@@ -247,6 +245,7 @@ class LiveCourseFilter extends React.Component {
allowClear={true}
value={shelfState}
onChange={(value) => { this.handleChangeQuery('shelfState', value) }}
suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>}
>
<Option value="YES">开启</Option>
<Option value="NO">关闭</Option>
......
src/modules/course-manage/video-course/AddVideoCourse.jsx
......@@ -2,7 +2,7 @@
* @Author: 吴文洁
* @Date: 2020-08-05 10:07:47
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-25 13:46:13
* @LastEditTime: 2021-01-29 14:53:42
* @Description: 视频课新增/编辑页
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -513,10 +513,10 @@ class AddVideoCourse extends React.Component {
<div className="course-catalog required">
<span className="label">课程分类：</span>
{ (pageType === 'add') &&
<Cascader defaultValue={[categoryName]} options={courseCatalogList} displayRender={ label => label.join('-')} fieldNames={fieldNames} onChange={this.catalogChange} style={{ width: 240 }} placeholder="请选择课程分类" />
<Cascader defaultValue={[categoryName]} options={courseCatalogList} displayRender={ label => label.join('-')} fieldNames={fieldNames} onChange={this.catalogChange} style={{ width: 240 }} placeholder="请选择课程分类" suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>}/>
}
{ (pageType === 'edit' && categoryName ) &&
<Cascader defaultValue={[categoryName]} options={courseCatalogList} displayRender={ label => label.join('-')} fieldNames={fieldNames} onChange={this.catalogChange} style={{ width: 240 }} placeholder="请选择课程分类" />
<Cascader defaultValue={[categoryName]} options={courseCatalogList} displayRender={ label => label.join('-')} fieldNames={fieldNames} onChange={this.catalogChange} style={{ width: 240 }} placeholder="请选择课程分类" suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>}/>
}
</div>
<div className="intro-info mt16">
......
src/modules/course-manage/video-course/components/VideoCourseFilter.jsx
......@@ -2,7 +2,7 @@
* @Author: 吴文洁
* @Date: 2020-08-05 10:11:57
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-28 18:06:34
* @LastEditTime: 2021-01-29 13:47:59
* @Description: 视频课-搜索模块
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -11,7 +11,6 @@ import React from 'react';
import { Row, Input, Select,Tooltip } from 'antd';
import RangePicker from "@/modules/common/DateRangePicker";
// import TeacherSelectV5 from '@/modules/classManage_V5/classDetail/TeacherSelectV5';
import './VideoCourseFilter.less';
import moment from 'moment';
......@@ -186,16 +185,6 @@ class VideoCourseFilter extends React.Component {
);
})}
</Select>
{/* <TeacherSelectV5
ref="TeacherSelect"
showSearch={true}
allowClear={true}
style={{ width: "calc(100% - 70px)" }}
onSelect={(teacherId) => { this.handleChangeQuery('teacherId', teacherId)}}
placeholder='请选择创建人'
label='创建人'
defaultValue={teacherId}
/> */}
</div>
<div className="search-condition__item">
......@@ -218,6 +207,7 @@ class VideoCourseFilter extends React.Component {
allowClear={true}
value={shelfState}
onChange={(value) => { this.handleChangeQuery('shelfState', value) }}
suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>}
>
<Option value="YES">开启</Option>
<Option value="NO">关闭</Option>
......
src/modules/course-manage/video-course/components/VideoCourseFilter.less
.video-course-filter {
position: relative;
.video-list-table{
// tr:nth-child(even){
// background: transparent !important;
// }
// tr:nth-child(odd){
// td{
// background: #FAFAFA !important;
// }
// }
}
.search-condition {
width: calc(100% - 80px);
display: flex;
......
src/modules/course-manage/video-course/components/VideoCourseList.jsx
......@@ -2,7 +2,7 @@
* @Author: 吴文洁
* @Date: 2020-08-05 10:12:45
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-28 16:28:24
* @LastEditTime: 2021-01-30 15:23:47
* @Description: 视频课-列表模块
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -329,6 +329,7 @@ class VideoCourseList extends React.Component {
pagination={false}
scroll={{ x: 1500}}
bordered
className="video-list-table"
/>
<div className="box-footer">
......
src/modules/course-manage/video-course/components/VideoCourseList.less
......@@ -44,6 +44,7 @@
height:48px;
}
}
}
.video-course-more-menu {
......
src/modules/course-manage/video-course/modal/WatchDataModal.jsx
......@@ -140,6 +140,7 @@ class WatchDataModal extends React.Component {
dataSource={dataSource}
columns={this.parseColumns()}
pagination={false}
bordered
/>
{dataSource.length >0 &&
<div className="box-footer">
......
src/modules/store-manage/CourseCatalogPage.less
.course-catalog-page{
.child-table{
thead{
display:none;
}
tbody tr td{
border-bottom:none;
background:#FAFAFA;
}
// tr:hover td{
// background: #FAFAFA !important;
// }
// tbody tr:hover{
// background: #FAFAFA !important;
// }
}
.divider-line{
color: #BFBFBF;
}
......@@ -42,7 +26,29 @@
text-align:center;
background: #FAFAFA;
}
// tr.ant-table-expanded-row:hover > td {
// background: #FAFAFA !important;
// }
.catalog-tabel{
.ant-table-content{
border:1px solid #e8e8e8;
tr{
td{
border:none;
}
.child-table{
.ant-table-content{
border:none;
thead{
display:none;
}
tbody tr td{
border-bottom:none;
background:#FAFAFA;
}
}
}
}
}
}
}
\ No newline at end of file
src/modules/store-manage/CourseCatalogPage.tsx
......@@ -191,6 +191,7 @@ function CourseCatalogPage() {
}
}}
dataSource={courseCatalogList}
className="catalog-tabel"
/>
</div>
<div className="box-footer">
......
src/modules/store-manage/modal/SecondCatalogAddOrEditModal.tsx
......@@ -2,7 +2,7 @@
* @Author: wufan
* @Date: 2020-11-27 16:21:49
* @LastEditors: zhangleyuan
* @LastEditTime: 2020-12-15 16:13:27
* @LastEditTime: 2021-01-29 16:58:09
* @Description: Description
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -168,9 +168,11 @@ function SecondCatalogAddOrEditModal(props: SecondCatalogAddOrEditModalProps) {
style={{ width: 240 }}
defaultValue={parentName}
onPopupScroll={handleScroll}
suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>}
onChange={(value) => {
setSelectParentId(String(value))
}}
>
{_.map(optionList, (item:any, index) => {
return <Option id={item.id} value={item.id}>{item.categoryName}</Option>
......
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