linkmore-design 1.1.8 → 1.1.10

package/lib/LmUpload/style/index.css

@@ -1,3 +1,121 @@
+.lm_image_viewer_wrapper {
+  position: fixed;
+  z-index: 1001;
+  inset: 0;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_mask {
+  position: absolute;
+  background-color: rgba(0, 0, 0, 0.5);
+  inset: 0;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container {
+  position: relative;
+  z-index: 2;
+  display: flex;
+  flex-flow: column;
+  gap: var(--gap);
+  align-items: center;
+  height: 100vh;
+  padding: 50px 0;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .preview_list {
+  flex: 1;
+  width: 51%;
+  max-height: 100%;
+  overflow: hidden;
+  touch-action: none;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .preview_list div {
+  height: 100%;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .preview_list .preview_item {
+  overflow: hidden;
+  text-align: center;
+  border-radius: 2px;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .preview_list .preview_item img {
+  display: inline-block;
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+  transition: 0.3s;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list {
+  display: flex;
+  gap: var(--gap);
+  width: 51%;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 98px;
+  height: 98px;
+  text-align: center;
+  background-color: var(--color-contrast);
+  border: 2px solid transparent;
+  border-radius: 2px;
+  transition: 0.3s;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item .thumb_item_icon {
+  color: var(--color-45);
+  font-size: 34px;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item img {
+  display: inline-block;
+  width: 94px;
+  height: 94px;
+  object-fit: cover;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item.active {
+  border-color: var(--primary-color);
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .image_viewer_action {
+  position: absolute;
+  bottom: 50px;
+  left: 50%;
+  display: flex;
+  gap: 24px;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 12px;
+  font-size: 24px;
+  background-color: #fff;
+  border-radius: 100px;
+  transform: translateX(-50%);
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .image_viewer_action .anticon {
+  cursor: pointer;
+  transition: 0.3s;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .image_viewer_action .anticon:hover {
+  color: var(--primary-color);
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .arrow {
+  position: absolute;
+  top: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 48px;
+  color: var(--color-contrast);
+  font-size: 32px;
+  background-color: var(--text-color);
+  transform: translateY(-50%);
+  cursor: pointer;
+  transition: 0.3s;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .arrow.arrow_left {
+  left: 40px;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .arrow.arrow_right {
+  right: 40px;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .arrow:hover {
+  color: var(--primary-color);
+}
 .lm_upload_wrapper {
   display: flex;
   flex-wrap: wrap;

package/lib/LmUpload/style/variables.css

@@ -1,3 +1,121 @@
+.lm_image_viewer_wrapper {
+  position: fixed;
+  z-index: 1001;
+  inset: 0;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_mask {
+  position: absolute;
+  background-color: rgba(0, 0, 0, 0.5);
+  inset: 0;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container {
+  position: relative;
+  z-index: 2;
+  display: flex;
+  flex-flow: column;
+  gap: var(--gap);
+  align-items: center;
+  height: 100vh;
+  padding: 50px 0;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .preview_list {
+  flex: 1;
+  width: 51%;
+  max-height: 100%;
+  overflow: hidden;
+  touch-action: none;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .preview_list div {
+  height: 100%;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .preview_list .preview_item {
+  overflow: hidden;
+  text-align: center;
+  border-radius: 2px;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .preview_list .preview_item img {
+  display: inline-block;
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+  transition: 0.3s;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list {
+  display: flex;
+  gap: var(--gap);
+  width: 51%;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 98px;
+  height: 98px;
+  text-align: center;
+  background-color: var(--color-contrast);
+  border: 2px solid transparent;
+  border-radius: 2px;
+  transition: 0.3s;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item .thumb_item_icon {
+  color: var(--color-45);
+  font-size: 34px;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item img {
+  display: inline-block;
+  width: 94px;
+  height: 94px;
+  object-fit: cover;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item.active {
+  border-color: var(--primary-color);
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .image_viewer_action {
+  position: absolute;
+  bottom: 50px;
+  left: 50%;
+  display: flex;
+  gap: 24px;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 12px;
+  font-size: 24px;
+  background-color: #fff;
+  border-radius: 100px;
+  transform: translateX(-50%);
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .image_viewer_action .anticon {
+  cursor: pointer;
+  transition: 0.3s;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .image_viewer_action .anticon:hover {
+  color: var(--primary-color);
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .arrow {
+  position: absolute;
+  top: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 48px;
+  color: var(--color-contrast);
+  font-size: 32px;
+  background-color: var(--text-color);
+  transform: translateY(-50%);
+  cursor: pointer;
+  transition: 0.3s;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .arrow.arrow_left {
+  left: 40px;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .arrow.arrow_right {
+  right: 40px;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .arrow:hover {
+  color: var(--primary-color);
+}
 .lm_upload_wrapper {
   display: flex;
   flex-wrap: wrap;

package/lib/LmUpload/wrapper/UploadWrapper.js

@@ -15,6 +15,8 @@ var _view = _interopRequireDefault(require("../view"));
 
 var _Crop = _interopRequireDefault(require("../components/Crop"));
 
+var _Preview = _interopRequireDefault(require("../components/Preview"));
+
 // 包裹上传组件区域： 拓展其他结构
 var LmUploadWrapper = function LmUploadWrapper(_ref) {
   var instance = _ref.instance;
@@ -26,6 +28,8 @@ var LmUploadWrapper = function LmUploadWrapper(_ref) {
     instance: instance
   }), /*#__PURE__*/_react.default.createElement(_Crop.default, {
     instance: instance
+  }), /*#__PURE__*/_react.default.createElement(_Preview.default, {
+    instance: instance
   }));
 };
 

package/lib/LmUpload/wrapper/reducer.d.ts

@@ -5,5 +5,9 @@ export declare const initialState: (props: any) => {
     status: string;
     fileList: any;
     cropFile: any;
+    preview: {
+        index: number;
+        visible: boolean;
+    };
 };
 export default reducer;

package/lib/LmUpload/wrapper/reducer.js

@@ -9,7 +9,8 @@ exports.reducer = exports.initialState = exports.default = void 0;
 var reducer = function reducer(state, action) {
   var fileList = action.fileList,
       percent = action.percent,
-      cropFile = action.cropFile;
+      cropFile = action.cropFile,
+      preview = action.preview;
 
   switch (action.type) {
     case 'changeFileList':
@@ -27,6 +28,11 @@ var reducer = function reducer(state, action) {
         cropFile: cropFile
       });
 
+    case 'changePreview':
+      return Object.assign(Object.assign({}, state), {
+        preview: Object.assign(Object.assign({}, state.preview), preview)
+      });
+
     default:
       throw new Error();
   }
@@ -43,8 +49,11 @@ var initialState = function initialState(props) {
     process: 0,
     status: 'done',
     fileList: defaultFileList,
-    cropFile: null // 需要裁剪的图片
-
+    cropFile: null,
+    preview: {
+      index: 0,
+      visible: false
+    }
   };
 };
 

package/lib/styles/variables.css

@@ -11266,6 +11266,9 @@ p {
   height: 48px;
   font-size: 12px;
 }
+#lm_protable_warp .ant-table-tbody > tr > .ant-table-selection-column {
+  text-align: left;
+}
 #lm_protable_warp .ant-table-tbody > tr.ant-table-measure-row > td {
   padding: 0 !important;
 }
@@ -11647,6 +11650,124 @@ button.ant-table-row-expand-icon::after {
 .WeChatContactsAvatarTools .rightClickItems:last-child {
   border-bottom: 0;
 }
+.lm_image_viewer_wrapper {
+  position: fixed;
+  z-index: 1001;
+  inset: 0;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_mask {
+  position: absolute;
+  background-color: rgba(0, 0, 0, 0.5);
+  inset: 0;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container {
+  position: relative;
+  z-index: 2;
+  display: flex;
+  flex-flow: column;
+  gap: var(--gap);
+  align-items: center;
+  height: 100vh;
+  padding: 50px 0;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .preview_list {
+  flex: 1;
+  width: 51%;
+  max-height: 100%;
+  overflow: hidden;
+  touch-action: none;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .preview_list div {
+  height: 100%;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .preview_list .preview_item {
+  overflow: hidden;
+  text-align: center;
+  border-radius: 2px;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .preview_list .preview_item img {
+  display: inline-block;
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+  transition: 0.3s;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list {
+  display: flex;
+  gap: var(--gap);
+  width: 51%;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 98px;
+  height: 98px;
+  text-align: center;
+  background-color: var(--color-contrast);
+  border: 2px solid transparent;
+  border-radius: 2px;
+  transition: 0.3s;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item .thumb_item_icon {
+  color: var(--color-45);
+  font-size: 34px;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item img {
+  display: inline-block;
+  width: 94px;
+  height: 94px;
+  object-fit: cover;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .thumb_list .thumb_item.active {
+  border-color: var(--primary-color);
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .image_viewer_action {
+  position: absolute;
+  bottom: 50px;
+  left: 50%;
+  display: flex;
+  gap: 24px;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 12px;
+  font-size: 24px;
+  background-color: #fff;
+  border-radius: 100px;
+  transform: translateX(-50%);
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .image_viewer_action .anticon {
+  cursor: pointer;
+  transition: 0.3s;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .image_viewer_action .anticon:hover {
+  color: var(--primary-color);
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .arrow {
+  position: absolute;
+  top: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 48px;
+  color: var(--color-contrast);
+  font-size: 32px;
+  background-color: var(--text-color);
+  transform: translateY(-50%);
+  cursor: pointer;
+  transition: 0.3s;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .arrow.arrow_left {
+  left: 40px;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .arrow.arrow_right {
+  right: 40px;
+}
+.lm_image_viewer_wrapper .lm_image_viewer_container .arrow:hover {
+  color: var(--primary-color);
+}
 .lm_upload_wrapper {
   display: flex;
   flex-wrap: wrap;

package/package.json

@@ -1,10 +1,14 @@
 {
   "name": "linkmore-design",
-  "version": "1.1.8",
+  "version": "1.1.10",
   "author": {
     "name": "nowthen",
     "email": "rnlvwyx@gmail.com"
   },
+  "repository": {
+    "type": "git",
+    "url": "https://gitlab.scm321.com/web-group/UFX.SCM.linkDesign.git"
+  },
   "main": "lib/index.js",
   "module": "es/index.js",
   "unpkg": "dist/index.umd.min.js",
@@ -37,7 +41,8 @@
     "pub": "npm run build && npm version patch && npm publish",
     "rbc": "parcel build src/styles/main.less --no-source-maps",
     "cssrb": "node ./config/css.js",
-    "rbuild": "npm run cssrb && npm run build && node ./config/copy.js"
+    "rbuild": "npm run cssrb && npm run build && node ./config/copy.js",
+    "changelog": "conventional-changelog -p react -i CHANGELOG.md -s -r 0"
   },
   "lint-staged": {
     "gitDir": "../",
@@ -67,6 +72,8 @@
     "antd-img-crop": "^4.2.5",
     "axios": "^0.21.0",
     "classnames": "^2.3.1",
+    "conventional-changelog": "^3.1.25",
+    "conventional-changelog-cli": "^2.2.2",
     "dayjs": "^1.9.7",
     "echarts": "^5.4.0",
     "hex-to-rgba": "^2.0.1",
@@ -103,7 +110,7 @@
     "@babel/plugin-transform-runtime": "^7.12.1",
     "@babel/preset-typescript": "^7.17.12",
     "@commitlint/cli": "^11.0.0",
-    "@commitlint/config-conventional": "^11.0.0",
+    "@linkmore/commitlint-config": "^1.0.2",
     "@types/react": "^18.0.19",
     "@types/react-dom": "^18.0.6",
     "autoprefixer": "^9.0.0",