bhd-components 0.9.19 → 0.9.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.esm.es5.development.css +24 -28
- package/dist/index.esm.es5.development.js +70 -24
- package/dist/index.esm.es5.production.css +1 -1
- package/dist/index.esm.es5.production.js +1 -1
- package/dist/vendor.esm.es5.development.js +1 -1
- package/dist/vendor.esm.es5.production.js +1 -1
- package/es2017/viewImage/index.js +69 -23
- package/es2017/viewImage/index.module.less +7 -7
- package/esm/viewImage/index.js +69 -23
- package/esm/viewImage/index.module.less +7 -7
- package/package.json +1 -1
|
@@ -4229,7 +4229,7 @@
|
|
|
4229
4229
|
"description": "图标，六级填充色"
|
|
4230
4230
|
}
|
|
4231
4231
|
*/
|
|
4232
|
-
.
|
|
4232
|
+
.index_module_AppViewImage__efd7e21c .bhd-modal {
|
|
4233
4233
|
width: 100% !important;
|
|
4234
4234
|
height: 100% !important;
|
|
4235
4235
|
min-height: 600px;
|
|
@@ -4238,29 +4238,29 @@
|
|
|
4238
4238
|
overflow: hidden;
|
|
4239
4239
|
max-width: none;
|
|
4240
4240
|
}
|
|
4241
|
-
.
|
|
4241
|
+
.index_module_AppViewImage__efd7e21c .bhd-modal .bhd-modal-content {
|
|
4242
4242
|
width: 100%;
|
|
4243
4243
|
height: 100%;
|
|
4244
4244
|
background: transparent;
|
|
4245
4245
|
box-shadow: none;
|
|
4246
4246
|
border-radius: none;
|
|
4247
4247
|
}
|
|
4248
|
-
.
|
|
4248
|
+
.index_module_AppViewImage__efd7e21c .bhd-modal .bhd-modal-content .bhd-modal-body {
|
|
4249
4249
|
width: 100%;
|
|
4250
4250
|
height: 100%;
|
|
4251
4251
|
padding: 0px;
|
|
4252
4252
|
}
|
|
4253
|
-
.
|
|
4253
|
+
.index_module_viewImgBody__efd7e21c {
|
|
4254
4254
|
display: flex;
|
|
4255
4255
|
width: 100%;
|
|
4256
4256
|
height: 100%;
|
|
4257
4257
|
}
|
|
4258
|
-
.
|
|
4258
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c {
|
|
4259
4259
|
width: 100%;
|
|
4260
4260
|
height: 100%;
|
|
4261
4261
|
position: relative;
|
|
4262
4262
|
}
|
|
4263
|
-
.
|
|
4263
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgAction__efd7e21c {
|
|
4264
4264
|
width: 100%;
|
|
4265
4265
|
display: flex;
|
|
4266
4266
|
position: absolute;
|
|
@@ -4271,11 +4271,11 @@
|
|
|
4271
4271
|
z-index: 10;
|
|
4272
4272
|
gap: 24px;
|
|
4273
4273
|
}
|
|
4274
|
-
.
|
|
4274
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgAction__efd7e21c.index_module_actionTop__efd7e21c {
|
|
4275
4275
|
top: 40px;
|
|
4276
4276
|
bottom: auto;
|
|
4277
4277
|
}
|
|
4278
|
-
.
|
|
4278
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgAction__efd7e21c > span {
|
|
4279
4279
|
display: flex;
|
|
4280
4280
|
width: 40px;
|
|
4281
4281
|
height: 40px;
|
|
@@ -4287,21 +4287,21 @@
|
|
|
4287
4287
|
cursor: pointer;
|
|
4288
4288
|
border-radius: 8px;
|
|
4289
4289
|
}
|
|
4290
|
-
.
|
|
4290
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgAction__efd7e21c > span:first-child {
|
|
4291
4291
|
margin-left: 0;
|
|
4292
4292
|
}
|
|
4293
|
-
.
|
|
4293
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgBody__efd7e21c {
|
|
4294
4294
|
width: 100%;
|
|
4295
4295
|
height: 100%;
|
|
4296
4296
|
display: flex;
|
|
4297
4297
|
align-items: center;
|
|
4298
4298
|
justify-content: center;
|
|
4299
4299
|
}
|
|
4300
|
-
.
|
|
4300
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgBody__efd7e21c .index_module_viewImgBody_load__efd7e21c {
|
|
4301
4301
|
width: 80px;
|
|
4302
4302
|
height: 80px;
|
|
4303
4303
|
}
|
|
4304
|
-
.
|
|
4304
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgBody__efd7e21c .index_module_viewImgBody_pic__efd7e21c {
|
|
4305
4305
|
max-width: 80%;
|
|
4306
4306
|
max-height: 80%;
|
|
4307
4307
|
cursor: move;
|
|
@@ -4310,14 +4310,10 @@
|
|
|
4310
4310
|
-moz-user-select: none;
|
|
4311
4311
|
user-select: none;
|
|
4312
4312
|
}
|
|
4313
|
-
.
|
|
4314
|
-
width: 100%;
|
|
4315
|
-
height: 100%;
|
|
4316
|
-
}
|
|
4317
|
-
.index_module_viewImgBody__3145c517 .index_module_viewImgContent__3145c517 .index_module_viewImgBody__3145c517 .index_module_viewImgActionClose__3145c517 {
|
|
4313
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgBody__efd7e21c .index_module_viewImgActionClose__efd7e21c {
|
|
4318
4314
|
position: absolute;
|
|
4319
|
-
top:
|
|
4320
|
-
right:
|
|
4315
|
+
top: 40px;
|
|
4316
|
+
right: 40px;
|
|
4321
4317
|
display: flex;
|
|
4322
4318
|
width: 40px;
|
|
4323
4319
|
height: 40px;
|
|
@@ -4329,7 +4325,7 @@
|
|
|
4329
4325
|
cursor: pointer;
|
|
4330
4326
|
border-radius: 8px;
|
|
4331
4327
|
}
|
|
4332
|
-
.
|
|
4328
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgBody__efd7e21c .index_module_viewImgBody_pre__efd7e21c {
|
|
4333
4329
|
position: absolute;
|
|
4334
4330
|
width: 40px;
|
|
4335
4331
|
height: 40px;
|
|
@@ -4350,7 +4346,7 @@
|
|
|
4350
4346
|
left: 40px;
|
|
4351
4347
|
border-radius: 50%;
|
|
4352
4348
|
}
|
|
4353
|
-
.
|
|
4349
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgBody__efd7e21c .index_module_viewImgBody_next__efd7e21c {
|
|
4354
4350
|
position: absolute;
|
|
4355
4351
|
width: 40px;
|
|
4356
4352
|
height: 40px;
|
|
@@ -4371,7 +4367,7 @@
|
|
|
4371
4367
|
right: 40px;
|
|
4372
4368
|
border-radius: 50%;
|
|
4373
4369
|
}
|
|
4374
|
-
.
|
|
4370
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgBodyScale__efd7e21c {
|
|
4375
4371
|
box-sizing: border-box;
|
|
4376
4372
|
display: inline-flex;
|
|
4377
4373
|
align-items: center;
|
|
@@ -4382,8 +4378,8 @@
|
|
|
4382
4378
|
z-index: 10;
|
|
4383
4379
|
gap: 4px;
|
|
4384
4380
|
}
|
|
4385
|
-
.
|
|
4386
|
-
.
|
|
4381
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgBodyScale__efd7e21c .index_module_viewImgBodyScale_minu__efd7e21c,
|
|
4382
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgBodyScale__efd7e21c .index_module_viewImgBodyScale_add__efd7e21c {
|
|
4387
4383
|
width: 40px;
|
|
4388
4384
|
height: 40px;
|
|
4389
4385
|
display: flex;
|
|
@@ -4394,13 +4390,13 @@
|
|
|
4394
4390
|
background-color: rgba(0, 0, 0, 0.45);
|
|
4395
4391
|
cursor: pointer;
|
|
4396
4392
|
}
|
|
4397
|
-
.
|
|
4393
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgBodyScale__efd7e21c .index_module_viewImgBodyScale_minu__efd7e21c {
|
|
4398
4394
|
border-radius: 4px 0 0 4px;
|
|
4399
4395
|
}
|
|
4400
|
-
.
|
|
4396
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgBodyScale__efd7e21c .index_module_viewImgBodyScale_add__efd7e21c {
|
|
4401
4397
|
border-radius: 0 4px 4px 0;
|
|
4402
4398
|
}
|
|
4403
|
-
.
|
|
4399
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgContent__efd7e21c .index_module_viewImgBodyScale__efd7e21c .index_module_viewImgBodyScale_value__efd7e21c {
|
|
4404
4400
|
width: 80px;
|
|
4405
4401
|
height: 40px;
|
|
4406
4402
|
border-left: 1px solid rgba(255, 255, 255, 0.25);
|
|
@@ -4416,7 +4412,7 @@
|
|
|
4416
4412
|
-moz-user-select: none;
|
|
4417
4413
|
user-select: none;
|
|
4418
4414
|
}
|
|
4419
|
-
.
|
|
4415
|
+
.index_module_viewImgBody__efd7e21c .index_module_viewImgInfo__efd7e21c {
|
|
4420
4416
|
height: 100%;
|
|
4421
4417
|
flex-shrink: 0;
|
|
4422
4418
|
background: #ffffff;
|
|
@@ -1420,7 +1420,7 @@ var TitleBar = function(props) {
|
|
|
1420
1420
|
};
|
|
1421
1421
|
var TitleBar$1 = TitleBar;
|
|
1422
1422
|
|
|
1423
|
-
var modules_63b47c51$5 = {"AppViewImage":"
|
|
1423
|
+
var modules_63b47c51$5 = {"AppViewImage":"index_module_AppViewImage__efd7e21c","viewImgBody":"index_module_viewImgBody__efd7e21c","viewImgContent":"index_module_viewImgContent__efd7e21c","viewImgAction":"index_module_viewImgAction__efd7e21c","actionTop":"index_module_actionTop__efd7e21c","viewImgBody_load":"index_module_viewImgBody_load__efd7e21c","viewImgBody_pic":"index_module_viewImgBody_pic__efd7e21c","viewImgActionClose":"index_module_viewImgActionClose__efd7e21c","viewImgBody_pre":"index_module_viewImgBody_pre__efd7e21c","viewImgBody_next":"index_module_viewImgBody_next__efd7e21c","viewImgBodyScale":"index_module_viewImgBodyScale__efd7e21c","viewImgBodyScale_minu":"index_module_viewImgBodyScale_minu__efd7e21c","viewImgBodyScale_add":"index_module_viewImgBodyScale_add__efd7e21c","viewImgBodyScale_value":"index_module_viewImgBodyScale_value__efd7e21c","viewImgInfo":"index_module_viewImgInfo__efd7e21c"};
|
|
1424
1424
|
|
|
1425
1425
|
//获取css样式
|
|
1426
1426
|
var getStyle = function getStyle(dom, key) {
|
|
@@ -1691,15 +1691,24 @@ var ViewImage = /*#__PURE__*/ function(_React_Component) {
|
|
|
1691
1691
|
});
|
|
1692
1692
|
_define_property(_assert_this_initialized(_this), "moveActionClose", function() {
|
|
1693
1693
|
setTimeout(function() {
|
|
1694
|
-
var
|
|
1695
|
-
if (
|
|
1696
|
-
|
|
1697
|
-
|
|
1698
|
-
|
|
1699
|
-
|
|
1700
|
-
|
|
1701
|
-
|
|
1702
|
-
|
|
1694
|
+
var pic = document.getElementById("viewImgBody_pic");
|
|
1695
|
+
if (pic) {
|
|
1696
|
+
var rect = pic.getBoundingClientRect();
|
|
1697
|
+
if (rect.top >= 0 && rect.top <= (window.innerHeight || document.documentElement.clientHeight) - 40 && rect.right <= (window.innerWidth || document.documentElement.clientWidth) - 52) {
|
|
1698
|
+
_this.setState({
|
|
1699
|
+
actionCloseFlag: 0
|
|
1700
|
+
}, function() {
|
|
1701
|
+
var actionCloseDom = document.getElementById("actionClose");
|
|
1702
|
+
if (actionCloseDom) {
|
|
1703
|
+
actionCloseDom.style.top = rect.top + "px";
|
|
1704
|
+
actionCloseDom.style.left = rect.left + rect.width + 12 + "px";
|
|
1705
|
+
}
|
|
1706
|
+
});
|
|
1707
|
+
} else {
|
|
1708
|
+
_this.setState({
|
|
1709
|
+
actionCloseFlag: 1
|
|
1710
|
+
});
|
|
1711
|
+
}
|
|
1703
1712
|
}
|
|
1704
1713
|
}, 10);
|
|
1705
1714
|
});
|
|
@@ -1847,11 +1856,15 @@ var ViewImage = /*#__PURE__*/ function(_React_Component) {
|
|
|
1847
1856
|
imgTop: "auto",
|
|
1848
1857
|
rotateValue: 0,
|
|
1849
1858
|
scaleValue: 100
|
|
1859
|
+
}, function() {
|
|
1860
|
+
_this.moveActionClose();
|
|
1850
1861
|
});
|
|
1851
1862
|
});
|
|
1852
1863
|
_define_property(_assert_this_initialized(_this), "rotate", function() {
|
|
1853
1864
|
_this.setState({
|
|
1854
1865
|
rotateValue: _this.state.rotateValue + 90
|
|
1866
|
+
}, function() {
|
|
1867
|
+
_this.moveActionClose();
|
|
1855
1868
|
});
|
|
1856
1869
|
});
|
|
1857
1870
|
_define_property(_assert_this_initialized(_this), "close", function() {
|
|
@@ -1895,6 +1908,10 @@ var ViewImage = /*#__PURE__*/ function(_React_Component) {
|
|
|
1895
1908
|
_this1.setState({
|
|
1896
1909
|
imgSrc: src,
|
|
1897
1910
|
loading: false
|
|
1911
|
+
}, function() {
|
|
1912
|
+
setTimeout(function() {
|
|
1913
|
+
_this1.moveActionClose();
|
|
1914
|
+
}, 100);
|
|
1898
1915
|
});
|
|
1899
1916
|
return [
|
|
1900
1917
|
2
|
|
@@ -1953,11 +1970,15 @@ var ViewImage = /*#__PURE__*/ function(_React_Component) {
|
|
|
1953
1970
|
_define_property(_assert_this_initialized(_this), "imgLoad", function() {
|
|
1954
1971
|
_this.setState({
|
|
1955
1972
|
imgError: false
|
|
1973
|
+
}, function() {
|
|
1974
|
+
_this.moveActionClose();
|
|
1956
1975
|
});
|
|
1957
1976
|
});
|
|
1958
1977
|
_define_property(_assert_this_initialized(_this), "imgErr", function() {
|
|
1959
1978
|
_this.setState({
|
|
1960
1979
|
imgError: true
|
|
1980
|
+
}, function() {
|
|
1981
|
+
_this.moveActionClose();
|
|
1961
1982
|
});
|
|
1962
1983
|
});
|
|
1963
1984
|
return _this;
|
|
@@ -1980,6 +2001,7 @@ var ViewImage = /*#__PURE__*/ function(_React_Component) {
|
|
|
1980
2001
|
document.oncontextmenu = function() {
|
|
1981
2002
|
return false;
|
|
1982
2003
|
};
|
|
2004
|
+
this.moveActionClose();
|
|
1983
2005
|
}
|
|
1984
2006
|
},
|
|
1985
2007
|
{
|
|
@@ -2066,33 +2088,57 @@ var ViewImage = /*#__PURE__*/ function(_React_Component) {
|
|
|
2066
2088
|
color: "#FFFFFF"
|
|
2067
2089
|
},
|
|
2068
2090
|
children: imgSrc ? "图片加载错误" : "暂无内容"
|
|
2069
|
-
}) :
|
|
2070
|
-
|
|
2071
|
-
|
|
2072
|
-
|
|
2073
|
-
|
|
2074
|
-
|
|
2075
|
-
|
|
2076
|
-
|
|
2091
|
+
}) : // <div onMouseDown={this.moveImg}
|
|
2092
|
+
// style={{
|
|
2093
|
+
// transform: `scale(${scaleValue / 100},${
|
|
2094
|
+
// scaleValue / 100
|
|
2095
|
+
// })`,
|
|
2096
|
+
// left: imgLeft == "auto" ? "auto" : imgLeft + "px",
|
|
2097
|
+
// top: imgTop == "auto" ? "auto" : imgTop + "px",
|
|
2098
|
+
// }}
|
|
2099
|
+
// className={styles.viewImgBody_pic}>
|
|
2100
|
+
// <img
|
|
2101
|
+
// id="viewImgBody_pic"
|
|
2102
|
+
// key="img"
|
|
2103
|
+
// src={imgSrc}
|
|
2104
|
+
// alt="图片加载错误"
|
|
2105
|
+
// draggable="false"
|
|
2106
|
+
// style={{transform:`rotate(${rotateValue}deg)`}}
|
|
2107
|
+
// onLoad={this.imgLoad}
|
|
2108
|
+
// onError={this.imgErr}
|
|
2109
|
+
// />
|
|
2110
|
+
// {
|
|
2111
|
+
// this.state.actionCloseFlag===0&&(
|
|
2112
|
+
// <span
|
|
2113
|
+
// id="actionClose"
|
|
2114
|
+
// style={{right:`calc(-40px + (-12px * (1 / ${scaleValue / 100}) ))` ,transform: `scale(calc(1 / ${scaleValue / 100}),calc(1 / ${scaleValue / 100}))`,transformOrigin: `top left`}}
|
|
2115
|
+
// className={styles.viewImgActionClose}
|
|
2116
|
+
// title="关闭"
|
|
2117
|
+
// onClick={this.close}>
|
|
2118
|
+
// <CustomClose />
|
|
2119
|
+
// </span>
|
|
2120
|
+
// )
|
|
2121
|
+
// }
|
|
2122
|
+
// </div>
|
|
2123
|
+
/*#__PURE__*/ jsxs(Fragment, {
|
|
2077
2124
|
children: [
|
|
2078
2125
|
/*#__PURE__*/ jsx("img", {
|
|
2079
2126
|
id: "viewImgBody_pic",
|
|
2080
2127
|
src: imgSrc,
|
|
2081
2128
|
alt: "图片加载错误",
|
|
2082
2129
|
draggable: "false",
|
|
2130
|
+
onMouseDown: this.moveImg,
|
|
2083
2131
|
style: {
|
|
2084
|
-
transform: "rotate(".concat(rotateValue, "deg)")
|
|
2132
|
+
transform: "scale(".concat(scaleValue / 100, ",").concat(scaleValue / 100, ") rotate(").concat(rotateValue, "deg)"),
|
|
2133
|
+
left: imgLeft == "auto" ? "auto" : imgLeft + "px",
|
|
2134
|
+
top: imgTop == "auto" ? "auto" : imgTop + "px"
|
|
2085
2135
|
},
|
|
2136
|
+
className: modules_63b47c51$5.viewImgBody_pic,
|
|
2086
2137
|
onLoad: this.imgLoad,
|
|
2087
2138
|
onError: this.imgErr
|
|
2088
2139
|
}, "img"),
|
|
2089
2140
|
this.state.actionCloseFlag === 0 && /*#__PURE__*/ jsx("span", {
|
|
2090
2141
|
id: "actionClose",
|
|
2091
|
-
style: {
|
|
2092
|
-
right: "calc(-40px + (-12px * (1 / ".concat(scaleValue / 100, ") ))"),
|
|
2093
|
-
transform: "scale(calc(1 / ".concat(scaleValue / 100, "),calc(1 / ").concat(scaleValue / 100, "))"),
|
|
2094
|
-
transformOrigin: "top left"
|
|
2095
|
-
},
|
|
2096
2142
|
className: modules_63b47c51$5.viewImgActionClose,
|
|
2097
2143
|
title: "关闭",
|
|
2098
2144
|
onClick: this.close,
|