Skip to content

D
DA-Platform

文档服务地址：http://47.92.0.57:3000/ 周报索引地址：http://47.92.0.57:3000/s/NruNXRYmV

Commit 2b970adc by wl2282589971
Options

Merge branch 'feature' into image 

# Conflicts:
#	DAPlatform-front/build/webpack.base.conf.js
#	DAPlatform-front/package-lock.json
#	DAPlatform-front/src/App.vue
#	DAPlatform-front/src/components/HelloWorld.vue
#	DAPlatform-front/src/main.js
#	DAPlatform-front/src/router/index.js
parents 14f53687 662d9097
Showing with 2157 additions and 136 deletions
DAPlatform-front/build/webpack.base.conf.js
'use strict' 'use strict'
const webpack = require('webpack')
const path = require('path') const path = require('path')
const utils = require('./utils') const utils = require('./utils')
const config = require('../config') const config = require('../config')
...@@ -40,7 +41,7 @@ module.exports = { ...@@ -40,7 +41,7 @@ module.exports = {
}, },
module: { module: {
rules: [ rules: [
// ...(config.dev.useEslint ? [createLintingRule()] : []), ...(config.dev.useEslint ? [] : []),
{ {
test: /\.vue$/, test: /\.vue$/,
loader: 'vue-loader', loader: 'vue-loader',
...@@ -74,6 +75,10 @@ module.exports = { ...@@ -74,6 +75,10 @@ module.exports = {
limit: 10000, limit: 10000,
name: utils.assetsPath('fonts/[name].[hash:7].[ext]') name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
} }
},
{
test: /\.scss$/,
loaders: ['style', 'css', 'sass']
} }
] ]
}, },
......
DAPlatform-front/config/package.json 0 → 100644
{
"name": "daplatform",
"version": "1.0.0",
"description": "A Vue.js project",
"author": "BerlinDorin <876656787@qq.com>",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"lint": "eslint --ext .js,.vue src",
"build": "node build/build.js"
},
"dependencies": {
"element-ui": "^2.13.1",
"vue": "^2.5.2",
"vue-router": "^3.0.1"
},
"devDependencies": {
"autoprefixer": "^7.1.2",
"babel-core": "^6.22.1",
"babel-eslint": "^8.2.1",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-loader": "^7.1.1",
"babel-plugin-syntax-jsx": "^6.18.0",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-plugin-transform-vue-jsx": "^3.5.0",
"babel-preset-env": "^1.3.2",
"babel-preset-stage-2": "^6.22.0",
"chalk": "^2.0.1",
"copy-webpack-plugin": "^4.0.1",
"css-loader": "^0.28.0",
"eslint": "^4.15.0",
"eslint-config-standard": "^10.2.1",
"eslint-friendly-formatter": "^3.0.0",
"eslint-loader": "^1.7.1",
"eslint-plugin-import": "^2.7.0",
"eslint-plugin-node": "^5.2.0",
"eslint-plugin-promise": "^3.4.0",
"eslint-plugin-standard": "^3.0.1",
"eslint-plugin-vue": "^4.0.0",
"extract-text-webpack-plugin": "^3.0.0",
"file-loader": "^1.1.4",
"friendly-errors-webpack-plugin": "^1.6.1",
"html-webpack-plugin": "^2.30.1",
"node-notifier": "^5.1.2",
"node-sass": "^4.14.1",
"optimize-css-assets-webpack-plugin": "^3.2.0",
"ora": "^1.2.0",
"portfinder": "^1.0.13",
"postcss-import": "^11.0.0",
"postcss-loader": "^2.0.8",
"postcss-url": "^7.2.1",
"rimraf": "^2.6.0",
"sass-loader": "^7.3.1",
"semver": "^5.3.0",
"shelljs": "^0.7.6",
"uglifyjs-webpack-plugin": "^1.1.1",
"url-loader": "^0.5.8",
"vue-loader": "^13.3.0",
"vue-style-loader": "^3.0.1",
"vue-template-compiler": "^2.5.2",
"webpack": "^3.6.0",
"webpack-bundle-analyzer": "^2.9.0",
"webpack-dev-server": "^2.9.1",
"webpack-merge": "^4.1.0"
},
"engines": {
"node": ">= 6.0.0",
"npm": ">= 3.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
DAPlatform-front/package.json
...@@ -44,7 +44,9 @@ ...@@ -44,7 +44,9 @@
"file-loader": "^1.1.4", "file-loader": "^1.1.4",
"friendly-errors-webpack-plugin": "^1.6.1", "friendly-errors-webpack-plugin": "^1.6.1",
"html-webpack-plugin": "^2.30.1", "html-webpack-plugin": "^2.30.1",
"mockjs": "^1.1.0",
"node-notifier": "^5.1.2", "node-notifier": "^5.1.2",
"node-sass": "^4.14.1",
"optimize-css-assets-webpack-plugin": "^3.2.0", "optimize-css-assets-webpack-plugin": "^3.2.0",
"ora": "^1.2.0", "ora": "^1.2.0",
"portfinder": "^1.0.13", "portfinder": "^1.0.13",
...@@ -52,10 +54,12 @@ ...@@ -52,10 +54,12 @@
"postcss-loader": "^2.0.8", "postcss-loader": "^2.0.8",
"postcss-url": "^7.2.1", "postcss-url": "^7.2.1",
"rimraf": "^2.6.0", "rimraf": "^2.6.0",
"sass-loader": "^7.3.1",
"semver": "^5.3.0", "semver": "^5.3.0",
"shelljs": "^0.7.6", "shelljs": "^0.7.6",
"uglifyjs-webpack-plugin": "^1.1.1", "uglifyjs-webpack-plugin": "^1.1.1",
"url-loader": "^0.5.8", "url-loader": "^0.5.8",
"vue-axios": "^2.1.5",
"vue-loader": "^13.3.0", "vue-loader": "^13.3.0",
"vue-style-loader": "^3.0.1", "vue-style-loader": "^3.0.1",
"vue-template-compiler": "^2.5.2", "vue-template-compiler": "^2.5.2",
......
DAPlatform-front/src/App.vue
<template> <template>
<div id="app"> <div id="app">
<!-- <img src="./assets/logo.png">-->
<router-view/> <router-view/>
</div> </div>
</template> </template>
...@@ -10,15 +9,16 @@ export default { ...@@ -10,15 +9,16 @@ export default {
name: 'App' name: 'App'
} }
</script> </script>
<style lang='scss'>
<style> body{
margin: 0;
}
#app { #app {
font-family: 'Avenir', Helvetica, Arial, sans-serif; font-family: 'Avenir', Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
/*text-align: center;*/ text-align: center;
color: #2c3e50; color: #2c3e50;
/*margin-top: 60px;*/ margin:0;
height: 100%;
} }
</style> </style>
DAPlatform-front/src/assets/scss/config.scss 0 → 100644
// 样式规范
$min-width: 1000px; //页面主体部分最小宽度
// 字体大小设置
// 常规颜色配置
$theme-color: #409EFF !default; //element原生蓝，主题色及按钮色
$bg-color: #d9ecff !default; //背景蓝
$font-color-footer: #969595 !default; //注脚的字体颜色
$divider-color: #DCDFE6 !default; //分割线颜色
DAPlatform-front/src/assets/scss/mixin.scss 0 → 100644
@mixin container {
padding: 40px 10% 100px 10%;
min-width: $min-width;
min-height: 600px;
overflow:hidden;
background-color: $bg-color;
}
@mixin whiteBoard {
background-color: white;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
\ No newline at end of file
DAPlatform-front/src/components/CheckTask.vue 0 → 100644
<template>
<div class="taskhall">
<el-container>
<el-main style="background-color: #FFFFFF">
<el-table
:data="tableData"
:header-cell-style="{backgroundColor:'#FFFFFF',color:'#409EFF'}"
max-height=600px
border
style="width: 100%"
:default-sort = "{prop: 'date', order: 'descending'}">
<el-table-column
prop="taskId"
label="任务ID"
width="180">
</el-table-column>
<el-table-column
prop="splitNum"
label="分片数量"
width="180">
</el-table-column>
<el-table-column
prop="date"
label="发布时间"
sortable
width="180">
<template slot-scope="scope">
<i class="el-icon-time"></i>
<span style="margin-left: 10px">{{ scope.row.date }}</span>
</template>
</el-table-column>
<el-table-column
prop="name"
label="任务名称"
>
</el-table-column>
<el-table-column
prop="status"
label="任务状态"
width="180"
>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
width="180">
<template slot-scope="scope">
<el-button @click="checkdetail" type="text" size="large">查看详情</el-button>
</template>
</el-table-column>
</el-table>
</el-main>
</el-container>
</div>
</template>
<script>
export default {
data() {
return {
tableData: [{
taskId:'1',
splitNum:'3',
date: '2016-05-03',
name: '单物体语义分割',
status: '待审核'
}, {
taskId:'1',
splitNum:'3',
date: '2017-05-03',
name: '人脸质量判断',
status: '待审核'
}, {
taskId:'1',
splitNum:'3',
date: '2018-05-03',
name: '图片属性标注',
status: '待审核'
}, {
taskId:'1',
splitNum:'3',
date: '2016-06-03',
name: '图片属性标注',
status: '待审核'
}, {
taskId:'1',
splitNum:'3',
date: '2016-05-04',
name: '图片属性标注',
status: '待审核'
}, {
taskId:'1',
splitNum:'3',
date: '2016-05-08',
name: '图片属性标注',
status: '待审核'
}, {
taskId:'1',
splitNum:'3',
date: '2016-06-11',
name: '图片属性标注',
status: '待审核'
}, {
taskId:'1',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '待审核'
}, {
taskId:'1',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '待审核'
}, {
taskId:'1',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '待审核'
}, {
taskId:'1',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '待审核'
}, {
taskId:'1',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '待审核'
}]
}
},
methods: {
checkdetail () {
this.$router.push('/').catch(data => {
})
}
}
}
</script>
<style>
.taskhall{
width: 90vw;
min-width: 800px;
/* border: solid; */
margin-left: auto;
margin-right: auto;
margin-top: 0px;
}
.el-header, .el-footer {
background-color: #B3C0D1;
color: #333;
text-align: center;
line-height: 60px;
}
.el-aside {
background-color: #D3DCE6;
color: #333;
text-align: center;
line-height: 200px;
}
.el-main {
background-color: #E9EEF3;
color: #333;
text-align: center;
line-height: 36px;
}
body > .el-container {
margin-bottom: 40px;
}
.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
line-height: 260px;
}
.el-container:nth-child(7) .el-aside {
line-height: 320px;
}
</style>
DAPlatform-front/src/components/CompletedTask.vue 0 → 100644
<template>
<div class="taskhall">
<el-container>
<el-main style="background-color: #FFFFFF">
<el-table
:data="tableData"
:header-cell-style="{color:'#409EFF'}"
height="570"
border
style="width: 100%">
<el-table-column
prop="taskId"
label="任务ID"
width="180">
</el-table-column>
<el-table-column
prop="author"
label="发布者ID"
width="180">
</el-table-column>
<el-table-column
prop="splitNum"
label="分片数量"
width="180">
</el-table-column>
<el-table-column
prop="date"
label="发布时间"
width="180">
<template slot-scope="scope">
<i class="el-icon-time"></i>
<span style="margin-left: 10px">{{ scope.row.date }}</span>
</template>
</el-table-column>
<el-table-column
prop="name"
label="任务名称"
>
</el-table-column>
<el-table-column
prop="status"
label="任务状态"
width="180"
>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
width="180">
<template slot-scope="scope">
<el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
<el-button type="text" size="small">导出</el-button>
</template>
</el-table-column>
</el-table>
</el-main>
</el-container>
</div>
</template>
<script>
export default {
data() {
return {
tableData: [{
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '单物体语义分割',
status: '已完成'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '人脸质量判断',
status: '已完成'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已完成'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已完成'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已完成'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已完成'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已完成'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已完成'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已完成'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已完成'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已完成'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已完成'
}]
}
}
}
</script>
<style>
.taskhall{
width: 90vw;
min-width: 800px;
/* border: solid; */
margin-left: auto;
margin-right: auto;
margin-top: 0px;
}
.el-header, .el-footer {
background-color: #B3C0D1;
color: #333;
text-align: center;
line-height: 60px;
}
.el-aside {
background-color: #D3DCE6;
color: #333;
text-align: center;
line-height: 200px;
}
.el-main {
background-color: #E9EEF3;
color: #333;
text-align: center;
line-height: 36px;
}
body > .el-container {
margin-bottom: 40px;
}
.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
line-height: 260px;
}
.el-container:nth-child(7) .el-aside {
line-height: 320px;
}
</style>
DAPlatform-front/src/components/HelloWorld.vue deleted 100644 → 0
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<h2>Essential Links</h2>
<ul>
<li>
<a
href="https://vuejs.org"
target="_blank"
>
Core Docs
</a>
</li>
<li>
<a
href="https://forum.vuejs.org"
target="_blank"
>
Forum
</a>
</li>
<li>
<a
href="https://chat.vuejs.org"
target="_blank"
>
Community Chat
</a>
</li>
<li>
<a
href="https://twitter.com/vuejs"
target="_blank"
>
Twitter
</a>
</li>
<br>
<li>
<a
href="http://vuejs-templates.github.io/webpack/"
target="_blank"
>
Docs for This Template
</a>
</li>
</ul>
<h2>Ecosystem</h2>
<ul>
<li>
<a
href="http://router.vuejs.org/"
target="_blank"
>
vue-router
</a>
</li>
<li>
<a
href="http://vuex.vuejs.org/"
target="_blank"
>
vuex
</a>
</li>
<li>
<a
href="http://vue-loader.vuejs.org/"
target="_blank"
>
vue-loader
</a>
</li>
<li>
<a
href="https://github.com/vuejs/awesome-vue"
target="_blank"
>
awesome-vue
</a>
</li>
</ul>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
data () {
return {
msg: 'Welcome to Your Vue.js App'
}
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h1, h2 {
font-weight: normal;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>
DAPlatform-front/src/components/Index.vue 0 → 100644
<template>
<div>
<nav-header></nav-header>
<router-view></router-view>
</div>
</template>
<script>
import NavHeader from './NavHeader'
export default {
name: 'index',
data () {
return {
}
},
components: {
NavHeader
}
}
</script>
<!-- Add 'scoped' attribute to limit CSS to this component only -->
<style scoped>
</style>
DAPlatform-front/src/components/Login.vue 0 → 100644
<template>
<div class="login-container">
<div class="login-background-text">DAPlatform</div>
<div class="login-panel">
<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect"
active-text-color="#409EFF">
<el-menu-item index="1">登录</el-menu-item>
<el-menu-item index="2">注册</el-menu-item>
</el-menu>
<div class="input-item">
用户名：
<el-input class="input" v-model="username" placeholder="请输入用户名"></el-input>
</div>
<div class="input-item">
密码：
<el-input class="input" v-model="password" placeholder="请输入密码"></el-input>
</div>
<div class="input-item" v-if="activeIndex == '2'">
确认密码：
<el-input class="input" v-model="confirm" placeholder="请确认密码"></el-input>
</div>
<div class="input-item" v-if="activeIndex == '2'">
邮箱：
<el-input class="input" v-model="email" placeholder="请输入邮箱"></el-input>
</div>
<el-button v-if="activeIndex == '1'" class="btn" type="primary" @click="login">登录</el-button>
<el-button v-else class="btn" type="primary" @click="register">注册</el-button>
</div>
</div>
</template>
<script>
export default {
name: 'login',
data () {
return {
username: '',
password: '',
confirm: '',
email: '',
activeIndex: '1'
}
},
methods: {
handleSelect (key, keyPath) {
this.activeIndex = key
},
login () {
this.$router.push('/index').catch(data => {})
},
register () {
this.$router.push('/index').catch(data => {})
}
}
}
</script>
<!-- Add 'scoped' attribute to limit CSS to this component only -->
<style scoped lang='scss'>
.login-container {
position: relative;
min-width: 1400px;
min-height: 100vh;
background-color: #409EFF;
overflow: hidden;
.login-background-text {
position: absolute;
color: white;
font-size: 150px;
top: 30vh;
left: 5vw;
text-shadow: 30px 30px 0px rgba(255, 255, 255, 0.4);
z-index: 1;
}
.login-panel {
float: right;
width: 400px;
margin-right: 10vw;
margin-top: 20vh;
margin-bottom: 10vh;
padding-top: 20px;
background-color: white;
border-radius: 10px;
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
z-index: 100;
}
}
.input-item{
display: flex;
padding-left: 30px;
padding-right: 30px;
justify-content: space-between;
align-items: center;
margin-top: 30px;
.input{
width: 70%;
}
}
.btn{
width: 80%;
margin-top: 20px;
margin-bottom: 20px;
}
</style>
DAPlatform-front/src/components/NavHeader.vue 0 → 100644
<template>
<div class="nav-header-container">
<el-menu
:default-active="activeIndex"
class="el-menu-demo"
mode="horizontal"
background-color="#409EFF"
text-color="#fff"
active-text-color="#fff"
router>
<el-menu-item index="/taskhall">任务大厅</el-menu-item>
<el-menu-item index="/ongoing">我的任务</el-menu-item>
<el-menu-item index="/releasetask">发布任务</el-menu-item>
<el-menu-item index="/completed">已完成任务</el-menu-item>
<el-menu-item index="/check">待审核任务</el-menu-item>
<el-menu-item index="/publishtask">我的发布</el-menu-item>
<el-menu-item index="/userhome">个人中心</el-menu-item>
<el-menu-item class="logout-btn" index="/">退出登录</el-menu-item>
</el-menu>
</div>
</template>
<script>
export default {
name: 'nav-header',
data () {
return {
activeIndex: '/taskhall'
}
},
watch: {
// 对路由变化作出响应...
'$route' (to, from) {
var index = to.fullPath.indexOf('/', 1)
var toPath = to.fullPath.substring(0, index === -1 ? to.fullPath.length : index + 1)
this.activeIndex = toPath
}
},
methods: {
}
}
</script>
<!-- Add 'scoped' attribute to limit CSS to this component only -->
<style scoped lang='scss'>
@import '@/assets/scss/config.scss';
.nav-header-container{
padding-left: 10%;
padding-right: 10%;
min-width: $min-width;
background-color: $theme-color;
.logout-btn{
float: right;
}
}
</style>
DAPlatform-front/src/components/PublishTask.vue 0 → 100644
<template>
<div class="taskhall">
<el-container>
<el-main style="background-color: #FFFFFF">
<el-table
:data="tableData"
:header-cell-style="{color:'#409EFF'}"
height="570"
border
style="width: 100%">
<el-table-column
prop="taskId"
label="任务ID"
width="180">
</el-table-column>
<el-table-column
prop="splitNum"
label="分片数量"
width="180">
</el-table-column>
<el-table-column
prop="date"
label="发布时间"
width="180">
<template slot-scope="scope">
<i class="el-icon-time"></i>
<span style="margin-left: 10px">{{ scope.row.date }}</span>
</template>
</el-table-column>
<el-table-column
prop="name"
label="任务名称"
>
</el-table-column>
<el-table-column
prop="status"
label="任务状态"
width="180"
>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
width="180">
<template slot-scope="scope">
<el-button @click="handleClick(scope.row)" type="text" size="small">修改</el-button>
<el-button @click.native.prevent="deleteRow(scope.$index, tableData)" type="text" size="small"> 删除 </el-button>
</template>
</el-table-column>
</el-table>
</el-main>
</el-container>
</div>
</template>
<script>
export default {
data() {
return {
tableData: [{
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '单物体语义分割',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '人脸质量判断',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status:'已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status:'已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status:'已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status:'已发布'
}]
}
},
methods: {
deleteRow(index, rows) {//删除改行
rows.splice(index, 1);
},
}
}
</script>
<style>
.el-header, .el-footer {
background-color: #B3C0D1;
color: #333;
text-align: center;
line-height: 60px;
}
.el-aside {
background-color: #D3DCE6;
color: #333;
text-align: center;
line-height: 200px;
}
.el-main {
background-color: #E9EEF3;
color: #333;
text-align: center;
line-height: 36px;
}
body > .el-container {
margin-bottom: 40px;
}
.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
line-height: 260px;
}
.el-container:nth-child(7) .el-aside {
line-height: 320px;
}
</style>
DAPlatform-front/src/components/ReleaseTask.vue 0 → 100644
<template>
<div id="mission">
<el-container>
<!-- 头，用作导航栏-->
<el-header></el-header>
<el-main>
<el-form :model="dynamicValidateForm" ref="dynamicValidateForm" class="demo-dynamic">
<el-form-item>
<el-input v-model="taskName" @input="change($event)" placeholder="输入任务名称" style="width: 200px"></el-input>
<el-button type="primary" @click="submitForm('dynamicValidateForm')">创建任务</el-button>
<el-button @click="addDomain">添加分片</el-button>
</el-form-item>
<el-form-item>
<!-- 采用手风琴实现折叠-->
<el-collapse v-model="activeName" accordion>
<el-form-item v-for="(domain, index) in dynamicValidateForm.domains"
:key="domain.key"
:prop="'domains.' + index + '.value'">
<el-collapse-item
:title="'分片'+(++index)"
:name="index" style="border-bottom: 1px solid;border-bottom-color:white">
<!-- 上传图片-->
<el-row :gutter="20" >
<el-col span="8">
<el-upload
class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/"
:on-preview="handlePreview"
:on-remove="handleRemove"
:file-list="fileList"
list-type="picture">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
</el-upload>
<el-select v-model="value" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-col>
<el-col span="2" offset="4">
<el-button type="primary" plain @click.prevent="removeDomain(domain)">删除分片</el-button>
</el-col>
</el-row>
</el-collapse-item>
</el-form-item>
</el-collapse>
</el-form-item>
</el-form>
</el-main>
</el-container>
</div>
</template>
<script>
//export default {
// }
export default {
data() {
},
methods: {
handleRemove(file, fileList) {
console.log(file, fileList);
},
handlePreview(file) {
console.log(file);
}
}
}
</script>
<style>
#mission{
}
.el-header{
background-color: #409eff;
}
.el-main{
width: 90vw;
min-width: 800px;
/* border: solid; */
margin-left: auto;
margin-right: auto;
margin-top: 40px;
}
</style>
<script>
export default {
data() {
return {
dynamicValidateForm: {
domains: [{
value: ''
}],
},
options: [{
value: '1',
label: '文本分片'
}, {
value: '2',
label: '图像分片'
}],
value:'1'
};
},
methods: {
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
alert('submit!');
} else {
console.log('error submit!!');
return false;
}
});
},
resetForm(formName) {
this.$refs[formName].resetFields();
},
removeDomain(item) {
var index = this.dynamicValidateForm.domains.indexOf(item)
if (index !== -1) {
this.dynamicValidateForm.domains.splice(index, 1)
}
},
addDomain() {
this.dynamicValidateForm.domains.push({
value: '',
key: Date.now()
});
},
change(e){
this.$forceUpdate();
}
}
}
</script>
DAPlatform-front/src/components/Task.vue 0 → 100644
<template>
<div class="task-container">
<div class="task-panel">
<h2>{{task.title}}</h2>
<p>发布者：{{task.creater}}</p>
<p>发布时间：{{task.date}}</p>
<p v-if="task.type == 'text'">文本大小：{{task.size}}k</p>
<p v-else>图片张数：{{task.size}}张</p>
<el-divider></el-divider>
<h2>选择分片</h2>
<div class="pieces">
<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange" border>全选</el-checkbox>
<div style="margin: 15px 0;"></div>
<el-checkbox-group v-model="checkedPieces" @change="handleCheckedPiecesChange">
<el-checkbox class="el-checkbox" v-for="piece in pieces" :label="piece" :key="piece" border>文件数：{{piecesMap[piece]}}</el-checkbox>
</el-checkbox-group>
</div>
<el-button type="primary" @click="begin">开始任务</el-button>
</div>
</div>
</template>
<script>
export default {
name: 'task',
data () {
return {
task: {},
piecesMap: {},
pieces: [],
checkedPieces: [],
isIndeterminate: true,
checkAll: false
}
},
mounted () {
var self = this
var task = JSON.parse(decodeURIComponent(this.$route.params.task))
this.task = task
// 根据任务id拉取分片信息
this.axios.get('/getPieces', {
params: {
id: task.id
}
}).then(res => {
var piecesMap = {}
var pieces = []
for (let piece of res.data.data) {
piecesMap[piece.id] = piece.fileNum
pieces.push(piece.id)
}
self.piecesMap = piecesMap
self.pieces = pieces
})
},
methods: {
handleCheckAllChange (val) {
this.checkedPieces = val ? this.pieces : []
this.isIndeterminate = false
},
handleCheckedPiecesChange (value) {
let checkedCount = value.length
this.checkAll = checkedCount === this.pieces.length
this.isIndeterminate = checkedCount > 0 && checkedCount < this.pieces.length
console.log(value)
},
begin () {
if (this.checkedPieces.length === 0) {
alert('请选择分片')
}
}
}
}
</script>
<style lang="scss" scoped>
@import '@/assets/scss/config.scss';
@import '@/assets/scss/mixin.scss';
.task-container{
@include container;
.task-panel{
@include whiteBoard;
text-align: left;
padding: 30px 20px 30px 20px;
}
.pieces{
margin-bottom: 30px;
.el-checkbox{
margin-left: 0;
margin-bottom: 15px;
}
}
}
</style>
DAPlatform-front/src/components/TaskHall.vue 0 → 100644
<template>
<div class="taskhall-container">
<div class="taskhall-left">
<div class="filter-container">
<div class="filter-item">
任务名称：
<el-input class="filter-input" prefix-icon="el-icon-search" v-model="keywords" placeholder="请输入查询条件"></el-input>
</div>
<div class="filter-item">
<el-button class="filter-button" type="primary">查询</el-button>
</div>
<el-divider></el-divider>
</div>
<div class="tasklist-container">
<div class="tasklist">
<div class="task-item" v-for="(item, index) in tasks" :key='index'>
<div>{{item.title}}</div>
<div>发布人：{{item.creater}}&emsp;&emsp;发布时间：{{item.date}}&emsp;&emsp;
<span v-if="item.type == 'text'">文本大小：{{item.size}}k</span>
<span v-else>图片张数：{{item.size}}张</span>
</div>
<el-button class="task-enter-btn" type="primary" plain @click="enterTask(item)">进入任务</el-button>
</div>
</div>
<div class="page-navigator">
<el-pagination
:page-size="20"
:pager-count="11"
layout="prev, pager, next"
:total="1000">
</el-pagination>
</div>
</div>
</div>
<div class="taskhall-right">
<div class="notice">
<div class="notice-title">公告</div>
<div class="notice-body">
<img src="@/assets/empty.png" alt="暂无公告">
</div>
</div>
<div class="notice">
<div class="notice-title">公告</div>
<div class="notice-body">
<img src="@/assets/empty.png" alt="暂无公告">
</div>
</div>
</div>
</div>
</template>
<script>
const mock = true
if (mock) require('@/mock/api.js')
export default {
name: 'taskhall',
data () {
return {
activeName: '任务大厅',
tasks: [],
keywords: ''
}
},
mounted () {
this.axios.get('/getTasks').then(res => {
this.tasks = res.data.data
})
},
methods: {
handleClick (tab, event) {
console.log(tab, event)
},
enterTask (task) {
this.$router.push({
name: 'task',
params: { task: encodeURIComponent(JSON.stringify(task)) }
})
}
}
}
</script>
<!-- Add 'scoped' attribute to limit CSS to this component only -->
<style scoped lang='scss'>
@import '@/assets/scss/config.scss';
@import '@/assets/scss/mixin.scss';
.taskhall-container{
@include container;
.taskhall-left{
float: left;
width: 70%;
padding: 30px 20px 30px 20px;
@include whiteBoard;
.filter-container{
.filter-item{
display: flex;
align-items: center;
margin-bottom: 15px;
.filter-input{
margin-left: 20px;
width: 300px;
}
}
}
.tasklist-container{
.tasklist{
.task-item{
border-bottom: 1px solid $divider-color;
text-align: left;
padding: 10px 0px 22px;
position: relative;
div:first-of-type{
font-size: 18px;
margin-bottom: 7px;
font-weight: bold;
}
div:last-of-type{
font-size: 14px;
color: #959595;
}
.task-enter-btn{
position: absolute;
right: 0px;
bottom: 10px;
}
}
}
}
.page-navigator{
margin-top: 30px;
}
}
.taskhall-right{
float: right;
width: 25%;
.notice{
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
margin-bottom: 30px;
.notice-title{
background-color: $theme-color;
color: white;
padding: 10px 0;
}
.notice-body{
background-color: white;
height: 200px;
display: flex;
align-items: center;
justify-content: center;
}
}
}
}
</style>
DAPlatform-front/src/components/UserHome.vue 0 → 100644
<template>
<div class="taskhall">
<el-container>
<el-aside width="300px">
<div>
<img src ="../assets/logo.png">
</div>
</el-aside>
<el-main>
<el-row>
<el-col :span="6"><div class="grid-content bg-blue">用户名</div></el-col>
<el-col :span="18"><div class="grid-content bg-blue-light">小明</div></el-col>
</el-row>
<el-row>
<el-col :span="6"><div class="grid-content bg-blue">用户ID</div></el-col>
<el-col :span="18"><div class="grid-content bg-blue-light">4</div></el-col>
</el-row>
<el-row>
<el-col :span="6"><div class="grid-content bg-blue">邮箱</div></el-col>
<el-col :span="18"><div class="grid-content bg-blue-light">xxx@buaa.edu.cn</div></el-col>
</el-row>
<el-row>
<el-col :span="6"><div class="grid-content bg-blue">类型</div></el-col>
<el-col :span="18"><div class="grid-content bg-blue-light">任务发布者</div></el-col>
</el-row>
<el-row>
<el-col :span="6"><div class="grid-content bg-blue">密码</div></el-col>
<el-col :span="18"><div class="grid-content bg-blue-light"> <el-button type="danger" plain>修改密码</el-button></div></el-col>
</el-row>
<el-row>
<el-col :span="24"><div class="grid-line bg-blue-dark" height:2px></div></el-col>
</el-row>
<el-row>
<el-col :span="8"><div class="grid-content bg-blue">类型</div></el-col>
<el-col :span="8"><div class="grid-content bg-blue-light">积分</div></el-col>
<el-col :span="8"><div class="grid-content bg-blue">准确率</div></el-col>
</el-row>
<el-row>
<el-col :span="8"><div class="grid-content bg-blue">图象</div></el-col>
<el-col :span="8"><div class="grid-content bg-blue-light">233</div></el-col>
<el-col :span="8"><div class="grid-content bg-blue">66%</div></el-col>
</el-row>
<el-row>
<el-col :span="8"><div class="grid-content bg-blue">文本</div></el-col>
<el-col :span="8"><div class="grid-content bg-blue-light">323</div></el-col>
<el-col :span="8"><div class="grid-content bg-blue">77%</div></el-col>
</el-row>
<el-row>
<el-col :span="8"><div class="grid-content bg-blue">发布</div></el-col>
<el-col :span="8"><div class="grid-content bg-blue-light">333</div></el-col>
<el-col :span="8"><div class="grid-content bg-blue">\</div></el-col>
</el-row>
</el-main>
</el-container>
</div>
</template>
<style>
/* .taskhall{
width: 90vw;
min-width: 800px;
border: solid;
margin-left: auto;
margin-right: auto;
margin-top: 0px;
}*/
.el-aside {
background-color: #e1f2fb !important;/*#8EC3F9 !important;*/
color: #FFFFFF;
text-align: center;
line-height: 200px;
}
.el-aside img{
margin-top: 50px;
width: 200px;
height: 200px;
}
.el-main {
background-color: #ffffff !important;
color: #FFFFFF;
text-align: center;
line-height: 40px;
width: 80%;
}
body > .el-container {
margin-bottom: 40px;
}
.el-row {
margin-bottom: 20px;
&:last-child {
margin-bottom: 0;
}
}
.el-col {
border-radius: 4px;
}
.bg-blue-dark {
background: #769fcd;
}
.bg-blue {
background: #CAE4FF;/*#8EC3F9;*/
}
.bg-blue-light {
background: #e1f2fb !important;
}
.grid-content {
border-radius: 4px;
height: 40px;
}
.grid-line {
border-radius: 4px;
height: 6px;
}
.row-bg {
padding: 10px 0;
background-color: #FFFFFF;
}
</style>
\ No newline at end of file
DAPlatform-front/src/components/ongoingtask.vue 0 → 100644
<template>
<div class="taskhall">
<el-container>
<el-main style="background-color: #FFFFFF">
<el-table
:data="tableData"
:header-cell-style="{color:'#409EFF'}"
height="570"
border
style="width: 100%">
<el-table-column
prop="taskId"
label="任务ID"
width="180">
</el-table-column>
<el-table-column
prop="splitNum"
label="分片数量"
width="180">
</el-table-column>
<el-table-column
prop="date"
label="发布时间"
width="180">
<template slot-scope="scope">
<i class="el-icon-time"></i>
<span style="margin-left: 10px">{{ scope.row.date }}</span>
</template>
</el-table-column>
<el-table-column
prop="name"
label="任务名称"
>
</el-table-column>
<el-table-column
prop="status"
label="任务状态"
width="180"
>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
width="180">
<template slot-scope="scope">
<el-button @click="select()" type="text" size="small">修改</el-button>
<el-button @click.native.prevent="deleteRow(scope.$index, tableData)" type="text" size="small"> 删除 </el-button>
</template>
</el-table-column>
</el-table>
</el-main>
</el-container>
</div>
</template>
<script>
export default {
data() {
return {
tableData: [{
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '单物体语义分割',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '人脸质量判断',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status:'已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status:'已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status:'已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status: '已发布'
}, {
taskId:'1',
author:'小明',
splitNum:'3',
date: '2016-05-03',
name: '图片属性标注',
status:'已发布'
}]
}
},
methods: {
deleteRow(index, rows) {//删除改行
rows.splice(index, 1);
},
select () {
this.$router.replace('/select')
},
}
}
</script>
<style>
.el-header, .el-footer {
background-color: #B3C0D1;
color: #333;
text-align: center;
line-height: 60px;
}
.el-aside {
background-color: #D3DCE6;
color: #333;
text-align: center;
line-height: 200px;
}
.el-main {
background-color: #E9EEF3;
color: #333;
text-align: center;
line-height: 36px;
}
body > .el-container {
margin-bottom: 40px;
}
.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
line-height: 260px;
}
.el-container:nth-child(7) .el-aside {
line-height: 320px;
}
</style>
DAPlatform-front/src/components/textAnnotation/SelectText.vue 0 → 100644
<template>
<div class="select-container">
<el-container class="filter-container">
<el-main style="background-color: #FFFFFF">
<div style="overflow-y:auto;height:100%;">
<div @mouseup="highlight()">
<!-- <div @mouseup="highlight()">-->
<ul class="list">
<li v-for="it in msg" :key="it.message">
<div class="msg" v-html="it">{{it}}</div><br/>
</li>
</ul>
</div>
<div>
<el-button type="primary">保存</el-button>
<el-button type="primary" @click="save()">提交</el-button>
</div>
<!-- 弹窗-->
<el-dialog title="请标注" :visible.sync="ifAlert">
<div style="overflow: auto;height: 50vh">
<el-select v-model="value" placeholder="选择标注对象">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-button type="primary">新建</el-button>
<div style="margin-top: 10px;margin-bottom: 10px">
<span>
基本信息：名称：可爱的滑坡；经度：null；纬度：null；
</span>
</div>
<el-tree
:data="data"
:props="defaultProps"
accordion
@node-click="handleNodeClick"
show-checkbox>
</el-tree>
</div>
<div style="width: 100%;height: 5px"></div>
<el-button type="primary" style="margin-top: 30px" @click="closeAddTag">确定</el-button>
</el-dialog>
<!-- 弹窗-->
</div>
</el-main>
</el-container>
</div>
</template>
<script>
export default {
data () {
const item = {
date: '2020-05-02',
name: '小明',
address: '那是我心中最美的“第三极”——第二次青藏科考青年说'
}
return {
data: [{
label: '一级 1',
children: [{
label: '二级 1-1',
children: [{
label: '三级 1-1-1'
}]
}]
}, {
label: '一级 2',
children: [{
label: '二级 2-1',
children: [{
label: '三级 2-1-1'
}]
}, {
label: '二级 2-2',
children: [{
label: '三级 2-2-1'
}]
}]
}, {
label: '一级 3',
children: [{
label: '二级 3-1',
children: [{
label: '三级 3-1-1'
}]
}, {
label: '二级 3-2',
children: [{
label: '三级 3-2-1'
}]
}]
}],
defaultProps: {
children: 'children',
label: 'label'
},
count: 1,
tableData: Array(20).fill(item),
msg: ['那是我心中最美的“第三极”——第二次青藏科考青年说',
'2020-05-06 11:08 来源：新华网 编辑：矿材网',
'“看到国家自主研发的‘极目一号’浮空器从纳木错科考站升起，她宛若白鲸，越升越高，融入了星海。古老的‘第三极’与前沿的科技，在星空中融为一体，那就是我心中最美的‘第三极’风情。”中国科学院空天信息创新研究院的屈维说。',
'2019年5月23日，中国科学院空天信息创新研究院研制的“极目一号”浮空器在第二次青藏高原综合科学考察研究中，在纳木错升空达到海拔7003米的高度，创造了迄今已知同类型、同量级浮空器驻空高度的世界纪录。',
'第二次青藏高原综合科考从2017年8月全面启动，在之后5到10年内，大批科研工作者将对青藏高原的水、生态、人类活动等环境问题进行考察研究。我国首次青藏高原综合科学考察研究是20世纪70年代，这次综合科考研究积累了大量科学资料，为青藏高原生态保护和社会经济发展提供了科学依据。',
'相对于南极和北极，人们把青藏高原称为世界“第三极”。',
'中国科学家认同“第三极”的称号，除了因为青藏高原和南极、北极有表面上的相似，还因为青藏高原的“一举一动”都对地球的整体环境有着重要影响。',
'“当科考车翻过山头，映入眼帘的便是海拔4700米的纳木错与远处的雪山，碧蓝的湖水倒映着树木、雪山，一相逢便割舍不下。”2018年参加工作的屈维说，能参与第二次青藏科考，能看到“第三极”的多样风情，是他的幸运。', '那是我心中最美的“第三极”——第二次青藏科考青年说',
'2020-05-06 11:08 来源：新华网 编辑：矿材网',
'“看到国家自主研发的‘极目一号’浮空器从纳木错科考站升起，她宛若白鲸，越升越高，融入了星海。古老的‘第三极’与前沿的科技，在星空中融为一体，那就是我心中最美的‘第三极’风情。”中国科学院空天信息创新研究院的屈维说。',
'2019年5月23日，中国科学院空天信息创新研究院研制的“极目一号”浮空器在第二次青藏高原综合科学考察研究中，在纳木错升空达到海拔7003米的高度，创造了迄今已知同类型、同量级浮空器驻空高度的世界纪录。',
'第二次青藏高原综合科考从2017年8月全面启动，在之后5到10年内，大批科研工作者将对青藏高原的水、生态、人类活动等环境问题进行考察研究。我国首次青藏高原综合科学考察研究是20世纪70年代，这次综合科考研究积累了大量科学资料，为青藏高原生态保护和社会经济发展提供了科学依据。',
'相对于南极和北极，人们把青藏高原称为世界“第三极”。',
'中国科学家认同“第三极”的称号，除了因为青藏高原和南极、北极有表面上的相似，还因为青藏高原的“一举一动”都对地球的整体环境有着重要影响。',
'“当科考车翻过山头，映入眼帘的便是海拔4700米的纳木错与远处的雪山，碧蓝的湖水倒映着树木、雪山，一相逢便割舍不下。”2018年参加工作的屈维说，能参与第二次青藏科考，能看到“第三极”的多样风情，是他的幸运。'],
ifAlert: false,
options: [{
value: '选项1',
label: '1.可爱的滑坡'
}, {
value: '选项2',
label: '2.不可爱的滑坡'
}, {
value: '选项3',
label: '3.奇怪的滑坡'
}, {
value: '选项4',
label: '4.平凡的滑坡'
}, {
value: '选项5',
label: '5.最后一个滑坡'
}],
value: ''
}
},
methods: {
handleCheckChange (data, checked, indeterminate) {
console.log(data, checked, indeterminate);
},
handleNodeClick(data) {
console.log(data);
},
toTextUndo: function () {
this.$router.push('/')
},
toTextEnd: function () {
this.$router.push('/')
},
toTextOther: function () {
this.$router.push('/')
},
closeAddTag () {
this.ifAlert = 0
},
highlight: function () {
this.ifAlert = true
const search = window.getSelection().toString()
this.msg = this.msg.map(item => {
let replaceReg = new RegExp(search, 'g')// 匹配关键字正则
let replaceString = '<span class="highlights-text">' + search + '</span>' // 高亮替换v-html值
return item.replace(replaceReg, replaceString)
})
},
save () {
this.$router.replace('/completed')
},
}
}
</script>
<style scoped lang='scss'>
@import '@/assets/scss/config.scss';
@import '@/assets/scss/mixin.scss';
.select-container{
@include container;
.filter-container{
float: center;
width: 100%;
padding: 35px 40px 50px 40px;
@include whiteBoard;
}
}
.msg{
text-align:left;
font-size:18px;
line-height: 30px;
}
.highlights-text {
color: #ff5134;
}
.addTag{
width: 30%;
height: 500px;
background-color: #ffffff;
position: fixed;
top: 50%;
margin-top: -250px;
left: 55%;
margin-left: -25%;
border: 1px solid darkgrey;
border-radius: 10px;
padding: 10px;
}
.addTagTitle{
margin-top: 15px;
margin-bottom: 10px;
}
</style>
DAPlatform-front/src/components/textAnnotation/Table.vue 0 → 100644
<template>
<el-container>
<el-main style="background-color: #FFFFFF">
<div>
<!--鼠标左键-->
<div>
<ul @click="openTag()">
<el-table
:data="tableData1"
border
style="width: 100%">
<el-table-column
prop="a"
label="列1"
width="150">
</el-table-column>
<el-table-column
prop="b"
label="列2"
width="150">
</el-table-column>
<el-table-column
prop="c"
label="列3"
width="150">
</el-table-column>
<el-table-column
prop="d"
label="列4"
width="150">
</el-table-column>
<el-table-column
prop="e"
label="列5">
</el-table-column>
</el-table>
<!--li v-for="it in msg" :key="it">
<div v-html="it">{{it}}</div>
</li-->
</ul>
</div>
<el-col :span="6"><div class="grid-content"></div></el-col>
<el-col :span="6"><div class="grid-content"></div></el-col>
<el-col :span="6"><div class="grid-content"></div></el-col>
<el-col :span="6"><div class="grid-content">
<el-button @click="save" type="success" round>保存</el-button>
</div></el-col>
</div>
</el-main>
</el-container>
</template>
<script>
export default {
data() {
const item = {
date: '2020-05-02',
name: '小明',
address: '那是我心中最美的“第三极”——第二次青藏科考青年说'
};
return {
tableData: Array(20).fill(item),
tableData1: [{
a:'fqw',
b:'271',
c:'13r3',
d:'2456',
e:'dv',
},
{
a:'fqw',
b:'271',
c:'13r3',
d:'2456',
e:'dv',
},{
a:'fqw',
b:'271',
c:'13r3',
d:'2456',
e:'dv',
},{
a:'fqw',
b:'271',
c:'13r3',
d:'2456',
e:'dv',
},{
a:'fqw',
b:'271',
c:'13r3',
d:'2456',
e:'dv',
}
],
msg: [' 123 | 291 | 934 | 234 | 291 | 934 | 234 | 291 | 934 | 234 | 291 | 934 | 634 | <span class="highlights-text">271</span> | 563 | 634 | <span class="highlights-text">271</span> | 823 | 201 ',
' 323 | 291 | 934 | 234 | 291 | 934 | 234 | 291 | 934 | 234 | 291 | 563 | 634 | <span class="highlights-text">271</span> | 434 | <span class="highlights-text">734</span> | 531 | 634 | 284 ',
' 563 | 634 | <span class="highlights-text">271</span> | 563 | 634 | <span class="highlights-text">271</span> | 563 | 634 | <span class="highlights-text">271</span> | 563 | 634 | <span class="highlights-text">271</span> | 173 | <span class="highlights-text">734</span> | 531 | 634 | 284 | 201 | <span class="highlights-text">834</span> ',
' 173 | <span class="highlights-text">734</span> | 531 | 634 | <span class="highlights-text">734</span> | 531 | 173 | <span class="highlights-text">734</span> | 531 | 173 | <span class="highlights-text">734</span> | 531 | 823 | 284 | 201 | <span class="highlights-text">834</span> | 284 | 201 | <span class="highlights-text">834</span> ',
' 823 | 284 | 201 | <span class="highlights-text">834</span> | 284 | 201 | <span class="highlights-text">834</span> | 284 | 201 | <span class="highlights-text">834</span> | 284 | 201 | <span class="highlights-text">834</span> | 284 | 201 | <span class="highlights-text">834</span> | 284 | 201 | <span class="highlights-text">834</span> ',]
}
},
methods:{
save() {
this.$message({
message: '保存成功！',
type: 'success'
});
this.$router.replace('/text')
},
openTag(){
const h = this.$createElement;
this.$msgbox({
title: '标注',
message: h('p', null, [
h('el-card', null, [
h('div', { style: 'color: teal' }, '实体1'),
h('el-checkbox', null, '属性1'),
h('span', null, ' '),
h('el-checkbox', null, '属性2 '),
h('span', null, ' '),
h('el-checkbox', null, '属性3 '),
]),
h('br', null, ' '),
h('el-card', null, [
h('div', { style: 'color: teal' }, '实体2'),
h('el-checkbox', null, '属性1'),
h('span', null, ' '),
h('el-checkbox', null, '属性2 '),
h('span', null, ' '),
h('el-checkbox', null, '属性3 '),
]),
h('br', null, ' '),
,h('el-card', null, [
h('div', { style: 'color: teal' }, '实体3'),
h('el-checkbox', null, '属性1'),
h('span', null, ' '),
h('el-checkbox', null, '属性2 '),
h('span', null, ' '),
h('el-checkbox', null, '属性3 '),
h('span', null, ' '),
h('el-checkbox', null, '属性4 '),
]),
h('br', null, ' '),
h('el-card', null, [
h('div', { style: 'color: teal' }, '实体4'),
h('el-checkbox', null, '属性1'),
h('span', null, ' '),
h('el-checkbox', null, '属性2 '),
h('span', null, ' '),
h('el-checkbox', null, '属性3 '),
])
]),
showCancelButton: true,
confirmButtonText: '保存',
cancelBcanceluttonText: '还原',
beforeClose: (action, instance, done) => {
if (action === 'confirm') {
instance.confirmButtonLoading = true;
instance.confirmButtonText = '保存中...';
setTimeout(() => {
done();
setTimeout(() => {
instance.confirmButtonLoading = false;
}, 100);
}, 1000);
} else{
done()
}
}
}).then(action => {
this.$message({
type: 'info',
message: 'action: ' + action
});
});
},
select(){
this.$router.replace('/')
},
tag(){
this.$router.replace('/text')
},
table(){
this.$router.replace('/table')
},
select1(){
this.$router.replace('/select')
},
tag1(){
this.$router.replace('/deleteTag')
},
}}
</script>
<style>
.tableMain{
background-color: rgb(238, 241, 246);
}
.highlights-text {
color: #ff5134;
}
.el-row {
margin-bottom: 20px;
}
.el-col {
border-radius: 4px;
}
.grid-content {
border-radius: 4px;
min-height: 36px;
}
.row-bg {
padding: 10px 0;
background-color: #f9fafc;
}
.el-header {
background-color: #B3C0D1;
color: #333;
line-height: 60px;
}
.el-aside {
color: #333;
}
</style>
DAPlatform-front/src/main.js
...@@ -6,17 +6,15 @@ import router from './router' ...@@ -6,17 +6,15 @@ import router from './router'
import ElementUI from 'element-ui' import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css' import 'element-ui/lib/theme-chalk/index.css'
import axios from 'axios' import axios from 'axios'
import './assets/css/common.css' import VueAxios from 'vue-axios'
Vue.use(ElementUI) axios.defaults.baseURL = '/api'
axios.defaults.timeout = 8000
axios.interceptors.request.use((config) => { Vue.use(VueAxios, axios)
config.headers['X-Requested-With'] = 'XMLHttpRequest' Vue.config.productionTip = false
return config
})
let eventBus = new Vue() Vue.use(ElementUI)
Vue.prototype.bus = eventBus
/* eslint-disable no-new */ /* eslint-disable no-new */
new Vue({ new Vue({
......
DAPlatform-front/src/mock/api.js 0 → 100644
import Mock from 'mockjs'
Mock.mock('/api/getTasks', {
'status': 0,
'data|10': [{
'id|1-9999': 1,
'title|1': ['冰箱物品标注', '新通路图片', '人脸识别', '客服语音', '行人十字画框', '动物打点标注'],
'creater|1': ['王强', '赵信良', '李轩辕', '田予欢', '张三', '李斯'],
'date': Mock.Random.date('yyyy/MM/dd'),
'size|20-1000': 1,
'type|1': ['text', 'image'],
'pieces|5-30': 1
}]
})
Mock.mock(/\/api\/getPieces\?id=[0-9]+/, {
'status': 0,
'data|10-50': [{
'id|1-9999': 1,
'fileNum|50-100': 1
}]
})
DAPlatform-front/src/router/index.js
import Vue from 'vue' import Vue from 'vue'
import Router from 'vue-router' import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld' import Login from '../components/Login'
import Layout from '@/components/Layout' import userhome from '../components/UserHome'
import TaskHall from '../components/Taskhall'
import Index from '../components/Index'
import completed from '../components/CompletedTask'
import check from '../components/CheckTask'
import release from '../components/ReleaseTask'
import publishtask from '../components/PublishTask'
import ongoingtask from '../components/ongoingtask'
import SelectText from '../components/textAnnotation/SelectText'
import Table from '../components/textAnnotation/Table'
Vue.use(Router) Vue.use(Router)
export default new Router({ export default new Router({
routes: [ routes: [
{ {
path: '/', path: '/index',
name: 'Layout', name: 'index',
component: Layout redirect: '/taskhall',
component: Index,
children: [
{
path: '/taskhall',
name: 'taskhall',
component: TaskHall
},
{
path: '/task/:task',
name: 'task',
component: () => import('../components/Task')
},
{
path: '/userhome',
name: 'userhome',
component: userhome
},
{
path: '/completed',
name: 'completed',
component: completed
},
{
path: '/check',
name: 'check',
component: check
},
{
path: '/releasetask',
name: 'release',
component: release
}, },
{ {
path: '/HelloWorld', path: '/publishtask',
name: 'HelloWorld', name: publishtask,
component: HelloWorld component: publishtask
},
{
path: '/ongoing',
name: ongoingtask,
component: ongoingtask
},
{
path: '/select',
name: 'SelectText',
component: SelectText
},
{
path: '/table',
name: 'table',
component: Table
},
]
},
{
path: '/',
name: 'login',
component: Login
} }
] ]
}) })
DAPlatform-front/static/template.json 0 → 100644
{
"entityList" : [
{
"滑坡" : [
{
"基本信息" : [
{
"滑坡名称" : null,
"地理位置" : null,
"行政位置" : null,
"坐标" : [
{
"经度" : null,
"纬度" : null
}
]
}
]
}
]
}
]
}
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