fix:bug修复

9be0fad9 · yuananting · db501bd8 · 9be0fad9 · 9be0fad9 · 9be0fad9
Commit 9be0fad9 authored Mar 23, 2021 by yuananting
8 changed files
--- a/src/modules/teach-tool/QuestionBankIndex.jsx
+++ b/src/modules/teach-tool/QuestionBankIndex.jsx
@@ -2,7 +2,7 @@
 * @Author: yuananting
 * @Date: 2021-02-21 17:51:01
 * @LastEditors: yuananting
- * @LastEditTime: 2021-03-22 14:28:00
+ * @LastEditTime: 2021-03-23 17:44:18
 * @Description: 助学工具-题库-题库主页面
 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
@@ -11,8 +11,6 @@ import React, { Component } from "react";
 import "./QuestionBankIndex.less";
 import QuestionBankSider from "./components/QuestionBankSider";
 import QuestionManageContent from "./components/QuestionManageContent";
-import User from "@/common/js/user";
-import QuestionBankService from "@/domains/question-bank-domain/QuestionBankService";
 class QuestionBankIndex extends Component {
  constructor(props) {
@@ -31,8 +29,8 @@ class QuestionBankIndex extends Component {
  };
  updatedSiderTreeFromList = (currentTotal, updatedCategoryId) => {
-    this.setState({currentTotal});
+    this.setState({ currentTotal });
-    this.setState({updatedCategoryId});
+    this.setState({ updatedCategoryId });
  };
  render() {

--- a/src/modules/teach-tool/components/NewQuestionTab.jsx
+++ b/src/modules/teach-tool/components/NewQuestionTab.jsx
@@ -2,7 +2,7 @@
 * @Author: yuananting
 * @Date: 2021-02-25 14:34:29
 * @LastEditors: yuananting
- * @LastEditTime: 2021-03-22 16:53:42
+ * @LastEditTime: 2021-03-23 18:28:16
 * @Description: 助学工具-题库-题目管理-新建题目Tab
 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
@@ -17,7 +17,6 @@ import {
  MEDIA_FILE_ACCEPT,
 } from "@/common/constants/punchClock/punchClock";
 import { defineOptionInfo, defineJudgeOptionInfo } from "./model";
-import UploadingProgress from "./UploadingProgress";
 import XMAudio from "./XMAudio";
 import XMRecord from "./XMRecord";
 import ScanFileModal from "@/modules/resource-disk/modal/ScanFileModal";
@@ -236,13 +235,37 @@ class NewQuestionTab extends Component {
          this.setState({ [`optionsText_${index}`]: "" });
        }
      });
+      var chooseIcon = [];
+      if (["SINGLE_CHOICE", "JUDGE"].includes(this.props.questionTypeKey)) {
+        chooseIcon = document.getElementsByClassName("ant-radio-inner");
+      } else if (
+        ["MULTI_CHOICE", "INDEFINITE_CHOICE"].includes(
+          this.props.questionTypeKey
+        )
+      ) {
+        chooseIcon = document.getElementsByClassName("ant-checkbox-inner");
+      }
      if (optionUnChecked === chooseOptions.length) {
        this.setState({ radioValidate: "error" });
-        this.setState({ radioText: "请选择正确答案" });
+        chooseIcon.forEach((item) => {
+          item.setAttribute("style", "border:1px solid #ff4d4f;");
+        });
+        this.setState({
+          radioText: (
+            <span>
+              正确答案
+              <br />
+              不能为空
+            </span>
+          ),
+        });
        validateError++;
      } else {
        this.setState({ radioValidate: "success" });
        this.setState({ radioText: "" });
+        chooseIcon.forEach((item) => {
+          item.setAttribute("style", "border:1px solid #d9d9d9;");
+        });
      }
      if (
        this.props.questionTypeKey === "MULTI_CHOICE" &&
@@ -250,6 +273,9 @@ class NewQuestionTab extends Component {
      ) {
        this.setState({ radioValidate: "error" });
        this.setState({ radioText: "最少选两个" });
+        chooseIcon.forEach((item) => {
+          item.setAttribute("style", "border:1px solid #ff4d4f;");
+        });
        validateError++;
      }
    }
@@ -787,21 +813,7 @@ class NewQuestionTab extends Component {
            {pictureMediaList.length > 0 && (
              <div className="desc-picture-box">
                {_.map(pictureMediaList, (pictureItem, pictureIndex) => {
-                  let { content, status } = pictureItem;
+                  let { content } = pictureItem;
-                  if (["init", "fail"].includes(status)) {
-                    return (
-                      <div className="mt12" key={pictureIndex}>
-                        <UploadingProgress
-                          fileDesc={pictureItem}
-                          canCancelUpload
-                          onReupload={() => this.handleReupload(pictureItem)}
-                          onAbort={() =>
-                            this.handleAbort(pictureItem, pictureIndex)
-                          }
-                        />
-                      </div>
-                    );
-                  } else {
                  return (
                    <div className="picture-box" key={pictureIndex}>
                      <img
@@ -813,9 +825,7 @@ class NewQuestionTab extends Component {
                        className="icon_arrow iconfont"
                        onClick={() => {
                          contentList.map((item, index) => {
-                              if (
+                            if (item.contentName === pictureItem.contentName) {
-                                item.contentName === pictureItem.contentName
-                              ) {
                              contentList.splice(index, 1);
                              return item;
                            }
@@ -827,28 +837,13 @@ class NewQuestionTab extends Component {
                      </span>
                    </div>
                  );
-                  }
                })}
              </div>
            )}
            {audioMediaList.length > 0 && (
              <div className="desc-audio-box">
                {_.map(audioMediaList, (audioItem, audioIndex) => {
-                  let { content, status, size } = audioItem;
+                  let { content, size } = audioItem;
-                  if (["init", "fail"].includes(status)) {
-                    return (
-                      <div className="mt12" key={audioIndex}>
-                        <UploadingProgress
-                          fileDesc={audioItem}
-                          canCancelUpload
-                          onReupload={() => this.handleReupload(audioItem)}
-                          onAbort={() =>
-                            this.handleAbort(audioItem, audioIndex)
-                          }
-                        />
-                      </div>
-                    );
-                  } else {
                  return (
                    <div className="audio-box" key={audioIndex}>
                      <XMAudio
@@ -877,28 +872,13 @@ class NewQuestionTab extends Component {
                      </span>
                    </div>
                  );
-                  }
                })}
              </div>
            )}
            {voiceMediaList.length > 0 && (
              <div className="desc-audio-box">
                {_.map(voiceMediaList, (voiceItem, voiceIndex) => {
-                  let { content, status, size } = voiceItem;
+                  let { content, size } = voiceItem;
-                  if (["init", "fail"].includes(status)) {
-                    return (
-                      <div className="mt12" key={voiceIndex}>
-                        <UploadingProgress
-                          fileDesc={voiceItem}
-                          canCancelUpload
-                          onReupload={() => this.handleReupload(voiceItem)}
-                          onAbort={() =>
-                            this.handleAbort(voiceItem, voiceIndex)
-                          }
-                        />
-                      </div>
-                    );
-                  } else {
                  return (
                    <div className="audio-box" key={voiceIndex}>
                      <XMAudio
@@ -927,28 +907,13 @@ class NewQuestionTab extends Component {
                      </span>
                    </div>
                  );
-                  }
                })}
              </div>
            )}
            {videoMediaList.length > 0 && (
              <div className="desc-video-box">
                {_.map(videoMediaList, (videoItem, videoIndex) => {
-                  let { content, status } = videoItem;
+                  let { content } = videoItem;
-                  if (["init", "fail"].includes(status)) {
-                    return (
-                      <div className="mt12" key={videoIndex}>
-                        <UploadingProgress
-                          fileDesc={videoItem}
-                          canCancelUpload
-                          onReupload={() => this.handleReupload(videoItem)}
-                          onAbort={() =>
-                            this.handleAbort(videoItem, videoIndex)
-                          }
-                        />
-                      </div>
-                    );
-                  } else {
                  return (
                    <div className="video-box" key={videoIndex}>
                      <img
@@ -976,27 +941,14 @@ class NewQuestionTab extends Component {
                      </span>
                    </div>
                  );
-                  }
                })}
              </div>
            )}
          </div>
        ) : (
          _.map(contentList, (contentItem, index) => {
-            const { type, content, status } = contentItem;
+            const { type, content } = contentItem;
            let dom = "";
-            if (["init", "fail"].includes(status)) {
-              return (
-                <div className="mt12" key={index}>
-                  <UploadingProgress
-                    fileDesc={contentItem}
-                    canCancelUpload
-                    onReupload={() => this.handleReupload(contentItem)}
-                    onAbort={() => this.handleAbort(contentItem, index)}
-                  />
-                </div>
-              );
-            }
            switch (type) {
              case "PICTURE":
                dom = (
@@ -1092,41 +1044,6 @@ class NewQuestionTab extends Component {
  };
  /**
-   * 重新上传
-   *
-   * @memberof QuestionInputItem
-   */
-  handleReupload = (uploadItem) => {
-    uploadItem.status = "init";
-    Upload.uploadToOSSEvent(
-      uploadItem.mediaFile,
-      uploadItem.contentName,
-      (url, xhr) => {
-        uploadItem.content = url;
-        uploadItem.xhr = xhr;
-      },
-      (event) => {
-        var percent = Math.floor((event.loaded / event.total) * 100);
-        uploadItem.progress = percent;
-        this._onSetState();
-      },
-      () => {
-        uploadItem.status = "success";
-        delete uploadItem.xhr;
-        delete uploadItem.progress;
-        delete uploadItem.mediaFile;
-        this._onSetState();
-      },
-      () => {
-        uploadItem.status = "fail";
-        uploadItem.progress = 0;
-        delete uploadItem.xhr;
-        this._onSetState();
-      }
-    );
-  };
-  /**
   * 取消上传
   *
   * @memberof QuestionInputItem
@@ -1204,7 +1121,7 @@ class NewQuestionTab extends Component {
        ，都应该成立党的基层组织
      </span>
    ) : (
-      "必填（1000字以内，可粘贴小图）"
+      "必填（1000字以内）"
    );
    let acceptType = "";
    let selectTypeList = [];
@@ -1248,14 +1165,12 @@ class NewQuestionTab extends Component {
              label={
                <span>
                  答案{" "}
-                  {blanksList.length === 0 && (
                  <span
                    className="icon iconfont"
                    style={{ color: "#BFBFBF", fontSize: 14 }}
                  >
                    &#xe7c4;
                  </span>
-                  )}
                </span>
              }
              required
@@ -1296,7 +1211,7 @@ class NewQuestionTab extends Component {
                  optionItem.optionSort = optionIndex;
                  const mediaBtn = ["VOICE", "AUDIO", "PICTURE"];
                  const placeHold =
-                    "必填（1000字以内，可粘贴小图；可以不输入文字，只添加音频或图片）";
+                    "必填（1000字以内；可以不输入文字，只添加音频或图片）";
                  return (
                    <div
                      className="question-item_options__content"
@@ -1422,7 +1337,7 @@ class NewQuestionTab extends Component {
            <div className="question-item_analysis__content">
              {this.renderContent(
                questionAnswerDesc,
-                "1000字以内，可粘贴小图",
+                "1000字以内",
                ["VOICE", "AUDIO", "PICTURE", "VIDEO"],
                "QUESTION_ANSWER_DESC"
              )}

--- a/src/modules/teach-tool/components/NewQuestionTab.less
+++ b/src/modules/teach-tool/components/NewQuestionTab.less
@@ -41,7 +41,7 @@
  .ant-form-item-explain,
  .ant-form-item-extra {
    font-size: 12px;
-    width: 70px;
+    width: 78px;
    min-height: 0;
  }
@@ -190,12 +190,16 @@
    &::before {
      content: attr(data-label);
      position: absolute;
-      left: 11px;
+      left: 15px;
      transform: translateY(-100%);
      font-size: 12px;
      color: #666666;
      line-height: 17px;
    }
+    .ant-radio-wrapper {
+      margin-right: 0;
+    }
  }
  .question-item_true-false {
@@ -263,8 +267,8 @@
    line-height: 44px;
    text-align: center;
    cursor: pointer;
-    margin-right: 187px;
+    margin-right: 109px;
-    margin-left: 22px;
+    margin-left: 106px;
  }
  .question-item_other {
@@ -397,16 +401,19 @@
        margin-right: 5px;
        border: 1px solid rgb(165, 165, 165);
      }
-      ::-webkit-input-placeholder { /* WebKit browsers */
+      ::-webkit-input-placeholder {
-        color: #FF4F4F;
+        /* WebKit browsers */
+        color: #ff4f4f;
      }
-      ::-moz-placeholder { /* Mozilla Firefox 19+ */
+      ::-moz-placeholder {
-        color: #FF4F4F;
+        /* Mozilla Firefox 19+ */
+        color: #ff4f4f;
      }
-      :-ms-input-placeholder { /* Internet Explorer 10+ */
+      :-ms-input-placeholder {
-        color: #FF4F4F;
+        /* Internet Explorer 10+ */
+        color: #ff4f4f;
      }
      .ant-input-affix-wrapper {
        border: none;

--- a/src/modules/teach-tool/components/QuestionBankSider.jsx
+++ b/src/modules/teach-tool/components/QuestionBankSider.jsx
@@ -2,7 +2,7 @@
 * @Author: yuananting
 * @Date: 2021-02-22 10:59:43
 * @LastEditors: yuananting
- * @LastEditTime: 2021-03-23 14:10:18
+ * @LastEditTime: 2021-03-23 16:28:35
 * @Description: 助学工具-题库-题库主页面侧边栏
 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
@@ -34,7 +34,7 @@ class QuestionBankSider extends Component {
  }
  componentDidMount() {
-    this.queryCategoryTree();
+    this.queryCategoryTree("change");
    this.props.getSelectedCategoryId(
      getParameterByName("categoryId")
        ? [getParameterByName("categoryId")]
@@ -48,7 +48,7 @@ class QuestionBankSider extends Component {
      this.props.currentTotal !== currentTotal &&
      this.props.updatedCategoryId === updatedCategoryId
    ) {
-      this.queryCategoryTree();
+      this.queryCategoryTree("remain");
    }
    return true;
  }
@@ -76,7 +76,7 @@ class QuestionBankSider extends Component {
  };
  // 查询分类树
-  queryCategoryTree = (categoryName) => {
+  queryCategoryTree = (type, categoryName) => {
    let query = {
      source: 0,
      categoryName,
@@ -96,7 +96,9 @@ class QuestionBankSider extends Component {
          Object.keys(this.state.treeMap).forEach((item) => {
            nodeId.push(item);
          });
+          if (type === "change") {
            this.setState({ expandedKeys: nodeId });
+          }
        } else {
          const defaultNode = {
            id: "0",
@@ -113,8 +115,10 @@ class QuestionBankSider extends Component {
          Object.keys(this.state.treeMap).forEach((item) => {
            nodeId.push(item);
          });
+          if (type === "change") {
            this.setState({ expandedKeys: nodeId });
          }
+        }
      } else {
        this.setState({ autoExpandParent: false });
        const defaultNode = {
@@ -128,8 +132,10 @@ class QuestionBankSider extends Component {
        this.setState({
          treeData: this.renderTreeNodes(categoryList, categoryName),
        });
+        if (type === "change") {
          this.setState({ expandedKeys: [] });
        }
+      }
    });
  };
@@ -192,7 +198,7 @@ class QuestionBankSider extends Component {
          placeholder="搜索名称分类"
          onSearch={(value) => {
            // TODO 调用查询分类接口
-            this.queryCategoryTree(value);
+            this.queryCategoryTree("change", value);
          }}
        />
        {User.getUserRole() !== "CloudLecturer" && (

--- a/src/modules/teach-tool/components/QuestionEditor.jsx
+++ b/src/modules/teach-tool/components/QuestionEditor.jsx
@@ -36,7 +36,6 @@ class QuestionEditor extends Component {
      focusFlag: false,
      isShowSingleInput: true,
      contentLength: 0,
-      errorInput: false,
      isGapFilling: props.isGapFilling,
      contentType: props.contentType,
      detailInfo: props.detailInfo || {},
@@ -102,7 +101,7 @@ class QuestionEditor extends Component {
      `#editor${editorId}_tabbar`,
      `#editor${editorId}_content`
    );
-    editorRoot.config.menus = ['image'];
+    editorRoot.config.menus = [];
    editorRoot.config.uploadImgMaxSize = 1 * 1024 * 1024;
    editorRoot.config.customAlert = function (info) {
      message.warning(/1M/.test(info) ? "图片大于1M，请使用图片上传" : info);
@@ -119,6 +118,7 @@ class QuestionEditor extends Component {
    editorRoot.config.zIndex = 999;
    editorRoot.config.placeholder = "";
    editorRoot.config.pasteFilterStyle = false;
+    editorRoot.config.pasteIgnoreImg = true;
    editorRoot.config.focus = false;
    // 自定义处理粘贴的文本内容
    editorRoot.config.pasteTextHandle = function (content) {
@@ -287,7 +287,6 @@ class QuestionEditor extends Component {
      focusFlag,
      contentLength,
      isShowSingleInput,
-      errorInput,
      isGapFilling,
      contentType,
    } = this.state;
@@ -329,7 +328,7 @@ class QuestionEditor extends Component {
          }
          style={{
            border:
-              this.props.validateStatus === "error" ? "1px solid red" : "",
+              this.props.validateStatus === "error" || contentLength > limitLength ? "1px solid red" : "",
          }}
        >
          <div
@@ -337,7 +336,7 @@ class QuestionEditor extends Component {
            id={`editor${editorId}_content`}
          ></div>
          <div className="editor-limit">
-            <span style={{ color: errorInput ? "red" : "" }}>
+            <span style={{ color: contentLength > limitLength ? "red" : "" }}>
              {contentLength}
            </span>
            /{limitLength}

--- a/src/modules/teach-tool/components/QuestionManageContent.jsx
+++ b/src/modules/teach-tool/components/QuestionManageContent.jsx
@@ -2,7 +2,7 @@
 * @Author: yuananting
 * @Date: 2021-02-25 11:23:47
 * @LastEditors: yuananting
- * @LastEditTime: 2021-03-23 14:13:11
+ * @LastEditTime: 2021-03-23 16:21:52
 * @Description: 助学工具-题库-题目管理主页面列表数据
 * @Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
@@ -102,7 +102,7 @@ class QuestionManageContent extends Component {
    return true;
  }
-  queryQuestionPageList = () => {
+  queryQuestionPageList = (remain) => {
    const _query = this.state.query;
    if (_query.categoryId === "0") _query.categoryId = null;
    QuestionBankService.queryQuestionPageList(_query).then((res) => {
@@ -145,9 +145,15 @@ class QuestionManageContent extends Component {
    QuestionBankService.deleteQuestion(params).then((res) => {
      if (res.success) {
        message.success("删除成功");
-        const _query = this.state.query;
+        const { query, total } = this.state;
+        const { size, current } = query;
+        const _query = query;
+        if (total / size < current) {
+          if (total % size === 1) {
            _query.current = 1;
-        this.setState({query: _query}, () => this.queryQuestionPageList())
+          }
+        }
+        this.setState({ query: _query }, () => this.queryQuestionPageList());
      }
    });
  };

--- a/src/modules/teach-tool/components/UploadingProgress.jsx
+++ b/src/modules/teach-tool/components/UploadingProgress.jsx
-/*
- * @Author: 陈剑宇
- * @Date: 2020-05-14 10:29:52
- * @LastEditTime: 2021-03-02 10:11:25
- * @LastEditors: yuananting
- * @Description: 上传文件进度
- * @FilePath: /xiaomai-web-b/app/modules/newAcademic_V5/punchClock/components/UploadingProgress.jsx
- * @Copyright © 2020 杭州杰竞科技有限公司 版权所有
- */
-import React, { Component } from "react";
-import { Tooltip } from 'antd';
-import {
-  FileVerifyMap,
-} from "@/common/constants/academic/lessonEnum";
-import './UploadingProgress.less';
-const FILE_ICON = {
-  WORD: 'https://image.xiaomaiketang.com/xm/5CCFBWrRMB.png',
-  PPT: 'https://image.xiaomaiketang.com/xm/3ypFCHEj3c.png',
-  EXCEL: 'https://image.xiaomaiketang.com/xm/AijpZjphPn.png',
-  PDF: 'https://image.xiaomaiketang.com/xm/3kZapsD3Pc.png',
-  VIDEO: 'https://image.xiaomaiketang.com/xm/rYCcpGaMW3.png',
-  VOICE: 'https://image.xiaomaiketang.com/xm/XT8eGhNhpb.png',
-  PICTURE: 'https://image.xiaomaiketang.com/xm/TXt5RHbFfF.png',
-  FAIL: 'https://image.xiaomaiketang.com/xm/EzmdwZz6mH.png'
-}
-const UPLOAD_FAIL = {
-  url: 'https://image.xiaomaiketang.com/xm/k8bynH452k.png',
-  title: '上传失败',
-}
-const UPLOAD_INIT = {
-  url: 'https://image.xiaomaiketang.com/xm/JbRFwhAaQ8.png',
-  title: '正在上传'
-}
-class UploadingProgress extends Component {
-  // 获取文件类型
-  getFileType(item) {
-    let fileEnum = 'FAIL';
-    if (FILE_ICON[item.contentType]) {
-      fileEnum = item.contentType;
-    } else if (FileVerifyMap[item.fileType] && FileVerifyMap[item.fileType].type) {
-      fileEnum = FileVerifyMap[item.fileType].type.toUpperCase()
-    }
-    return fileEnum;
-  }
-  render() {
-    const { fileDesc, fileDesc: { contentName, progress = 0, status = 'init' }, canCancelUpload, onAbort, onReupload } = this.props;
-    const isFail = status === 'fail';
-    const statusTips = isFail ? UPLOAD_FAIL : UPLOAD_INIT;
-    let imgUrl = (isFail && !canCancelUpload) ? FILE_ICON.FAIL : FILE_ICON[this.getFileType(fileDesc)];
-    return (
-      <div className="uploading-progress-box">
-        <div className="icon-box mr8">
-          <img src={imgUrl} alt="" />
-        </div>
-        <div className="file-box">
-          <div className="file-info">
-            <div className="file-title">{contentName}</div>
-            <div className="file-status">
-              <img src={statusTips.url} alt="" />
-              <span>{statusTips.title}</span>
-            </div>
-          </div>
-          {(!isFail || canCancelUpload) && <div className="file-progress-box">
-            <div className="file-progress" style={{ width: `${progress}%` }}></div>
-          </div>}
-        </div>
-        {canCancelUpload && ['init', 'fail'].includes(status) &&
-          <div className="file-extra-box">
-            <Tooltip title="取消上传"><span className="icon iconfont" onClick={() => onAbort && onAbort()} style={{transform:"scale(.8)"}}>&#xe6ef;</span></Tooltip>
-            {status === 'fail' && <Tooltip title='重新上传'><span className="icon iconfont" onClick={() => onReupload && onReupload()}>&#xe75a;</span></Tooltip>}
-          </div>
-        }
-      </div>
-    )
-  }
-}
-export default UploadingProgress;
\ No newline at end of file
--- a/src/modules/teach-tool/components/UploadingProgress.less
+++ b/src/modules/teach-tool/components/UploadingProgress.less
-.uploading-progress-box {
-  display: flex;
-  align-items: center;
-  .icon-box {
-    height: 44px;
-    width: 44px;
-    text-align: center;
-    img {
-      height: 100%;
-    }
-  }
-  .file-box {
-    width: 243px;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    line-height: unset;
-    .file- {
-      &info {
-        flex: 1;
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-      }
-      &title {
-        white-space: nowrap;
-        text-overflow: ellipsis;
-        overflow: hidden;
-        font-size: 12px;
-        color: #666666;
-        line-height: 17px;
-      }
-      &status {
-        flex-shrink: 0;
-        img {
-          width: 14px;
-          height: 14px;
-          font-size: 0;
-          margin-right: 4px;
-        }
-        span {
-          font-size: 12px;
-          color: #999999;
-          line-height: 17px;
-        }
-      }
-      &progress-box {
-        position: relative;
-        height: 4px;
-        border-radius: 2px;
-        background-color: #F0F2F5;
-        margin-top: 10px;
-      }
-      &progress {
-        position: absolute;
-        top: 0;
-        bottom: 0;
-        left: 0;
-        background-image: linear-gradient(90deg, #FBD140 0%, #FFA201 100%);
-        border-radius: inherit;
-      }
-    }
-  }
-  .file-extra-box {
-    margin-left: 40px;
-    .icon {
-      color: #BFBFBF;
-      font-size: 14px;
-      margin-left: 12px;
-      cursor: pointer;
-    }
-  }
-}
\ No newline at end of file