diff --git a/src/assets/coastalMap/box_back03.png b/src/assets/coastalMap/box_back03.png new file mode 100644 index 0000000..88915dd Binary files /dev/null and b/src/assets/coastalMap/box_back03.png differ diff --git a/src/assets/coastalMap/keyPerson/key_li_back.png b/src/assets/coastalMap/keyPerson/key_li_back.png new file mode 100644 index 0000000..5122598 Binary files /dev/null and b/src/assets/coastalMap/keyPerson/key_li_back.png differ diff --git a/src/assets/coastalMap/keyPerson/key_li_btn.png b/src/assets/coastalMap/keyPerson/key_li_btn.png new file mode 100644 index 0000000..c654014 Binary files /dev/null and b/src/assets/coastalMap/keyPerson/key_li_btn.png differ diff --git a/src/assets/coastalMap/policeStatus/rank_one.png b/src/assets/coastalMap/policeStatus/rank_one.png new file mode 100644 index 0000000..b8181ef Binary files /dev/null and b/src/assets/coastalMap/policeStatus/rank_one.png differ diff --git a/src/assets/coastalMap/policeStatus/rank_three.png b/src/assets/coastalMap/policeStatus/rank_three.png new file mode 100644 index 0000000..da1c323 Binary files /dev/null and b/src/assets/coastalMap/policeStatus/rank_three.png differ diff --git a/src/assets/coastalMap/policeStatus/rank_two.png b/src/assets/coastalMap/policeStatus/rank_two.png new file mode 100644 index 0000000..29ed20d Binary files /dev/null and b/src/assets/coastalMap/policeStatus/rank_two.png differ diff --git a/src/utils/request.js b/src/utils/request.js index ec17d60..6d98818 100644 --- a/src/utils/request.js +++ b/src/utils/request.js @@ -2,7 +2,7 @@ import axios from 'axios' // import { getToken } from '@/utils/token' const baseURL = 'http://50.146.63.43:20000/' -// const baseURL = '' +//const baseURL = `http://${window.location.host}/` // axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8' const request = axios.create({ baseURL, diff --git a/src/views/coastalMap/components/keyPerson.vue b/src/views/coastalMap/components/keyPerson.vue index 33c4090..38f023f 100644 --- a/src/views/coastalMap/components/keyPerson.vue +++ b/src/views/coastalMap/components/keyPerson.vue @@ -69,7 +69,52 @@
- +
@@ -83,13 +128,106 @@ export default { // components: { PersonScroll }, data() { return { - title_text: '重点人员' - // * 测试数据 - // carouselData: [{ id: 1 }] + title_text: '重点人员', + roll_list: [ + { + text: '123', + per_type: '1', + type_text: '在逃人员', + person_name: '周大山', + phone_num: '13455674532', + id_card: '321287197606038965', + old_address: '射阳县解放路74号', + new_address: '江苏省射阳县海河镇革新村二组113号' + }, + { + text: '1243', + per_type: '3', + type_text: '涉恐人员', + person_name: '王富强', + phone_num: '13455674532', + id_card: '321287197606038965', + old_address: '射阳县解放路74号', + new_address: '江苏省射阳县海河镇革新村二组113号' + }, + { + text: '12323', + per_type: '2', + type_text: '精神病人', + person_name: '赵磊', + phone_num: '13455674532', + id_card: '321287197606038965', + old_address: '射阳县解放路74号', + new_address: '江苏省射阳县海河镇革新村二组113号' + }, + { + text: '1243', + per_type: '2', + type_text: '精神病人', + person_name: '徐永', + phone_num: '13455674532', + id_card: '321287197606038965', + old_address: '射阳县解放路74号', + new_address: '江苏省射阳县海河镇革新村二组113号' + }, + { + text: '1223', + per_type: '2', + type_text: '精神病人', + person_name: '李文一', + phone_num: '13455674532', + id_card: '321287197606038965', + old_address: '射阳县解放路74号', + new_address: '江苏省射阳县海河镇革新村二组113号' + }, + { + text: '1223', + per_type: '1', + type_text: '在逃人员', + person_name: '谭静', + phone_num: '13455674532', + id_card: '321287197606038965', + old_address: '射阳县解放路74号', + new_address: '江苏省射阳县海河镇革新村二组113号' + }, + { + text: '1243', + per_type: '3', + type_text: '涉恐人员', + person_name: '孙洋洋', + phone_num: '13455674532', + id_card: '321287197606038965', + old_address: '射阳县解放路74号', + new_address: '江苏省射阳县海河镇革新村二组113号' + }, + { + text: '1223', + per_type: '1', + type_text: '在逃人员', + person_name: '董磊', + phone_num: '13455674532', + id_card: '321287197606038965', + old_address: '射阳县解放路74号', + new_address: '江苏省射阳县海河镇革新村二组113号' + }, + { + text: '1223', + per_type: '2', + type_text: '精神病人', + person_name: '郑廖', + phone_num: '13455674532', + id_card: '321287197606038965', + old_address: '射阳县解放路74号', + new_address: '江苏省射阳县海河镇革新村二组113号' + } + ], + animateUp: false, + timer: null } }, mounted() { this.init_charts() + this.timer = setInterval(this.scrollAnimate, 1500) }, methods: { init_charts() { @@ -143,6 +281,15 @@ export default { ] } option && myChart.setOption(option) + }, + // 滚动播放 + scrollAnimate() { + this.animateUp = true + setTimeout(() => { + this.roll_list.push(this.roll_list[0]) + this.roll_list.shift() + this.animateUp = false + }, 500) } } } @@ -274,9 +421,113 @@ export default { } } } - .roll_body { - margin-top: 2vh; + width: 20vw; + height: 48vh; + // background: #00f5ff; + overflow: hidden; + .marquee-list { + width: 20vw; + height: 48vh; + padding: 0px; + li { + margin-left: 2%; + margin-right: 2%; + width: 96%; + height: 15vh; + background: url('~@/assets/coastalMap/keyPerson/key_li_back.png') + no-repeat; + background-size: 100% 100%; + margin-top: 1vh; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + list-style: none; + text-align: center; + display: flex; + justify-content: center; + align-items: center; + .roll_item_left { + width: 5vw; + height: 13vh; + .roll_item_pic { + width: 5vw; + height: 10vh; + background: #0b4672; + } + .roll_item_btn { + width: 5vw; + height: 3vh; + color: #fff; + background: #00f5ff; + font-size: 16px; + font-weight: 400; + text-align: center; + line-height: 3vh; + cursor: pointer; + background: url('~@/assets/coastalMap/keyPerson/key_li_btn.png') + no-repeat; + background-size: 100% 100%; + } + } + .roll_item_right { + width: 13vw; + height: 13vh; + position: relative; + display: flex; + .person_type { + position: absolute; + width: 3vw; + height: 2vh; + top: 0px; + right: 0px; + color: #061122; + text-align: center; + line-height: 2vh; + } + .one_type { + background: #ffc426; + } + .two_type { + background: #00f5ff; + } + .three_type { + background: #a357ff; + } + .right_text { + width: 5vw; + height: 13vh; + .right_text_item { + width: 5vw; + height: 2.6vh; + color: #ecf4f9; + font-size: 14px; + text-align: center; + line-height: 2.6vh; + } + } + .right_value { + width: 8vw; + height: 13vh; + .right_value_item { + width: 8vw; + height: 2.6vh; + color: #edf1f7; + font-size: 14px; + text-align: left; + line-height: 2.6vh; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + } + } + } + } + } + .animate-up { + transition: all 0.8s ease-in-out; + transform: translateY(-20vh); + } } } } diff --git a/src/views/coastalMap/components/policeSpread.vue b/src/views/coastalMap/components/policeSpread.vue index 17e214d..088fe1f 100644 --- a/src/views/coastalMap/components/policeSpread.vue +++ b/src/views/coastalMap/components/policeSpread.vue @@ -11,8 +11,8 @@ :key="index" >
{{ item.text }}
-
- 2,362 +
+ {{ item.num }}
@@ -26,9 +26,9 @@ export default { return { // * 警力分布假数据 policeData: [ - { color: '#00f5ff', text: '派出所' }, - { color: '#ffc426', text: '警务室' }, - { color: '#00f5ff', text: '执法警员' } + { num: '321', text: '派出所' }, + { num: '123', text: '警务室' }, + { num: '645', text: '执法警员' } ] } } @@ -37,21 +37,24 @@ export default {