提交 fc3bb84d authored 作者: 谢廷雅's avatar 谢廷雅

Merge remote-tracking branch 'origin/master'

......@@ -43,26 +43,28 @@
"@riophae/vue-treeselect": "0.4.0",
"axios": "0.18.1",
"clipboard": "2.0.4",
"crypto-js": "^4.0.0",
"core-js": "3.6.5",
"crypto-js": "^4.0.0",
"echarts": "4.2.1",
"element-ui": "2.13.2",
"file-saver": "2.0.1",
"js-beautify": "1.10.2",
"fuse.js": "3.4.4",
"js-beautify": "1.10.2",
"js-cookie": "2.2.0",
"jsencrypt": "3.0.0-rc.1",
"normalize.css": "7.0.0",
"nprogress": "0.2.0",
"path-to-regexp": "2.4.0",
"quill": "1.3.7",
"screenfull": "4.2.0",
"sortablejs": "1.8.4",
"v-viewer": "^1.6.4",
"vue": "2.6.10",
"vue-count-to": "1.0.13",
"quill": "1.3.7",
"vue-cropper": "0.4.9",
"vue-router": "3.0.2",
"vue-splitpane": "1.0.4",
"vue-video-player": "^5.0.2",
"vuedraggable": "2.20.0",
"vuex": "3.1.0"
},
......
import request from '@/utils/request'
//选择复查指标提交
export function selectCheckTarget(data) {
return request({
url: '/backstage/job/selectCheckTarget',
method: 'put',
data: data
})
}
// 获取复查指标列表
export function getCheckTarget(id) {
return request({
url: '/backstage/job/getCheckTarget/' + id,
method: 'get',
})
}
//选择整改指标提交
export function selectRectifyTarget(data) {
return request({
url: '/backstage/job/selectRectifyTarget',
method: 'put',
data: data
})
}
// 获取整改指标列表
export function getRectifyTarget(id) {
return request({
url: '/backstage/job/getRectifyTarget/' + id,
method: 'get',
})
}
// 获取相关联指标列表
export function getTargetList(id) {
return request({
url: '/backstage/job/getTargetList/' + id,
method: 'get',
})
}
//派发整改任务
export function distributeRectificationJob(id) {
return request({
url: '/backstage/job/distributeRectificationJob/'+id,
method: 'put',
})
}
//打回初次调查任务(复查任务不需要打回)
export function rollbackJob(id) {
return request({
......
......@@ -4,6 +4,15 @@ import Cookies from 'js-cookie'
import 'normalize.css/normalize.css' // a modern alternative to CSS resets
// 图片方法的组件
import Viewer from 'v-viewer'
import 'viewerjs/dist/viewer.css'
//视频播放组件
import VideoPlayer from 'vue-video-player'
require('video.js/dist/video-js.css')
require('vue-video-player/src/custom-theme.css')
import Element from 'element-ui'
import './assets/styles/element-variables.scss'
......@@ -52,6 +61,30 @@ Vue.component('RightToolbar', RightToolbar)
Vue.use(permission)
//视频播放组件
Vue.use(VideoPlayer)
// 图片放大的组件
Vue.use(Viewer)
Viewer.setDefaults({
Options: {
'inline': true,
'button': true,
'navbar': true,
'title': true,
'toolbar': true,
'tooltip': true,
'movable': true,
'zoomable': true,
'rotatable': true,
'scalable': true,
'transition': true,
'fullscreen': true,
'keyboard': true,
'url': 'data-source'
}
})
/**
* If you don't want to use mock-server
* you want to use MockJs for mock api
......
......@@ -169,6 +169,20 @@ export const constantRoutes = [
meta: { title: '问题详情' }
}
]
},
{
path: '/getJobDetail',
component: Layout,
hidden: true,
children: [
{
path: '/getJobDetail/:id',
component: (resolve) => require(['@/views/backstage/job/detail'], resolve),
name: 'jobDetail',
meta: { title: '任务详情' }
}
]
}
]
......
<template>
<div>
<div>
<el-button style="margin-top: 20px;margin-left: 20px" icon="arrow-left" class="pan-back-btn" @click="back">
&lt; 返回
</el-button>
</div>
<div style="margin-top: 20px;margin-left: 20px">
<h3 style="font-size: 30px">考核内容</h3>
<div v-for="(item,index) in targetList" style="font-size: 20px">
<div style="color: #00afff">{{"考核指标" + index+1}}</div>
<div style="margin-top: 20px"><span>考核标题:</span><span style="margin-left: 20px">{{item.ttarget.targetName}}</span></div>
<div style="margin-top: 20px"><span>考核标准:</span><span style="margin-left: 20px">{{item.ttarget.checkCriteria}}</span></div>
<div style="margin-top: 20px"><span>评分标准:</span><span style="margin-left: 20px">{{item.ttarget.scoreCriteria}}</span></div>
<div style="margin-top: 20px"><span>所属层级:</span><span style="margin-left: 20px">{{item.ttarget.allTargetLevelName}}</span></div>
<div style="margin-top: 20px" v-if="item.ttarget.type=='1'"><span>加分项:</span><span style="margin-left: 20px">{{item.ttarget.plusReduceItem}}</span></div>
<div style="margin-top: 20px" v-if="item.ttarget.type=='2'"><span>减分项:</span><span style="margin-left: 20px">{{item.ttarget.plusReduceItem}}</span></div>
<div style="margin-top: 20px"><span>每项分值:</span><span style="margin-left: 20px">{{item.ttarget.plusReduceItemEvery}}</span></div>
<div style="margin-top: 20px">
<span style="color: red">注:备注黑色为普通;有问题的为红色;有亮点的为蓝色</span>
</div>
<div style="margin-top: 20px;margin-left: 60px" >
<div v-viewer v-for="image in item.tjobPicVedios" v-if="image.mediaType == '1'"
style="display: inline-block; width: 20%; margin-left: 10px;vertical-align: middle;text-align: center;">
<img
:src="image.url"
style="width: 100px;height: 100px; cursor:pointer"/>
<div style="margin-top: 20px" v-if="image.type == null">备注:{{image.remark}}</div>
<div style="margin-top: 20px" v-else>
<div v-if="image.type == '1'? imageColor = 'red' : imageColor = 'blue'" :style="{color:imageColor}">备注:{{image.remark}}</div>
</div>
</div>
<div v-for="image in item.tjobPicVedios" v-if="image.mediaType == '2'" style="display: inline-block; width: 20%; margin-left: 10px;vertical-align: middle;text-align: center;">
<div >
<video-player class="video-player vjs-custom-skin"
ref="videoPlayer"
:playsinline="true"
:options="playerOptions"
></video-player>
<div style="margin-top: 20px" v-if="image.type == null">备注:{{image.remark}}</div>
<div style="margin-top: 20px" v-else>
<div v-if="image.type == '1'? imageColor = 'red' : imageColor = 'blue'" :style="{color:imageColor}">备注:{{image.remark}}</div>
</div>
</div>
</div>
</div>
<el-divider></el-divider>
<div style="font-size: 20px;margin-top: 50px">
<div style="margin-top: 20px"><span>加分项数量:</span><span style="margin-left: 20px">{{addScoreCount}}</span></div>
<div style="margin-top: 20px"><span>减分项数量:</span><span style="margin-left: 20px">{{reduceScoreCount}}</span></div>
<div style="margin-top: 20px"><span>GPS坐标:</span><span style="margin-left: 20px">{{gps}}</span></div>
<div style="margin-top: 20px"><span>是否重新调查:</span><span style="margin-left: 20px">{{isCheckFlag ? "是" : "否"}}</span></div>
<div style="margin-top: 20px">选择原因</div>
</div>
<H3 style="font-size: 30px">调查员重新调查内容</H3>
<H3 style="font-size: 30px">整改内容</H3>
<H3 style="font-size: 30px">调查员复查内容</H3>
</div>
</div>
</div>
</template>
<script>
import { getTargetList,distributeRectificationJob, rollbackJob, auditJob, getList,listJob, getJob, delJob, addJob, updateJob, exportJob } from "@/api/backstage/job";
export default {
name: "jobDetail",
data(){
return{
imageColor:'black',
jobId:null,
form:{},
targetList:[],
addScoreCount:0,
reduceScoreCount:0,
isCheckFlag: false,
gps:'',
// 视频播放
playerOptions : {
playbackRates: [0.7, 1.0, 1.5, 2.0], //播放速度
autoplay: false, //如果true,浏览器准备好时开始回放。
muted: false, // 默认情况下将会消除任何音频。
loop: false, // 导致视频一结束就重新开始。
preload: 'auto', // 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频(如果浏览器支持)
language: 'zh-CN',
aspectRatio: '16:9', // 将播放器置于流畅模式,并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字(例如"16:9"或"4:3")
fluid: true, // 当true时,Video.js player将拥有流体大小。换句话说,它将按比例缩放以适应其容器。
sources: [{
type: "",
src: 'http://vjs.zencdn.net/v/oceans.mp4'//url地址
// src: "" //url地址
}],
poster: "", //你的封面地址
width: '400px', // 播放器宽度
notSupportedMessage: '此视频暂无法播放,请稍后再试', //允许覆盖Video.js无法播放媒体源时显示的默认信息。
controlBar: {
timeDivider: true,
durationDisplay: true,
remainingTimeDisplay: false,
fullscreenToggle: true //全屏按钮
}
}
}
},
created() {
this.jobId = this.$route.params.id;
getJob(this.jobId).then(response => {
this.form = response.data;
console.log(this.form)
});
//获取相关联指标列表
getTargetList(this.jobId).then(res=>{
this.targetList = res.data.tJobTargets;
this.addScoreCount = res.data.addScoreCount;
this.reduceScoreCount = res.data.reduceScoreCount;
this.isCheckFlag = res.data.isCheckFlag;
this.gps = res.data.gps;
});
},
methods:{
back() {
this.$router.go(-1)
// this.$router.push("/job/job")
},
apply(){
// this.$refs.videoPlayer.play()
// this.playerOptions.width = 600
}
}
}
</script>
<style scoped >
/*.video-js .vjs-icon-placeholder {*/
/* width: 80%;*/
/* height: 80%;*/
/* display: block;*/
/*}*/
/* .video-player {
width: 50%;
} */
</style>
......@@ -63,7 +63,7 @@
<!-- <el-table-column label="自增id" align="center" prop="id" />-->
<el-table-column label="主题名称" align="center" prop="name" />
<el-table-column label="创建时间" align="center" prop="createTime" />
<el-table-column label="参与村数量" align="center" prop="" />
<el-table-column label="参与村数量" align="center" prop="villageCount" />
<el-table-column label="考核指标数量" align="center" prop="targetCount" >
<template scope="scope">
<el-button @click="getTargetListDetail(scope.row.id)" round type="success">{{scope.row.targetCount}}</el-button>
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论