ydb-components-material 0.1.125 → 0.1.127

package/lib/components/guide-pc/components/basicInfo.js

@@ -26,69 +26,69 @@ var BasicInfo = function BasicInfo(_ref) {
     setItemBasic(eventInfo.itemBasic || {});
   }, [eventInfoProp]);
   return /*#__PURE__*/React.createElement("div", {
-    className: "basicInfo-content"
+    className: "pc-basicInfo-content"
   }, /*#__PURE__*/React.createElement(_guideTitle["default"], {
     title: "\u57FA\u672C\u4FE1\u606F"
   }), /*#__PURE__*/React.createElement("div", {
-    className: "inner"
+    className: "pc-inner"
   }, /*#__PURE__*/React.createElement("table", {
-    className: "info-table"
+    className: "pc-info-table"
   }, /*#__PURE__*/React.createElement("tbody", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u4E8B\u9879\u7F16\u7801"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, taskGeneralBasic.leadingCatalogCode || '-'), /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u5B9E\u65BD\u7F16\u7801/\u4E1A\u52A1\u529E\u7406\u9879\u7F16\u7801"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, itemBasic.taskHandleItem || '-')), /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u662F\u5426\u627F\u8BFA"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, taskGeneralBasic.projectTypeText || '-'), /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u662F\u5426\u6536\u8D39"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, taskGeneralExtend.isFeeText ? taskGeneralExtend.isFeeText === '是' ? '收费' : '不收费' : '不收费')), /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u627F\u8BFA\u529E\u7ED3\u65F6\u9650"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, taskGeneralExtend.promiseDay || '-', "\u5DE5\u4F5C\u65E5"), /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u6CD5\u5B9A\u529E\u7ED3\u65F6\u9650"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, taskGeneralExtend.anticipateDay || '-', "\u5DE5\u4F5C\u65E5")), /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u5230\u73B0\u573A\u6B21\u6570"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, taskGeneralExtend.workSceneNumber || '-', "\u6B21"), /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u5B9E\u65BD\u4E3B\u4F53"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, itemBasic.deptName || '-')), /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u670D\u52A1\u5BF9\u8C61"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, taskGeneralExtend.serviceObjectTypeText || '-'), /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u529E\u4E8B\u5730\u5740"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, taskGeneralExtend.transactAddr || '-')), /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u529E\u7406\u65F6\u95F4"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, taskGeneralExtend.transactTime || '-'), /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u54A8\u8BE2\u5730\u5740"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, taskGeneralExtend.seekWebsite || '-')), /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }, "\u54A8\u8BE2\u7535\u8BDD"), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }, taskGeneralExtend.seekPhone || '-'), /*#__PURE__*/React.createElement("td", {
-    className: "label"
+    className: "pc-label"
   }), /*#__PURE__*/React.createElement("td", {
-    className: "value"
+    className: "pc-value"
   }))))));
 };
 BasicInfo.displayName = 'BasicInfo';

package/lib/components/guide-pc/components/basicInfo.scss

@@ -1,9 +1,9 @@
-.basicInfo-content {
-  .inner {
+.pc-basicInfo-content {
+  .pc-inner {
     margin-top: 20px;
   }
 
-  .info-table {
+  .pc-info-table {
     width: 100%;
     border-collapse: collapse;
     border: 1px solid #e8e8e8;
@@ -15,7 +15,7 @@
       border: 1px solid #e8e8e8;
     }
 
-    .label {
+    .pc-label {
       background: #f7f8fa;
       font-weight: 500;
       color: #666666;
@@ -23,7 +23,7 @@
       white-space: nowrap;
     }
 
-    .value {
+    .pc-value {
       color: #222222;
     }
   }

package/lib/components/guide-pc/components/eventInfo.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import './eventInfo.scss';
+export interface EventInfoProps {
+    eventInfo?: any;
+}
+declare const EventInfo: React.FC<EventInfoProps>;
+export default EventInfo;

package/lib/components/guide-pc/components/eventInfo.js

@@ -0,0 +1,51 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports["default"] = void 0;
+var React = _interopRequireWildcard(require("react"));
+require("./eventInfo.scss");
+var _icon = _interopRequireDefault(require("../imgs/icon1.png"));
+var _icon2 = _interopRequireDefault(require("../imgs/icon2.png"));
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+var EventInfo = function EventInfo(_ref) {
+  var eventInfoProp = _ref.eventInfo;
+  var _React$useState = React.useState({}),
+    taskGeneralBasic = _React$useState[0],
+    setTaskGeneralBasic = _React$useState[1];
+  var _React$useState2 = React.useState({}),
+    taskGeneralExtend = _React$useState2[0],
+    setTaskGeneralExtend = _React$useState2[1];
+  React.useEffect(function () {
+    initData();
+  }, []);
+  var initData = function initData() {
+    var eventInfo = eventInfoProp;
+    if (!eventInfo) return;
+    var basic = eventInfo.taskGeneralBasic || {};
+    var extend = eventInfo.taskGeneralExtend || {};
+    setTaskGeneralBasic(basic);
+    setTaskGeneralExtend(extend);
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "pc-eventInfo-content"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "title"
+  }, taskGeneralBasic.taskHandleItemName), /*#__PURE__*/React.createElement("div", {
+    className: "info-con"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "info-item"
+  }, /*#__PURE__*/React.createElement("img", {
+    className: "icon",
+    src: _icon["default"],
+    alt: ""
+  }), "\u5B9E\u65BD\u4E3B\u4F53\uFF1A", eventInfoProp.itemBasic.deptName), /*#__PURE__*/React.createElement("div", {
+    className: "info-item"
+  }, /*#__PURE__*/React.createElement("img", {
+    className: "icon",
+    src: _icon2["default"],
+    alt: ""
+  }), "\u627F\u8BFA\u529E\u7ED3\u65F6\u9650\uFF1A", taskGeneralExtend.promiseDay)));
+};
+EventInfo.displayName = 'EventInfo';
+var _default = exports["default"] = EventInfo;

package/lib/components/guide-pc/components/eventInfo.scss

@@ -0,0 +1,36 @@
+.pc-eventInfo-content {
+  padding: 20px 24px;
+  margin-bottom: 16px;
+  border-radius: 8px;
+  opacity: 1;
+
+  background: #EEF5FF;
+
+  .title {
+    font-size: 16px;
+    line-height: 21px;
+    font-weight: 500;
+    color: #333333;
+  }
+
+  .info-con {
+    display: flex;
+    color: #666666;
+    font-size: 14px;
+    margin-top: 12px;
+    gap: 40px;
+
+    .info-item {
+      display: flex;
+      align-items: center;
+    }
+
+    .icon {
+      width: 16px;
+      height: 16px;
+      margin-right: 8px;
+
+    }
+  }
+
+}

package/lib/components/guide-pc/components/guideTabs.js

@@ -22,10 +22,10 @@ var GuideTabs = function GuideTabs(_ref) {
   var curTab = _ref.curTab,
     onTabsChange = _ref.onTabsChange;
   return /*#__PURE__*/React.createElement("div", {
-    className: "guideTabs-con"
+    className: "pc-guideTabs-con"
   }, tabList.map(function (item, index) {
     return /*#__PURE__*/React.createElement("div", {
-      className: "tab-item " + (curTab === index ? 'active' : ''),
+      className: "pc-tab-item " + (curTab === index ? 'active' : ''),
       key: index,
       onClick: function onClick() {
         return onTabsChange(index);

package/lib/components/guide-pc/components/guideTabs.scss

@@ -1,8 +1,8 @@
-.guideTabs-con {
+.pc-guideTabs-con {
   display: flex;
   border-bottom: 1px solid #e8e8e8;
 
-  .tab-item {
+  .pc-tab-item {
     flex: 1;
     padding: 14px 0;
     text-align: center;
@@ -19,6 +19,7 @@
     &.active {
       color: #1678FF;
       font-weight: 500;
+      background: #e2efff;
 
       &::after {
         content: '';

package/lib/components/guide-pc/components/guideTitle.js

@@ -11,15 +11,15 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 var GuideTitle = function GuideTitle(_ref) {
   var title = _ref.title;
   return /*#__PURE__*/React.createElement("div", {
-    className: "guideTitle-con"
+    className: "pc-guideTitle-con"
   }, /*#__PURE__*/React.createElement("img", {
-    className: "titleImg",
+    className: "pc-titleImg",
     src: _titleL["default"],
     alt: ""
   }), /*#__PURE__*/React.createElement("div", {
-    className: "titleText"
+    className: "pc-titleText"
   }, title), /*#__PURE__*/React.createElement("img", {
-    className: "titleImg",
+    className: "pc-titleImg",
     src: _titleR["default"],
     alt: ""
   }));

package/lib/components/guide-pc/components/guideTitle.scss

@@ -1,14 +1,14 @@
-.guideTitle-con {
+.pc-guideTitle-con {
   display: flex;
   justify-content: center;
   align-items: center;
 
-  .titleText {
+  .pc-titleText {
     font-size: 24px;
     font-weight: 500;
     margin: 0 10px;
   }
-  .titleImg {
+  .pc-titleImg {
     width: 20px;
     height: 21px;
   }

package/lib/components/guide-pc/components/materialsList.js

@@ -8,7 +8,6 @@ var _dialog = _interopRequireDefault(require("@alifd/next/lib/dialog"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _message = _interopRequireDefault(require("@alifd/next/lib/message"));
 var React = _interopRequireWildcard(require("react"));
-var _guideTitle = _interopRequireDefault(require("./guideTitle"));
 require("./materialsList.scss");
 var _api = require("../../../api.js");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t3 in e) "default" !== _t3 && {}.hasOwnProperty.call(e, _t3) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t3)) && (i.get || i.set) ? o(f, _t3, i) : f[_t3] = e[_t3]); return f; })(e, t); }
@@ -229,141 +228,139 @@ var MaterialsList = function MaterialsList(_ref) {
     return item.subMaterials && item.subMaterials.length > 0;
   };
   return /*#__PURE__*/React.createElement("div", {
-    className: "materialsList-content"
-  }, /*#__PURE__*/React.createElement(_guideTitle["default"], {
-    title: "\u6750\u6599\u6E05\u5355"
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "table-con"
+    className: "pc-materialsList-content"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "pc-table-con"
   }, /*#__PURE__*/React.createElement("table", {
-    className: "material-table"
+    className: "pc-material-table"
   }, /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("th", {
-    className: "col-name"
+    className: "pc-col-name"
   }, "\u6750\u6599\u540D\u79F0"), /*#__PURE__*/React.createElement("th", {
-    className: "col-type"
+    className: "pc-col-type"
   }, "\u6750\u6599\u5206\u7C7B"), /*#__PURE__*/React.createElement("th", {
-    className: "col-need"
+    className: "pc-col-need"
   }, "\u6750\u6599\u5FC5\u8981\u6027"), /*#__PURE__*/React.createElement("th", {
-    className: "col-sample"
+    className: "pc-col-sample"
   }, "\u6837\u8868"), /*#__PURE__*/React.createElement("th", {
-    className: "col-form"
+    className: "pc-col-form"
   }, "\u7A7A\u767D\u8868\u683C"), /*#__PURE__*/React.createElement("th", {
-    className: "col-check"
+    className: "pc-col-check"
   }, "\u5BA1\u67E5\u8981\u70B9"))), /*#__PURE__*/React.createElement("tbody", null, list.map(function (item, index) {
     return /*#__PURE__*/React.createElement(React.Fragment, {
       key: index
     }, /*#__PURE__*/React.createElement("tr", {
-      className: "data-row"
+      className: "pc-data-row"
     }, /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement("div", {
-      className: "material-name-cell"
+      className: "pc-material-name-cell"
     }, item.materialName)), /*#__PURE__*/React.createElement("td", {
-      className: "center"
+      className: "pc-center"
     }, !hasSubMaterials(item) && /*#__PURE__*/React.createElement("div", {
-      className: "type-btns"
+      className: "pc-type-btns"
     }, getFileType(item) === '智' && /*#__PURE__*/React.createElement("span", {
-      className: "type-tag type-tag-zhi",
+      className: "pc-type-tag pc-type-tag-zhi",
       onClick: function onClick() {
         return showTip('智');
       }
     }, "\u667A"), getFileType(item) === '享' && /*#__PURE__*/React.createElement("span", {
-      className: "type-tag type-tag-xiang",
+      className: "pc-type-tag pc-type-tag-xiang",
       onClick: function onClick() {
         return showTip('享');
       }
     }, "\u4EAB"), getFileType(item) === '自' && /*#__PURE__*/React.createElement("span", {
-      className: "type-tag type-tag-zi",
+      className: "pc-type-tag pc-type-tag-zi",
       onClick: function onClick() {
         return showTip('自');
       }
     }, "\u81EA"))), /*#__PURE__*/React.createElement("td", {
-      className: "center"
+      className: "pc-center"
     }, item.isNeed === '1' ? '必要' : '非必要'), /*#__PURE__*/React.createElement("td", {
-      className: "center"
+      className: "pc-center"
     }, !hasSubMaterials(item) && /*#__PURE__*/React.createElement("div", {
-      className: "link-list"
+      className: "pc-link-list"
     }, initMaterialExample(item).map(function (sub, si) {
       return /*#__PURE__*/React.createElement("span", {
-        className: "link",
+        className: "pc-link",
         key: si,
         onClick: function onClick() {
           return previewFile(sub);
         }
       }, sub.name);
     }))), /*#__PURE__*/React.createElement("td", {
-      className: "center"
+      className: "pc-center"
     }, /*#__PURE__*/React.createElement("div", {
-      className: "link-list"
+      className: "pc-link-list"
     }, initFormGuid(item).map(function (sub, si) {
       return /*#__PURE__*/React.createElement("span", {
-        className: "link",
+        className: "pc-link",
         key: si,
         onClick: function onClick() {
           return goDownLoad(sub);
         }
       }, sub.name);
     }))), /*#__PURE__*/React.createElement("td", {
-      className: "center"
+      className: "pc-center"
     }, item.keyPoint && /*#__PURE__*/React.createElement("span", {
-      className: "link",
+      className: "pc-link",
       onClick: function onClick() {
         return checkPoint(item);
       }
     }, "\u67E5\u770B"))), hasSubMaterials(item) && item.subMaterials.map(function (sub, si) {
       return /*#__PURE__*/React.createElement("tr", {
-        className: "data-row sub-row",
+        className: "pc-data-row pc-sub-row",
         key: "sub-" + si
       }, /*#__PURE__*/React.createElement("td", null, /*#__PURE__*/React.createElement("div", {
-        className: "material-name-cell sub-name"
+        className: "pc-material-name-cell pc-sub-name"
       }, /*#__PURE__*/React.createElement("span", {
-        className: "sub-indent"
+        className: "pc-sub-indent"
       }), sub.materialName)), /*#__PURE__*/React.createElement("td", {
-        className: "center"
+        className: "pc-center"
       }, /*#__PURE__*/React.createElement("div", {
-        className: "type-btns"
+        className: "pc-type-btns"
       }, getFileType(sub) === '智' && /*#__PURE__*/React.createElement("span", {
-        className: "type-tag type-tag-zhi",
+        className: "pc-type-tag pc-type-tag-zhi",
         onClick: function onClick() {
           return showTip('智');
         }
       }, "\u667A"), getFileType(sub) === '享' && /*#__PURE__*/React.createElement("span", {
-        className: "type-tag type-tag-xiang",
+        className: "pc-type-tag pc-type-tag-xiang",
         onClick: function onClick() {
           return showTip('享');
         }
       }, "\u4EAB"), getFileType(sub) === '自' && /*#__PURE__*/React.createElement("span", {
-        className: "type-tag type-tag-zi",
+        className: "pc-type-tag pc-type-tag-zi",
         onClick: function onClick() {
           return showTip('自');
         }
       }, "\u81EA"))), /*#__PURE__*/React.createElement("td", {
-        className: "center"
+        className: "pc-center"
       }, sub.isNeed === '1' ? '必要' : '非必要'), /*#__PURE__*/React.createElement("td", {
-        className: "center"
+        className: "pc-center"
       }, /*#__PURE__*/React.createElement("div", {
-        className: "link-list"
+        className: "pc-link-list"
       }, initMaterialExample(sub).map(function (s, sii) {
         return /*#__PURE__*/React.createElement("span", {
-          className: "link",
+          className: "pc-link",
           key: sii,
           onClick: function onClick() {
             return previewFile(s);
           }
         }, s.name);
       }))), /*#__PURE__*/React.createElement("td", {
-        className: "center"
+        className: "pc-center"
       }, /*#__PURE__*/React.createElement("div", {
-        className: "link-list"
+        className: "pc-link-list"
       }, initFormGuid(sub).map(function (s, sii) {
         return /*#__PURE__*/React.createElement("span", {
-          className: "link",
+          className: "pc-link",
           key: sii,
           onClick: function onClick() {
             return goDownLoad(s);
           }
         }, s.name);
       }))), /*#__PURE__*/React.createElement("td", {
-        className: "center"
+        className: "pc-center"
       }, sub.keyPoint && /*#__PURE__*/React.createElement("span", {
-        className: "link",
+        className: "pc-link",
         onClick: function onClick() {
           return checkPoint(sub);
         }
@@ -375,11 +372,11 @@ var MaterialsList = function MaterialsList(_ref) {
       return setPreviewShow(false);
     },
     footer: false,
-    className: "preview-dialog"
+    className: "pc-preview-dialog"
   }, /*#__PURE__*/React.createElement("div", {
-    className: "preview-inner"
+    className: "pc-preview-inner"
   }, previewLoading && /*#__PURE__*/React.createElement("div", {
-    className: "loading-con"
+    className: "pc-loading-con"
   }, "\u52A0\u8F7D\u4E2D..."), /*#__PURE__*/React.createElement("iframe", {
     id: "previewIframe",
     frameBorder: "0",

package/lib/components/guide-pc/components/materialsList.scss

@@ -1,12 +1,12 @@
-.materialsList-content {
+.pc-materialsList-content {
   padding-top: 20px;
 
-  .table-con {
+  .pc-table-con {
     margin-top: 20px;
     overflow-x: auto;
   }
 
-  .material-table {
+  .pc-material-table {
     width: 100%;
     border-collapse: collapse;
     border: 1px solid #e8e8e8;
@@ -43,23 +43,23 @@
       }
     }
 
-    .col-name { width: 110px; }
-    .col-type { width: 100px; text-align: center; }
-    .col-need { width: 100px; text-align: center; }
-    .col-sample { width: 120px; text-align: center; }
-    .col-form { width: 120px; text-align: center; }
-    .col-check { width: 100px; text-align: center; }
+    .pc-col-name { width: 110px; }
+    .pc-col-type { width: 100px; text-align: center; }
+    .pc-col-need { width: 100px; text-align: center; }
+    .pc-col-sample { width: 120px; text-align: center; }
+    .pc-col-form { width: 120px; text-align: center; }
+    .pc-col-check { width: 100px; text-align: center; }
 
-    .center {
+    .pc-center {
       text-align: center;
     }
 
-    .data-row {
+    .pc-data-row {
       &:nth-child(even) {
         background: #f7f8fa;
       }
 
-      &.sub-row {
+      &.pc-sub-row {
         td {
           padding-left: 16px;
           background: #fafbfc;
@@ -67,13 +67,13 @@
       }
     }
 
-    .material-name-cell {
+    .pc-material-name-cell {
       display: flex;
       align-items: center;
       gap: 8px;
 
-      &.sub-name {
-        .sub-indent {
+      &.pc-sub-name {
+        .pc-sub-indent {
           display: inline-block;
           width: 20px;
           flex-shrink: 0;
@@ -85,13 +85,13 @@
       }
     }
 
-    .type-btns {
+    .pc-type-btns {
       display: flex;
       justify-content: center;
       gap: 4px;
     }
 
-    .type-tag {
+    .pc-type-tag {
       display: inline-flex;
       width: 20px;
       height: 18px;
@@ -107,13 +107,13 @@
       &-xiang { background: #15BC83; }
     }
 
-    .link-list {
+    .pc-link-list {
       display: flex;
       flex-direction: column;
       gap: 4px;
     }
 
-    .link {
+    .pc-link {
       color: #1678FF;
       cursor: pointer;
       text-decoration: none;
@@ -124,12 +124,12 @@
     }
   }
 
-  .preview-dialog {
-    .preview-inner {
+  .pc-preview-dialog {
+    .pc-preview-inner {
       height: 800px;
       width: 100%;
 
-      .loading-con {
+      .pc-loading-con {
         text-align: center;
         padding: 40px;
         color: #999;