Commit 6fb5d5e7 authored by 郭铭瑶's avatar 郭铭瑶 🤘

地图操作调整

parent 6b27acc3
<!DOCTYPE html><html id=html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><meta http-equiv=X-UA-Compatible content="IE=edge, chrome=1"><title>物业督查实时专题图</title><style>html {
font-size: 1.6vh;
}</style><script src=./static/jquery.min.js></script><script type=text/javascript src=http://192.168.104.33:8181/smimap/ShsmiGis.Bridge.js></script><link href=./static/css/app.5194c5d6c21fd8406c2b093279413abc.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.4c391a2cafa7f6ad6c5e.js></script><script type=text/javascript src=./static/js/vendor.dc1ed2d0549b6d6f959d.js></script><script type=text/javascript src=./static/js/app.43314a18dacb730c78d6.js></script></body></html>
\ No newline at end of file
}</style><script src=./static/jquery.min.js></script><script type=text/javascript src=http://192.168.104.33:8181/smimap/ShsmiGis.Bridge.js></script><link href=./static/css/app.328582472efdd30f1e87f2dfe3309e80.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.4ae339ed147562afff89.js></script><script type=text/javascript src=./static/js/vendor.dc1ed2d0549b6d6f959d.js></script><script type=text/javascript src=./static/js/app.47070a447eb567d2d706.js></script></body></html>
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
!function(e){var n=window.webpackJsonp;window.webpackJsonp=function(r,c,i){for(var u,a,f,s=0,l=[];s<r.length;s++)a=r[s],t[a]&&l.push(t[a][0]),t[a]=0;for(u in c)Object.prototype.hasOwnProperty.call(c,u)&&(e[u]=c[u]);for(n&&n(r,c,i);l.length;)l.shift()();if(i)for(s=0;s<i.length;s++)f=o(o.s=i[s]);return f};var r={},t={3:0};function o(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,o),t.l=!0,t.exports}o.e=function(e){var n=t[e];if(0===n)return new Promise(function(e){e()});if(n)return n[2];var r=new Promise(function(r,o){n=t[e]=[r,o]});n[2]=r;var c=document.getElementsByTagName("head")[0],i=document.createElement("script");i.type="text/javascript",i.charset="utf-8",i.async=!0,i.timeout=12e4,o.nc&&i.setAttribute("nonce",o.nc),i.src=o.p+"static/js/"+e+"."+{0:"0f8894cb520c0442c384"}[e]+".js";var u=setTimeout(a,12e4);function a(){i.onerror=i.onload=null,clearTimeout(u);var n=t[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),t[e]=void 0)}return i.onerror=i.onload=a,c.appendChild(i),r},o.m=e,o.c=r,o.d=function(e,n,r){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="./",o.oe=function(e){throw console.error(e),e}}([]);
//# sourceMappingURL=manifest.4c391a2cafa7f6ad6c5e.js.map
\ No newline at end of file
!function(e){var n=window.webpackJsonp;window.webpackJsonp=function(r,c,i){for(var u,a,f,s=0,l=[];s<r.length;s++)a=r[s],t[a]&&l.push(t[a][0]),t[a]=0;for(u in c)Object.prototype.hasOwnProperty.call(c,u)&&(e[u]=c[u]);for(n&&n(r,c,i);l.length;)l.shift()();if(i)for(s=0;s<i.length;s++)f=o(o.s=i[s]);return f};var r={},t={3:0};function o(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,o),t.l=!0,t.exports}o.e=function(e){var n=t[e];if(0===n)return new Promise(function(e){e()});if(n)return n[2];var r=new Promise(function(r,o){n=t[e]=[r,o]});n[2]=r;var c=document.getElementsByTagName("head")[0],i=document.createElement("script");i.type="text/javascript",i.charset="utf-8",i.async=!0,i.timeout=12e4,o.nc&&i.setAttribute("nonce",o.nc),i.src=o.p+"static/js/"+e+"."+{0:"6242496c6168188d415e"}[e]+".js";var u=setTimeout(a,12e4);function a(){i.onerror=i.onload=null,clearTimeout(u);var n=t[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),t[e]=void 0)}return i.onerror=i.onload=a,c.appendChild(i),r},o.m=e,o.c=r,o.d=function(e,n,r){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="./",o.oe=function(e){throw console.error(e),e}}([]);
//# sourceMappingURL=manifest.4ae339ed147562afff89.js.map
\ No newline at end of file
src/assets/images/bottom.png

22.9 KB | W: | H:

src/assets/images/bottom.png

3.74 KB | W: | H:

src/assets/images/bottom.png
src/assets/images/bottom.png
src/assets/images/bottom.png
src/assets/images/bottom.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/complete.png

5.11 KB | W: | H:

src/assets/images/complete.png

1.5 KB | W: | H:

src/assets/images/complete.png
src/assets/images/complete.png
src/assets/images/complete.png
src/assets/images/complete.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/full.png

13.9 KB | W: | H:

src/assets/images/full.png

2.76 KB | W: | H:

src/assets/images/full.png
src/assets/images/full.png
src/assets/images/full.png
src/assets/images/full.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/minus.png

12.4 KB | W: | H:

src/assets/images/minus.png

2.27 KB | W: | H:

src/assets/images/minus.png
src/assets/images/minus.png
src/assets/images/minus.png
src/assets/images/minus.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/modal-bottom.png

32 KB | W: | H:

src/assets/images/modal-bottom.png

5.44 KB | W: | H:

src/assets/images/modal-bottom.png
src/assets/images/modal-bottom.png
src/assets/images/modal-bottom.png
src/assets/images/modal-bottom.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/modal-close.png

8.39 KB | W: | H:

src/assets/images/modal-close.png

2.16 KB | W: | H:

src/assets/images/modal-close.png
src/assets/images/modal-close.png
src/assets/images/modal-close.png
src/assets/images/modal-close.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/modal-top.png

31.7 KB | W: | H:

src/assets/images/modal-top.png

5.52 KB | W: | H:

src/assets/images/modal-top.png
src/assets/images/modal-top.png
src/assets/images/modal-top.png
src/assets/images/modal-top.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/person-bg.png

8.01 KB | W: | H:

src/assets/images/person-bg.png

1.99 KB | W: | H:

src/assets/images/person-bg.png
src/assets/images/person-bg.png
src/assets/images/person-bg.png
src/assets/images/person-bg.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/person-bg2.png

5.75 KB | W: | H:

src/assets/images/person-bg2.png

1.45 KB | W: | H:

src/assets/images/person-bg2.png
src/assets/images/person-bg2.png
src/assets/images/person-bg2.png
src/assets/images/person-bg2.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/person.png

5.11 KB | W: | H:

src/assets/images/person.png

1.72 KB | W: | H:

src/assets/images/person.png
src/assets/images/person.png
src/assets/images/person.png
src/assets/images/person.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/plus.png

12.5 KB | W: | H:

src/assets/images/plus.png

2.55 KB | W: | H:

src/assets/images/plus.png
src/assets/images/plus.png
src/assets/images/plus.png
src/assets/images/plus.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/rectify.png

5.87 KB | W: | H:

src/assets/images/rectify.png

1.85 KB | W: | H:

src/assets/images/rectify.png
src/assets/images/rectify.png
src/assets/images/rectify.png
src/assets/images/rectify.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/refresh.png

16.8 KB | W: | H:

src/assets/images/refresh.png

3.59 KB | W: | H:

src/assets/images/refresh.png
src/assets/images/refresh.png
src/assets/images/refresh.png
src/assets/images/refresh.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/search.png

14.5 KB | W: | H:

src/assets/images/search.png

3 KB | W: | H:

src/assets/images/search.png
src/assets/images/search.png
src/assets/images/search.png
src/assets/images/search.png
  • 2-up
  • Swipe
  • Onion skin
This diff is collapsed.
src/assets/images/theme.png

4.35 KB | W: | H:

src/assets/images/theme.png

1.42 KB | W: | H:

src/assets/images/theme.png
src/assets/images/theme.png
src/assets/images/theme.png
src/assets/images/theme.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/title-arrow.png

7.87 KB | W: | H:

src/assets/images/title-arrow.png

2.23 KB | W: | H:

src/assets/images/title-arrow.png
src/assets/images/title-arrow.png
src/assets/images/title-arrow.png
src/assets/images/title-arrow.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/title-bg.png

626 KB | W: | H:

src/assets/images/title-bg.png

118 KB | W: | H:

src/assets/images/title-bg.png
src/assets/images/title-bg.png
src/assets/images/title-bg.png
src/assets/images/title-bg.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/top-left.png

3.79 KB | W: | H:

src/assets/images/top-left.png

798 Bytes | W: | H:

src/assets/images/top-left.png
src/assets/images/top-left.png
src/assets/images/top-left.png
src/assets/images/top-left.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/top-right.png

3.75 KB | W: | H:

src/assets/images/top-right.png

824 Bytes | W: | H:

src/assets/images/top-right.png
src/assets/images/top-right.png
src/assets/images/top-right.png
src/assets/images/top-right.png
  • 2-up
  • Swipe
  • Onion skin
<template>
<m-trans :enter="enter" :leave="leave">
<div class="monitor-card">
<div v-if="mode == 1" class="card-wrapper left">
<div class="card-title">
......@@ -21,6 +22,7 @@
</div>
</div>
</div>
</m-trans>
</template>
<script>
......@@ -34,6 +36,14 @@ export default {
mode: {
type: [String, Number],
default: '1',
},
enter: {
type: String,
default: 'fadeInRight',
},
leave: {
type: String,
default: 'fadeOutRight',
}
}
}
......
import MonitorDrawer from './monitor-drawer.vue'
export default (Vue) => {
Vue.component('m-drawer', MonitorDrawer)
}
<template>
<m-trans enter="fadeInRight" leave="fadeOutRight">
<div v-if="value" class="monitor-drawer">
<img @click="handleClose" class="close-btn" src="@/assets/images/title-arrow.png"/>
<img class="border left" src="@/assets/images/modal-right.png"/>
<div class="content">
<div>
<slot/>
</div>
</div>
<img class="border right" src="@/assets/images/modal-right.png"/>
</div>
</m-trans>
</template>
<script>
export default {
name: 'MonitorDrawer',
props: {
value: {
type: Boolean,
default: false,
},
width: {
type: String,
default: '40%',
}
},
methods: {
handleClose() {
this.$emit('close')
this.$emit('input', false)
}
},
}
</script>
<style lang="stylus" scoped>
.monitor-drawer
position fixed
top 4rem
right 1rem
bottom 0.6rem
z-index 1000
width 23.8vw
padding 1rem 0
background $color-map(0.1)
color #ccc
.content
height 100%
padding 0 1rem
overflow-y auto
overflow-x hidden
>img
position absolute
&.close-btn
top 0
bottom 0
margin auto
width 3rem
left -3rem
transform rotate(270deg)
cursor pointer
&.border
width 2rem
height 102%
top -0.5rem
bottom 0
&.left
transform rotate(180deg)
left -1rem
&.right
right -1rem
</style>
......@@ -3,14 +3,14 @@
<p v-if="title" class="title">{{title}}</p>
<Row class="row" v-for="(row, rowIndex) in layout" :key="rowIndex">
<i-col class="col" v-for="(col, key) in row" :key="key" :span="col.width" :offset="col.offset || 0">
<div :style="`text-align: ${col.align || 'right'}; width:${labelWidth}rem;`">{{col.label}}</div>
<div :style="`text-align: ${col.align || 'left'}; width:${labelWidth}rem;`">{{col.label}}</div>
&nbsp;&nbsp;
<img v-if="col.type == 'img'" @click="handleView(model[key])" :src="model[key]"/>
<div v-else>{{model[key]}}</div>
<img v-if="col.type == 'img'" @click="handleView(model[key])" :src="$api.IMG_URL + model[key]"/>
<div v-else class="content">{{model[key]}}</div>
</i-col>
</Row>
<m-modal v-model="showImg">
<img v-if="showImg" style="width: 100%;" :src="require(`@/assets/images/${curSrc}`)"/>
<img v-if="showImg" style="width: 100%;" :src="$api.IMG_URL + curSrc"/>
</m-modal>
</div>
</template>
......@@ -69,11 +69,16 @@ export default {
border-bottom 0.1rem solid $color-map()
.row
line-height 2.4rem
&:nth-child(2n)
background-color $color-map(0.15)
// &:nth-child(2n)
// background-color $color-map(0.15)
.col
display flex
align-items center
padding 0 1rem
&:nth-child(2n+1)
background-color $color-map(0.15)
.content
flex 1
img
width 25%
margin 0.5rem 0
......
<template>
<transition name="custom-classes-transition" enter-active-class="animated fadeInRight" leave-active-class="animated fadeOutRight">
<div v-if="value" class="monitor-modal" ref="modal">
<img @click="handleClose" class="close-btn" src="@/assets/images/title-arrow.png"/>
<img class="border left" src="@/assets/images/modal-right.png"/>
<div class="content">
<div>
<slot/>
</div>
</div>
<img class="border right" src="@/assets/images/modal-right.png"/>
</div>
</transition>
</template>
<script>
export default {
name: 'MonitorModal',
props: {
value: {
type: Boolean,
default: false,
},
width: {
type: String,
default: '40%',
}
},
methods: {
handleClose() {
this.$emit('close')
this.$emit('input', false)
}
},
}
</script>
<style lang="stylus" scoped>
.monitor-modal
position fixed
top 4rem
right 1rem
bottom 0.6rem
z-index 1000
width 23.8vw
padding 1rem 0
background $color-map(0.1)
color #ccc
.content
height 100%
padding 0 1rem
overflow-y auto
overflow-x hidden
>img
position absolute
&.close-btn
top 0
bottom 0
margin auto
width 3rem
left -3rem
transform rotate(270deg)
cursor pointer
&.border
width 2rem
height 102%
top -0.5rem
bottom 0
&.left
transform rotate(180deg)
left -1rem
&.right
right -1rem
</style>
<template>
<transition name="custom-classes-transition" enter-active-class="animated zoomInUp" leave-active-class="animated zoomOutDown">
<m-trans enter="zoomInUp" leave="zoomOutDown">
<div v-if="value" class="monitor-modal">
<div :style="`width:${width}`" ref="modal">
<div :style="`width:${width}`">
<img @click="handleClose" class="close-btn" src="@/assets/images/modal-close.png"/>
<img class="border top" src="@/assets/images/modal-top.png"/>
<div class="content">
......@@ -12,7 +12,7 @@
<img class="border bottom" src="@/assets/images/modal-bottom.png"/>
</div>
</div>
</transition>
</m-trans>
</template>
<script>
......@@ -34,11 +34,6 @@ export default {
this.$emit('input', false)
}
},
computed: {
height() {
return this.$refs.modal.height
}
}
}
</script>
......
<template>
<div class="monitor-table">
<p v-if="title" class="title">{{title}}</p>
<Row class="row row-title" >
<Row class="row row-title" v-if="mode == '1'">
<i-col class="col" v-for="col in layout" :key="col.key" :span="col.width" :offset="col.offset || 0">
<div :style="`text-align: ${col.align || 'left'}; `">{{col.title}}</div>
</i-col>
</Row>
<template v-if="model && model.length > 0">
<template v-if="model && model.length > 0 && mode == '1'">
<div>
<Row class="row" v-for="(row, rowIndex) in model" :key="rowIndex">
<i-col class="col" v-for="col in layout" :key="col.key" :span="col.width" :offset="col.offset || 0">
......@@ -24,8 +24,29 @@
</Row>
</div>
</template>
<template v-else-if="model && model.length > 0 && mode == '2'">
<div>
<Row class="row" v-for="(row, rowIndex) in model" :key="rowIndex">
<i-col class="col" :span="8">
<template v-if="row.imageList && row.imageList.length > 0">
<img
v-for="(img, i) in row.imageList"
:key="img + i"
:src="$api.IMG_URL + img.imageName"
@click="handleView(img.imageName)" />
</template>
</i-col>
<i-col class="col" :span="16">
<div>
<p>{{row.INDEXNAME}}</p>
<p style="color: #aaa;">{{row.REMARK}}</p>
</div>
</i-col>
</Row>
</div>
</template>
<m-modal v-model="showImg">
<img v-if="showImg" style="width: 100%;" :src="require(`@/assets/images/${curSrc}`)"/>
<img v-if="showImg" style="width: 100%;" :src="$api.IMG_URL + curSrc"/>
</m-modal>
</div>
</template>
......@@ -49,6 +70,10 @@ export default {
default() {
return []
}
},
mode: {
type: String,
default: '1',
}
},
data() {
......@@ -94,7 +119,7 @@ export default {
align-items center
flex-wrap wrap
img
width 50%
margin 0.5rem 0
width 100%
margin 0.4rem 0
cursor pointer
</style>
import MonitorTrans from './monitor-trans.vue'
export default (Vue) => {
Vue.component('m-trans', MonitorTrans)
}
<template>
<transition
name="custom-classes-transition"
:enter-active-class="`animated ${enter}`"
:leave-active-class="`animated ${leave}`">
<slot />
</transition>
</template>
<script>
export default {
name: 'MonitorTransition',
props: {
enter: {
type: String,
required: true,
},
leave: {
type: String,
required: true,
},
}
}
</script>
......@@ -19,8 +19,10 @@ import MonitorCount from '@/components/MonitorCount'
// import MonitorBrief from '@/components/MonitorBrief'
// import MonitorProgress from '@/components/MonitorProgress'
import MonitorModal from '@/components/MonitorModal'
import MonitorDrawer from '@/components/MonitorDrawer'
import MonitorForm from '@/components/MonitorForm'
import MonitorTable from '@/components/MonitorTable'
import MonitorTrans from '@/components/MonitorTrans'
import 'view-design/dist/styles/iview.css'
import 'moment/locale/zh-cn'
moment.locale('zh-cn')
......@@ -39,8 +41,10 @@ Vue.use(MonitorCount)
// Vue.use(MonitorProgress)
// Vue.use(MonitorChart)
Vue.use(MonitorModal)
Vue.use(MonitorDrawer)
Vue.use(MonitorForm)
Vue.use(MonitorTable)
Vue.use(MonitorTrans)
Vue.component('Row', Row)
Vue.component('i-col', Col)
/* eslint-disable no-new */
......
......@@ -6,7 +6,6 @@ const Main = () => import('@/views/main')
Vue.use(Router)
export default new Router({
// base:'/a/b/',
routes: [
{
path: '/',
......
let BASE_URL = ''
let IMG_URL = 'http://www.962121.net/hmfmstest/filecenter/files' // 测试环境
// let IMG_URL = 'http://962121.fgj.sh.gov.cn/wyweb/filecenter/files' // 云上生产环境
switch (process.env.NODE_ENV) {
case 'production':
BASE_URL = '/hmfmstest/shanghaiwuye/propertyinspector/api/v1'
......@@ -9,6 +11,7 @@ default:
};
export default {
BASE_URL,
IMG_URL,
// MAP_URL: 'http://168.168.112.76:8181',
MAP_URL: 'http://192.168.104.33:8181',
POST_THEME_LIST: '/sharingplatform/themeListForOneDay',
......
......@@ -8,22 +8,22 @@ export default {
{
label: '检查主题数',
icon: 'theme',
count: 3,
count: 0,
},
{
label: '检查人员数',
icon: 'person',
count: 9,
count: 0,
},
{
label: '完成检查小区数',
icon: 'complete',
count: 64,
count: 0,
},
{
label: '开具整改单数',
icon: 'rectify',
count: 12,
count: 0,
},
]
}
/** 公共方法 */
const _defaultConfig = {
name: 'test-point',
mode: 'add',
dataArray: [
{
codX: -1000,
codY: -1000,
codZ: 100,
attrs: {
att1: '测试属性',
attm: '第1类',
},
}
],
popupEnabled: false, // 是否打开弹出框
legendVisible: false, // 图例是否可见
type: 'point',
fieldJsonArray: [
{
name: 'att1',
alias: '属性1',
type: 'string',
},
{
name: 'attm',
alias: '属性m',
type: 'string',
},
],
renderer: {
type: 'unique-value',
field: 'attm',
defaultLabel: '无数据',
uniqueValueInfos: [
{
value: '第1类',
label: '第I类',
symbol: {
type: 'point-3d',
symbolLayers: [
{
type: 'icon',
size: 24,
resource: {
href: 'http://168.168.112.76:8181/propertybusinessmanage/tjcmv/images/marker/1.png'
// href: 'http://localhost:8080/static/person-bg.png'
},
},
]
}
},
]
},
labelSymbol: {
symbol: {
type: 'text',
color: 'red',
haloSize: 2,
haloColor: '#fff',
},
labelPlacement: 'center-right',
}
}
import api from '@/server/api'
export default {
/**
* 在深层数据结构中取值(为了替代类似 res && res.data && res.data.content这种写法)
......@@ -101,7 +39,7 @@ export default {
* @param {Array} data [必填 - 获取的数据]
* @param {String} key [必填 - 根据哪个关键字区别撒点(一般是id)]
*/
getMapParams(data = [], key) {
getMapParams(data = [], key, icon='/propertybusinessmanage/tjcmv/images/marker/1.png', size=20) {
const dataArray = []
const uniqueValueInfos = []
const fieldJsonArray = []
......@@ -129,9 +67,10 @@ export default {
symbolLayers: [
{
type: 'icon',
size: 24,
size,
resource: {
href: 'http://localhost:8080/static/person-bg.png'
href: api.MAP_URL + icon,
// href: 'http://962121.net/hmfmstest/shanghaiwuye/web/dataV/static/person-bg.png',
},
},
]
......
<template>
<div class="community-list">
<template v-if="list && list.length > 0">
<div
v-for="(item, index) in list"
:key="index"
......@@ -9,6 +10,10 @@
<div class="dot" />
<b :title="item.COMMUNITYNAME">{{item.COMMUNITYNAME | check}}</b>
</div>
</template>
<template v-else>
<p class="no-msg">暂无数据</p>
</template>
</div>
</template>
......@@ -62,7 +67,13 @@ export default {
display flex
flex-wrap wrap
width 100%
height 100%
// height 100%
.no-msg
width 100%
font-weight bold
text-align center
color #ccc
margin-top 30%
>div
display flex
align-items center
......
......@@ -30,7 +30,12 @@ export default {
},
methods: {
getClass(i) {
if (i < 10) {
const {rectify, checked} = this.count
if (checked === 0) {
return 'default'
}
const percent = Math.ceil(36 * rectify / checked)
if (i <= percent) {
return 'red'
} else {
return 'blue'
......@@ -94,6 +99,8 @@ export default {
width 2%
height 100%
border-radius 0.1rem
&.default
background $cardBg
&.red
background red
box-shadow 0 0 0.3rem 0.1rem red
......
......@@ -35,7 +35,7 @@ export default {
padding 1rem 0
font-size 0.8rem
.box
background rgba(0,0,0,0.3)
background rgba(0,0,0,0.5)
padding 0.5rem 1rem
&:nth-child(3)
span
......
<template>
<div class="map-operate">
<img class="bottom" src="@/assets/images/bottom.png" draggable="false"/>
<img :class="`${curBtn == 'full' ? 'bottom full' : 'bottom'}`" src="@/assets/images/bottom.png" draggable="false"/>
<div class="btn-list">
<img
v-for="btn in btns"
......@@ -11,9 +11,9 @@
draggable="false"
/>
</div>
<transition name="custom-classes-transition" enter-active-class="animated fadeInUp" leave-active-class="animated fadeOutDown">
<m-trans enter="fadeInUp" leave="fadeOutDown">
<SearchBar v-if="curBtn == 'search'" class="search-bar"/>
</transition>
</m-trans>
</div>
</template>
......@@ -38,10 +38,18 @@ export default {
},
methods: {
handleClick(btn) {
if (btn == 'search') {
if (btn == 'search' || btn == 'full') {
this.curBtn = btn == this.curBtn ? null : btn
}
// TODO
if (btn == 'full') {
this.$emit('fullscreen', this.curBtn)
return
}
if (btn == 'refresh') {
this.$emit('reset')
return
}
this.$emit('zoom', btn)
},
}
}
......@@ -58,6 +66,12 @@ export default {
left 0
right 0
width 100%
transition all 1s
&.full
left -46%
right -46%
width 192%
height 4rem
.btn-list
display flex
justify-content space-around
......@@ -69,6 +83,7 @@ export default {
margin 0 auto
>img
width 3rem
height 3rem
cursor pointer
transition all 0.3s
&:hover
......
<template>
<m-trans enter="fadeIn" leave="fadeOut">
<div class="map-operate">
<img class="top-left" src="@/assets/images/top-left.png" draggable="false"/>
<img class="top-right" src="@/assets/images/top-right.png" draggable="false"/>
......@@ -16,6 +17,7 @@
</div>
</div>
</div>
</m-trans>
</template>
<script>
......
<template>
<div class="person-list">
<template v-if="list && list.length > 0">
<div
v-for="(item, index) in list"
:key="index"
:class="`${item.OPER_ID == curId ? 'on' : ''}`"
:class="`${(item.OPER_ID + item.TASK_ID) == curId ? 'on' : ''}`"
@click="handleClick(item)"
>
<img src="@/assets/images/location.png"/>
<b>{{item.TE_NAME}}</b>
</div>
</template>
<template v-else>
<p class="no-msg">暂无数据</p>
</template>
</div>
</template>
......@@ -27,7 +32,7 @@ export default {
},
methods: {
handleClick(data) {
this.curId = data.OPER_ID
this.curId = data.OPER_ID + data.TASK_ID
this.$emit('select', data)
},
reset() {
......@@ -42,7 +47,13 @@ export default {
display flex
flex-wrap wrap
width 100%
height 100%
// height 100%
.no-msg
width 100%
font-weight bold
text-align center
color #ccc
margin-top 15%
>div
display flex
align-items center
......
......@@ -38,12 +38,15 @@ export default {
} else {
this.curId = data.TASK_ID
}
this.$emit('select', data)
this.$emit('select', this.curId, data)
},
dateFormat(date) {
if (!date) return ''
return this.$moment(date).format('YYYY-MM-DD')
}
},
reset() {
this.curId = null
},
},
// filters: {
// check(val) {
......
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment