| | |
| | | <div>值班信息(当日)</div> |
| | | </div> |
| | | |
| | | <div class="table-box" v-show="!showMJL"> |
| | | <el-table size="small" :height="tableHeight" :data="schedulingList" style="width: 100%;" |
| | | :header-cell-style="{ 'text-align': 'center' }" |
| | | :cell-style="{ 'text-align': 'center', borderColor: '#324e75' }" :row-class-name="tableRowClassName" |
| | | :empty-text="schedulingNoDataText" v-loading="schedulingLoading" element-loading-text="拼命加载中" |
| | | element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.5)"> |
| | | <el-table-column prop="dept" label="值班单位"></el-table-column> |
| | | <el-table-column prop="person" label="姓名"></el-table-column> |
| | | <el-table-column prop="contact" label="联系方式"></el-table-column> |
| | | </el-table> |
| | | <div class="pointList" v-if="schedulingList == []"> |
| | | <el-tooltip class="item" effect="dark" :content="item.dept" placement="top" |
| | | v-for="(item, index) in schedulingDeptList" :key="index"> |
| | | <div class="point" @click="getSchedlingList(item)"></div> |
| | | </el-tooltip> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="duty-information-box" v-show="showMJL"> |
| | | <div> |
| | | <div class="duty-information-box"> |
| | | <div v-for="item in schedulingList" :key="item.id"> |
| | | <div> |
| | | <span>值班</span> |
| | | <span>{{ item.type }}</span> |
| | | </div> |
| | | <div> |
| | | <span>徐星逸,任圣日,娄永攀,蔡善龙,陈小强,刘开勇,梅祥,吕镇,付建冬</span> |
| | | <span>{{ item.person }}</span> |
| | | </div> |
| | | </div> |
| | | <div> |
| | | <div> |
| | | <span>副班、巡逻</span> |
| | | </div> |
| | | <div> |
| | | <span>章正椿,夏文翔,叶江明,黄俊龙,苏茯林,王顺祥</span> |
| | | </div> |
| | | </div> |
| | | <div v-if="schedulingList.length == 0" class="no-zb-data">暂无值班数据</div> |
| | | </div> |
| | | </div> |
| | | |
| | |
| | | pickerOptions: { |
| | | shortcuts: [ |
| | | { |
| | | text: "最近一周", |
| | | text: '最近一周', |
| | | onClick (picker) { |
| | | const end = new Date() |
| | | const start = new Date() |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 7) |
| | | picker.$emit("pick", [start, end]) |
| | | }, |
| | | picker.$emit('pick', [start, end]) |
| | | } |
| | | }, |
| | | { |
| | | text: "最近一个月", |
| | | text: '最近两周', |
| | | onClick (picker) { |
| | | const end = new Date() |
| | | const start = new Date() |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 14) |
| | | picker.$emit('pick', [start, end]) |
| | | } |
| | | }, |
| | | { |
| | | text: '最近一个月', |
| | | onClick (picker) { |
| | | const end = new Date() |
| | | const start = new Date() |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 30) |
| | | picker.$emit("pick", [start, end]) |
| | | }, |
| | | picker.$emit('pick', [start, end]) |
| | | } |
| | | }, |
| | | { |
| | | text: "最近三个月", |
| | | text: '最近三个月', |
| | | onClick (picker) { |
| | | const end = new Date() |
| | | const start = new Date() |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 90) |
| | | picker.$emit("pick", [start, end]) |
| | | }, |
| | | }, |
| | | ], |
| | | picker.$emit('pick', [start, end]) |
| | | } |
| | | }] |
| | | }, |
| | | regionTotal: 0, |
| | | linetype: 0, |
| | |
| | | schedulingList: [], |
| | | schedulingDeptList: [1, 2, 3, 4, 5, 6, 1, 2, 3, 4, 5, 6], |
| | | policeStaionID: "", |
| | | showMJL: false, |
| | | originTitle: ['值班', '副班、巡逻'], |
| | | transTitle: [{ label: '人员', width: '28%', align: 'center' }, { label: '人员', width: '', align: 'left' },], |
| | | caseInfoType: 0 |
| | |
| | | |
| | | getSchedulingList () { |
| | | this.schedulingLoading = true |
| | | if (this.userInfo.dept_id == "1596020515064381442") { |
| | | this.schedulingNoDataText = ' ' |
| | | const data = [ |
| | | { |
| | | person: |
| | | "徐星逸,任圣日,娄永攀,蔡善龙,陈小强,刘开勇,梅祥,吕镇,付建冬", |
| | | patrol: "章正椿,夏文翔,叶江明,黄俊龙,苏茯林,王顺祥", |
| | | } |
| | | ] |
| | | |
| | | const matrixData = data.map((row) => { |
| | | let arr = [] |
| | | for (let key in row) { |
| | | arr.push(row[key]) |
| | | } |
| | | return arr |
| | | }) |
| | | setTimeout(() => { |
| | | this.schedulingList = matrixData[0].map((col, i) => { |
| | | return [this.originTitle[i], ...matrixData.map((row) => { |
| | | return row[i] |
| | | })] |
| | | }) |
| | | this.schedulingLoading = false |
| | | }, 1000) |
| | | |
| | | this.$nextTick(() => { |
| | | this.tableHeight = |
| | | this.$refs.Container.offsetHeight - |
| | | this.$refs.caseBox.offsetHeight - |
| | | this.$refs.crowdBox.offsetHeight - |
| | | this.$refs.alertBoxTitle.offsetHeight |
| | | }) |
| | | |
| | | this.showMJL = true |
| | | } else { |
| | | const params = { |
| | | sameday: 1, |
| | | } |
| | | |
| | | this.showMJL = false |
| | | getSchedulingList(1, 100, params).then((res) => { |
| | | this.schedulingList = res.data.data.records |
| | | }) |
| | | |
| | | |
| | | setTimeout(() => { |
| | | this.schedulingNoDataText = ' ' |
| | | this.schedulingLoading = false |
| | | if (!this.schedulingList.length) { |
| | | setTimeout(() => { |
| | | this.schedulingNoDataText = '暂无值班数据' |
| | | }, 200) |
| | | } |
| | | }, 500) |
| | | |
| | | |
| | | const params = { |
| | | sameday: 1, |
| | | isPage: 1 |
| | | } |
| | | |
| | | getSchedulingList(params).then((res) => { |
| | | this.schedulingList = res.data.data |
| | | }) |
| | | |
| | | setTimeout(() => { |
| | | this.schedulingNoDataText = ' ' |
| | | this.schedulingLoading = false |
| | | if (!this.schedulingList.length) { |
| | | setTimeout(() => { |
| | | this.schedulingNoDataText = '暂无值班数据' |
| | | }, 200) |
| | | } |
| | | }, 500) |
| | | }, |
| | | |
| | | echartsResize () { |
| | |
| | | ).then((res) => { |
| | | let obj = {} |
| | | if (res.data.timeList) { |
| | | console.log(res.data, 1111) |
| | | let yDataList = {} |
| | | yDataList.dqList = res.data.dqList.reduce( |
| | | (previous, current) => { |
| | |
| | | [] |
| | | ) |
| | | yDataList.qtList = res.data.qtList.reduce( |
| | | (previous, current) => { |
| | | previous.push(current.count) |
| | | return previous |
| | | }, |
| | | [] |
| | | ) |
| | | yDataList.qjList = res.data.qjList.reduce( |
| | | (previous, current) => { |
| | | previous.push(current.count) |
| | | return previous |
| | | }, |
| | | [] |
| | | ) |
| | | yDataList.sdList = res.data.sdList.reduce( |
| | | (previous, current) => { |
| | | previous.push(current.count) |
| | | return previous |
| | | }, |
| | | [] |
| | | ) |
| | | yDataList.sduList = res.data.sduList.reduce( |
| | | (previous, current) => { |
| | | previous.push(current.count) |
| | | return previous |
| | | }, |
| | | [] |
| | | ) |
| | | yDataList.shList = res.data.shList.reduce( |
| | | (previous, current) => { |
| | | previous.push(current.count) |
| | | return previous |
| | |
| | | }, |
| | | }, |
| | | legend: { |
| | | data: ['盗窃', '涉诈', '纠纷', '其他'], |
| | | data: ['盗窃', '涉诈', '纠纷', '其他', '求助', '涉毒', '涉赌', '涉黄'], |
| | | textStyle: { |
| | | color: "#fff" |
| | | } |
| | |
| | | data: yDataList.qtList, |
| | | type: "line", |
| | | smooth: true, |
| | | }, |
| | | { |
| | | name: '求助', |
| | | data: yDataList.qjList, |
| | | type: "line", |
| | | smooth: true, |
| | | }, |
| | | { |
| | | name: '涉毒', |
| | | data: yDataList.sduList, |
| | | type: "line", |
| | | smooth: true, |
| | | }, |
| | | { |
| | | name: '涉赌', |
| | | data: yDataList.sdList, |
| | | type: "line", |
| | | smooth: true, |
| | | }, |
| | | { |
| | | name: '涉黄', |
| | | data: yDataList.shList, |
| | | type: "line", |
| | | smooth: true, |
| | | } |
| | | |
| | | ], |
| | | grid: { |
| | | top: "4%", |
| | | top: "24%", |
| | | left: "3%", |
| | | right: "2%", |
| | | bottom: "4%", |
| | |
| | | text-align: left; |
| | | } |
| | | } |
| | | |
| | | .no-zb-data { |
| | | width: 100%; |
| | | height: 100%; |
| | | background: transparent !important; |
| | | align-items: center; |
| | | display: flex; |
| | | justify-content: center; |
| | | } |
| | | } |
| | | |
| | | #peopleList { |