| | |
| | | <template> |
| | | <div v-show="dialogVisible && isShowActivityEditBox" class="draw-btn-box"> |
| | | <div class="left"> |
| | | <span @click="showEmitBox = !showEmitBox" class="emit-expend">{{showEmitBox? '收起': '展开'}}</span> |
| | | |
| | | <div v-show="showEmitBox" class="left"> |
| | | <h3>预案布置</h3> |
| | | <div> |
| | | <span>要素资源:</span> |
| | | <ul> |
| | | <li> |
| | | <button @click="drawThreeArrow('billboard', 'police', 'policeman')" title="警员"> |
| | | <button |
| | | @click="drawThreeArrow('billboard', 'police', 'policeman')" |
| | | title="警员" |
| | | > |
| | | <img src="/img/icon/police-people-btn.png" style="height:100%" /> |
| | | </button> |
| | | </li> |
| | | <li> |
| | | <button @click="drawThreeArrow('billboard', 'police', 'policecar')" title="警车"> |
| | | <button |
| | | @click="drawThreeArrow('billboard', 'police', 'policecar')" |
| | | title="警车" |
| | | > |
| | | <img src="/img/icon/car-btn.png" style="height:100%" /> |
| | | </button> |
| | | </li> |
| | | <li> |
| | | <button @click="drawThreeArrow('billboard', 'icon', 'icon4')" title="自定义图片标注">自定义图片标注</button> |
| | | <button |
| | | @click="drawThreeArrow('billboard', 'icon', 'icon4')" |
| | | title="自定义图片标注" |
| | | >自定义图片标注</button> |
| | | </li> |
| | | <li> |
| | | <button @click="drawThreeArrow('billboard', 'icon', 'icon5')" title="其他">其他</button> |
| | |
| | | <span>作战标绘:</span> |
| | | <ul> |
| | | <li> |
| | | <button @click="drawThreeArrow('polygon', 'polygon', 'polygon')" title="多边形">多边形</button> |
| | | <button |
| | | @click="drawThreeArrow('polygon', 'polygon', 'polygon')" |
| | | title="多边形" |
| | | >多边形</button> |
| | | </li> |
| | | <li> |
| | | <button @click="drawThreeArrow('brokenline', 'brokenline', 'brokenline')" title="折线">折线</button> |
| | | <button |
| | | @click="drawThreeArrow('brokenline', 'brokenline', 'brokenline')" |
| | | title="折线" |
| | | >折线</button> |
| | | </li> |
| | | </ul> |
| | | </div> |
| | |
| | | <li> |
| | | <!-- <el-button |
| | | ></el-button>--> |
| | | <button @click="drawThreeArrow('polyline', 'policecar', 'polyline')" title="巡逻路线"> |
| | | <button |
| | | @click="drawThreeArrow('polyline', 'policecar', 'polyline')" |
| | | title="巡逻路线" |
| | | > |
| | | <img src="/img/icon/route1.png" style="height:100%" /> |
| | | </button> |
| | | </li> |
| | |
| | | |
| | | data () { |
| | | return { |
| | | startDrawFlag: false |
| | | startDrawFlag: false, |
| | | showEmitBox: true |
| | | } |
| | | }, |
| | | |
| | |
| | | .draw-btn-box { |
| | | position: fixed; |
| | | display: flex; |
| | | // left: 50%; |
| | | bottom: 40px; |
| | | left: 50%; |
| | | bottom: 0px; |
| | | color: #fff; |
| | | background: $bg-one-color; |
| | | white-space: nowrap; |
| | | // transform: translate(-50%, 0); |
| | | transform: translate(-50%, 0); |
| | | |
| | | .emit-expend { |
| | | position: absolute; |
| | | top: 0; |
| | | left: 50%; |
| | | transform: translate(-50%, -100%); |
| | | width: 54px; |
| | | height: 28px; |
| | | line-height: 28px; |
| | | background: $bg-color; |
| | | cursor: pointer; |
| | | border-radius: 8px 8px 0 0; |
| | | } |
| | | |
| | | .left, |
| | | .right { |
| | | height: 100%; |
| | | |
| | | &>div { |
| | | & > div { |
| | | display: flex; |
| | | } |
| | | |