|
@@ -17,6 +17,19 @@
|
|
|
<div @click="lockItem" :title="isLock ? '锁定' : '解锁'">
|
|
|
<i class="el-icon-link" :style="{ color: isLock ? '#409EFF' : '', cursor: 'pointer' }"></i>
|
|
|
</div>
|
|
|
+ <div class="rotate">
|
|
|
+ <span>R</span>
|
|
|
+ <el-input
|
|
|
+ disabled
|
|
|
+ style="width: 74px; margin-left: 6px"
|
|
|
+ size="mini"
|
|
|
+ type="number"
|
|
|
+ v-model="rotate"
|
|
|
+ placeholder="输入角度"
|
|
|
+ >
|
|
|
+ <template slot="suffix">°</template>
|
|
|
+ </el-input>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</li>
|
|
|
<li class="m-picture">
|
|
@@ -137,6 +150,22 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
/**
|
|
|
+ * 图片角度
|
|
|
+ */
|
|
|
+ rotate: {
|
|
|
+ get() {
|
|
|
+ return this.ImageItem.rotate
|
|
|
+ },
|
|
|
+ set(newV) {
|
|
|
+ const oldV = this.ImageItem.rotate
|
|
|
+ // 宽度改变,修改对象的宽度
|
|
|
+ if (newV !== oldV) {
|
|
|
+ this.ImageItem.rotate = newV;
|
|
|
+ bus.$emit("undoAttr", this.ImageItem, "rotate", oldV, newV);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
* 边框线宽
|
|
|
*/
|
|
|
lineWidth: {
|
|
@@ -195,7 +224,9 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
- mounted() { },
|
|
|
+ mounted() {
|
|
|
+ console.log(this.ImageItem)
|
|
|
+ },
|
|
|
methods: {
|
|
|
/**
|
|
|
* 切换锁状态
|
|
@@ -334,6 +365,7 @@ li {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: space-around;
|
|
|
+ flex-wrap: wrap;
|
|
|
.color-box {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
@@ -367,6 +399,11 @@ li {
|
|
|
font-weight: 600;
|
|
|
margin-top: 4px;
|
|
|
}
|
|
|
+ .rotate {
|
|
|
+ flex-basis: 100%;
|
|
|
+ margin-left: 7px;
|
|
|
+ margin-top: 10px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
li.m-picture {
|