|
|
@@ -200,6 +200,7 @@ export default {
|
|
|
mapWidth: this.width,
|
|
|
mapHeight: this.height,
|
|
|
rate: this.rate,
|
|
|
+ mapRate: this.mapRate,
|
|
|
mapInfo: this.mapInfo.join(''),
|
|
|
};
|
|
|
|
|
|
@@ -226,42 +227,42 @@ export default {
|
|
|
</script>
|
|
|
<style lang="less" scoped>
|
|
|
.content {
|
|
|
- position: relative;
|
|
|
+ position: relative;
|
|
|
}
|
|
|
.dragContent {
|
|
|
- position: absolute;
|
|
|
- top: 60px;
|
|
|
- left: 0;
|
|
|
- border: 2px dashed #ccc;
|
|
|
- // cursor: move;
|
|
|
- z-index: 1;
|
|
|
- .gridInfo {
|
|
|
position: absolute;
|
|
|
- top: 0;
|
|
|
+ top: 60px;
|
|
|
left: 0;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- z-index: 3;
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
+ border: 2px dashed #ccc;
|
|
|
+ // cursor: move;
|
|
|
+ z-index: 1;
|
|
|
+ .gridInfo {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ z-index: 3;
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
|
|
|
- .grid-item {
|
|
|
- background-color: rgba(0, 0, 0, 0.3);
|
|
|
- box-sizing: border-box;
|
|
|
- border: 1px solid rgba(255, 255, 255, 1);
|
|
|
+ .grid-item {
|
|
|
+ background-color: rgba(0, 0, 0, 0.3);
|
|
|
+ box-sizing: border-box;
|
|
|
+ border: 1px solid rgba(255, 255, 255, 1);
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- .gridCanvas {
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- z-index: 3;
|
|
|
- }
|
|
|
+ .gridCanvas {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ z-index: 3;
|
|
|
+ }
|
|
|
}
|
|
|
.bgImg {
|
|
|
- position: relative;
|
|
|
- width: auto;
|
|
|
- z-index: 2;
|
|
|
+ position: relative;
|
|
|
+ width: auto;
|
|
|
+ z-index: 2;
|
|
|
}
|
|
|
</style>
|
