Skip to content

F
founder_vue
Commit 6bc1ffc3 by 米嘉伟
Options

进度条 穿梭框

parent 5b64d319
Showing with 336 additions and 25 deletions
src/plugins/axios.js
...@@ -25,7 +25,7 @@ var timer; ...@@ -25,7 +25,7 @@ var timer;
let config = { let config = {
// baseURL: process.env.baseURL || process.env.apiUrl || "" // baseURL: process.env.baseURL || process.env.apiUrl || ""
timeout: 60 * 1000 // Timeout timeout: 60 * 5 * 1000 // Timeout
// withCredentials: true, // Check cross-site Access-Control // withCredentials: true, // Check cross-site Access-Control
// Authorization: sessionStorage.getItem("token") || "" // Authorization: sessionStorage.getItem("token") || ""
// headers: { // headers: {
...@@ -99,12 +99,12 @@ Plugin.install = function (Vue) { ...@@ -99,12 +99,12 @@ Plugin.install = function (Vue) {
window.axios = _axios; window.axios = _axios;
Object.defineProperties(Vue.prototype, { Object.defineProperties(Vue.prototype, {
axios: { axios: {
get() { get () {
return _axios; return _axios;
} }
}, },
$axios: { $axios: {
get() { get () {
return _axios; return _axios;
} }
} }
......
src/views/AllPersonnelBase/dclb.vue
...@@ -160,6 +160,39 @@ ...@@ -160,6 +160,39 @@
label="任务号" label="任务号"
width="220" width="220"
> >
<template slot-scope="scope">
<svg-icon
style="
width: 0.875rem;
height: 0.6875rem;
margin-bottom: 0.125rem;
margin-left: 0.3125rem;
"
v-if="scope.row.personExportRecordGrandchildren || scope.row.personExportRecordGrandchildren === null"
icon-class="tree_f"
>
</svg-icon>
<svg-icon
style="
width: 0.8125rem;
height: 0.375rem;
margin: 0 0 0.1875rem 0;
"
v-else-if="!scope.row.personExportRecordGrandchildren || scope.row.personExportRecordGrandchildren !== null"
icon-class="tree_c"
></svg-icon>
{{
scope.row.personExportRecordGrandchildren || scope.row.personExportRecordGrandchildren === null
? scope.row.taskNumber
: scope.row.taskNumber
}}
<div
v-show="scope.row.personExportRecordGrandchildren && scope.row.personExportRecordGrandchildren !== null"
class="children-count"
>
{{ scope.row.personExportRecordGrandchildren ? scope.row.personExportRecordGrandchildren.length : 0 }}
</div>
</template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="barcode" prop="barcode"
...@@ -192,7 +225,7 @@ ...@@ -192,7 +225,7 @@
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="collectIdcard" prop="collectIdName"
label="采集二代证" label="采集二代证"
width="200" width="200"
> >
...@@ -204,7 +237,7 @@ ...@@ -204,7 +237,7 @@
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="exportType" prop="exportName"
label="导出模式" label="导出模式"
width="auto" width="auto"
> >
...@@ -237,6 +270,39 @@ ...@@ -237,6 +270,39 @@
label="任务号" label="任务号"
width="220" width="220"
> >
<template slot-scope="scope">
<svg-icon
style="
width: 0.875rem;
height: 0.6875rem;
margin-bottom: 0.125rem;
margin-left: 0.3125rem;
"
v-if="scope.row.caseExportRecordGrandchildren || scope.row.caseExportRecordGrandchildren === null"
icon-class="tree_f"
>
</svg-icon>
<svg-icon
style="
width: 0.8125rem;
height: 0.375rem;
margin: 0 0 0.1875rem 0;
"
v-else-if="!scope.row.caseExportRecordGrandchildren || scope.row.caseExportRecordGrandchildren !== null"
icon-class="tree_c"
></svg-icon>
{{
scope.row.caseExportRecordGrandchildren || scope.row.caseExportRecordGrandchildren === null
? scope.row.taskNumber
: scope.row.taskNumber
}}
<div
v-show="scope.row.caseExportRecordGrandchildren && scope.row.caseExportRecordGrandchildren !== null"
class="children-count"
>
{{ scope.row.caseExportRecordGrandchildren ? scope.row.caseExportRecordGrandchildren.length : 0 }}
</div>
</template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="barcode" prop="barcode"
...@@ -251,7 +317,7 @@ ...@@ -251,7 +317,7 @@
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="exportType" prop="exportName"
label="导出模式" label="导出模式"
width="200" width="200"
> >
...@@ -297,7 +363,8 @@ ...@@ -297,7 +363,8 @@
</div> </div>
</template> </template>
<script> <script>
import "@/icons/tree_f.svg";
import "@/icons/tree_c.svg";
export default { export default {
name: "gzlb", name: "gzlb",
data () { data () {
...@@ -799,3 +866,86 @@ export default { ...@@ -799,3 +866,86 @@ export default {
color: #333333; color: #333333;
} }
</style> </style>
<!--table树-->
<style scoped lang="scss">
.children-count {
width: 34px;
font-size: 12px;
text-align: center;
background: #f6f8fa;
border-radius: 11px;
position: absolute;
right: 10px;
top: 25%;
}
.el-tree /deep/ .el-tree-node__expand-icon.expanded {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
/*有子节点 且未展开*/
.el-table /deep/ .el-icon-arrow-right:before {
// background: url("../../icons/tree_f.svg") no-repeat 0 3px;
content: "";
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*有子节点 且已展开*/
.el-table /deep/ .el-table__expand-icon--expanded {
.el-icon-arrow-right:before {
// background: url("../../icons/tree_c.svg") no-repeat 0 3px;
content: "";
display: block;
width: 15px;
height: 20px;
font-size: 18px;
background-size: 21px;
}
}
/*没有子节点*/
.el-tree
/deep/
.el-tree-node__expand-icon.is-leaf::before
.el-table
/deep/
.el-table__placeholder::before {
// background: url("../../icons/tree_f.svg") no-repeat 0 3px;
content: "";
display: block;
width: 16px;
height: 18px;
font-size: 16px;
background-size: 16px;
}
/deep/.el-table--enable-row-hover .el-table__body tr:hover {
cursor: pointer;
}
</style>
<style lang="scss" >
.el-table__expand-icon {
position: absolute;
right: 45px;
cursor: pointer;
color: #b51f1f;
transition: transform 0.2s ease-in-out;
width: 11px;
height: 11px;
/* border: black 1px solid; */
margin: 0;
background-image: url("../../assets/img/confirm/expend.png");
background-position: center;
background-size: 11px;
background-repeat: no-repeat;
}
.el-table__expand-icon.el-table__expand-icon--expanded {
width: 11px;
height: 11px;
background-image: url("../../assets/img/confirm/shrink.png");
background-position: center;
background-size: 11px;
background-repeat: no-repeat;
transform: rotate(180deg) !important;
}
</style>
src/views/drFPTX/Index.vue
...@@ -393,10 +393,10 @@ ...@@ -393,10 +393,10 @@
:modal-append-to-body="false" :modal-append-to-body="false"
> >
<div v-if="showProgress"> <div v-if="showProgress">
<!-- <el-progress <el-progress
type="circle" type="circle"
:percentage="UploadPercent" :percentage="UploadPercent"
></el-progress> --> ></el-progress>
<div style="margin-top:.9375rem; margin-bottom:.9375rem;font-size: .875rem;font-family: MicrosoftYaHei;color: #909090;">正在解析指纹文件，点击“取消”可终止处理</div> <div style="margin-top:.9375rem; margin-bottom:.9375rem;font-size: .875rem;font-family: MicrosoftYaHei;color: #909090;">正在解析指纹文件，点击“取消”可终止处理</div>
<el-button @click="abort">取 消</el-button> <el-button @click="abort">取 消</el-button>
</div> </div>
...@@ -440,8 +440,8 @@ export default { ...@@ -440,8 +440,8 @@ export default {
fptxWidth3: 100, fptxWidth3: 100,
action: '', action: '',
fileList: [], fileList: [],
UploadPercent: null, UploadPercent: 0,
percentage: null, percentage: 0,
dialogVisible: false, // 进度条弹窗 dialogVisible: false, // 进度条弹窗
showProgress: true, // 进度条（正在导入） showProgress: true, // 进度条（正在导入）
drlx: 3, // 导入类型 drlx: 3, // 导入类型
...@@ -562,7 +562,7 @@ export default { ...@@ -562,7 +562,7 @@ export default {
// console.log(event) // console.log(event)
this.dialogVisible = true; this.dialogVisible = true;
// this.UploadPercent = Number(file.percentage.toFixed(0)); // this.UploadPercent = Number(file.percentage.toFixed(0));
this.UploadPercent = Number(event.percent.toFixed()) // this.UploadPercent = Number(event.percent.toFixed())
// if (this.UploadPercent == 99) { // if (this.UploadPercent == 99) {
// // this.dialogVisible = false; // // this.dialogVisible = false;
// // this.$refs.upload.clearFiles() // // this.$refs.upload.clearFiles()
...@@ -678,6 +678,7 @@ export default { ...@@ -678,6 +678,7 @@ export default {
}, },
// 上传 // 上传
submitUpload () { submitUpload () {
let that = this
if (this.nowSelectRightData.length == 0) { if (this.nowSelectRightData.length == 0) {
this.$message.error('请选择要上传的文件') this.$message.error('请选择要上传的文件')
} else { } else {
...@@ -701,7 +702,15 @@ export default { ...@@ -701,7 +702,15 @@ export default {
method: 'post', method: 'post',
url: this.action, url: this.action,
data: formData, data: formData,
loading: false loading: false,
onUploadProgress: function (progressEvent) {
// this.dialogVisible = true;
console.log(progressEvent, 1);
that.UploadPercent = ((progressEvent.loaded / 10 * 9.9) / progressEvent.total).toFixed(2) * 100
console.log(that.UploadPercent, 123)
// Number(event.percent.toFixed())
},
}).then(res => { }).then(res => {
if (res.data.code === 0) { if (res.data.code === 0) {
// this.tableDate = response.data.ret.list; // this.tableDate = response.data.ret.list;
......
src/views/drFPTX/RAList.vue
...@@ -258,13 +258,46 @@ ...@@ -258,13 +258,46 @@
<el-table-column <el-table-column
prop="taskNumber" prop="taskNumber"
label="任务号" label="任务号"
width="220" width="300"
> >
<template slot-scope="scope">
<svg-icon
style="
width: 0.875rem;
height: 0.6875rem;
margin-bottom: 0.125rem;
margin-left: 0.3125rem;
"
v-if="scope.row.pcImportRecordGrandchildren || scope.row.pcImportRecordGrandchildren === null"
icon-class="tree_f"
>
</svg-icon>
<svg-icon
style="
width: 0.8125rem;
height: 0.375rem;
margin: 0 0 0.1875rem 0;
"
v-else-if="!scope.row.pcImportRecordGrandchildren || scope.row.pcImportRecordGrandchildren !== null"
icon-class="tree_c"
></svg-icon>
{{
scope.row.pcImportRecordGrandchildren || scope.row.pcImportRecordGrandchildren === null
? scope.row.taskNumber
: scope.row.taskNumber
}}
<div
v-show="scope.row.pcImportRecordGrandchildren && scope.row.pcImportRecordGrandchildren !== null"
class="children-count"
>
{{ scope.row.pcImportRecordGrandchildren ? scope.row.pcImportRecordGrandchildren.length : 0 }}
</div>
</template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="fileName" prop="fileName"
label="文件名" label="文件名"
width="300" width="320"
show-overflow-tooltip show-overflow-tooltip
> >
</el-table-column> </el-table-column>
...@@ -275,19 +308,19 @@ ...@@ -275,19 +308,19 @@
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="dataType" prop="dataTypeName"
label="类型" label="类型"
width="200" width="100"
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="logicDatabase" prop="logicDatabase"
label="逻辑分库" label="逻辑分库"
width="200" width="100"
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="status" prop="statusName"
label="状态" label="状态"
width="auto" width="auto"
> >
...@@ -295,7 +328,7 @@ ...@@ -295,7 +328,7 @@
<el-table-column <el-table-column
fixed="right" fixed="right"
label="操作" label="操作"
width="200" width="auto"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<div class="ops"> <div class="ops">
...@@ -380,8 +413,41 @@ ...@@ -380,8 +413,41 @@
<el-table-column <el-table-column
prop="taskNumber" prop="taskNumber"
label="任务号" label="任务号"
width="220" width="300"
> >
<template slot-scope="scope">
<svg-icon
style="
width: 0.875rem;
height: 0.6875rem;
margin-bottom: 0.125rem;
margin-left: 0.3125rem;
"
v-if="scope.row.affirmImportRecordGrandchildren || scope.row.affirmImportRecordGrandchildren === null"
icon-class="tree_f"
>
</svg-icon>
<svg-icon
style="
width: 0.8125rem;
height: 0.375rem;
margin: 0 0 0.1875rem 0;
"
v-else-if="!scope.row.affirmImportRecordGrandchildren || scope.row.affirmImportRecordGrandchildren !== null"
icon-class="tree_c"
></svg-icon>
{{
scope.row.affirmImportRecordGrandchildren || scope.row.affirmImportRecordGrandchildren === null
? scope.row.taskNumber
: scope.row.taskNumber
}}
<div
v-show="scope.row.affirmImportRecordGrandchildren && scope.row.affirmImportRecordGrandchildren !== null"
class="children-count"
>
{{ scope.row.affirmImportRecordGrandchildren ? scope.row.affirmImportRecordGrandchildren.length : 0 }}
</div>
</template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="fileName" prop="fileName"
...@@ -391,7 +457,7 @@ ...@@ -391,7 +457,7 @@
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="queryType" prop="dataTypeName"
label="查询类型" label="查询类型"
width="200" width="200"
> >
...@@ -409,11 +475,11 @@ ...@@ -409,11 +475,11 @@
<el-table-column <el-table-column
prop="logicDatabase" prop="logicDatabase"
label="逻辑分库" label="逻辑分库"
width="200" width="100"
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="status" prop="statusName"
label="状态" label="状态"
width="auto" width="auto"
> >
...@@ -421,7 +487,7 @@ ...@@ -421,7 +487,7 @@
<el-table-column <el-table-column
fixed="right" fixed="right"
label="操作" label="操作"
width="200" width="auto"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<div class="ops"> <div class="ops">
...@@ -542,6 +608,8 @@ ...@@ -542,6 +608,8 @@
</div> </div>
</template> </template>
<script> <script>
import "@/icons/tree_f.svg";
import "@/icons/tree_c.svg";
import tjddl from "../AllPersonnelBase/modules/tjddl.vue"; // 添加到队列弹窗 import tjddl from "../AllPersonnelBase/modules/tjddl.vue"; // 添加到队列弹窗
import fztm from "../AllPersonnelBase/modules/fztm.vue"; // 复制数据弹窗 import fztm from "../AllPersonnelBase/modules/fztm.vue"; // 复制数据弹窗
import fcx from "../AllPersonnelBase/modules/fcx.vue"; // 发查询弹窗 import fcx from "../AllPersonnelBase/modules/fcx.vue"; // 发查询弹窗
...@@ -1237,3 +1305,87 @@ export default { ...@@ -1237,3 +1305,87 @@ export default {
color: #333333; color: #333333;
} }
</style> </style>
<!--table树-->
<style scoped lang="scss">
.children-count {
width: 34px;
font-size: 12px;
text-align: center;
background: #f6f8fa;
border-radius: 11px;
position: absolute;
right: 10px;
top: 25%;
}
.el-tree /deep/ .el-tree-node__expand-icon.expanded {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
/*有子节点 且未展开*/
.el-table /deep/ .el-icon-arrow-right:before {
// background: url("../../icons/tree_f.svg") no-repeat 0 3px;
content: "";
display: block;
width: 16px;
height: 16px;
font-size: 16px;
background-size: 16px;
}
/*有子节点 且已展开*/
.el-table /deep/ .el-table__expand-icon--expanded {
.el-icon-arrow-right:before {
// background: url("../../icons/tree_c.svg") no-repeat 0 3px;
content: "";
display: block;
width: 15px;
height: 20px;
font-size: 18px;
background-size: 21px;
}
}
/*没有子节点*/
.el-tree
/deep/
.el-tree-node__expand-icon.is-leaf::before
.el-table
/deep/
.el-table__placeholder::before {
// background: url("../../icons/tree_f.svg") no-repeat 0 3px;
content: "";
display: block;
width: 16px;
height: 18px;
font-size: 16px;
background-size: 16px;
}
/deep/.el-table--enable-row-hover .el-table__body tr:hover {
cursor: pointer;
}
</style>
<style lang="scss" >
.el-table__expand-icon {
position: absolute;
right: 45px;
cursor: pointer;
color: #b51f1f;
transition: transform 0.2s ease-in-out;
width: 11px;
height: 11px;
/* border: black 1px solid; */
margin: 0;
background-image: url("../../assets/img/confirm/expend.png");
background-position: center;
background-size: 11px;
background-repeat: no-repeat;
}
.el-table__expand-icon.el-table__expand-icon--expanded {
width: 11px;
height: 11px;
background-image: url("../../assets/img/confirm/shrink.png");
background-position: center;
background-size: 11px;
background-repeat: no-repeat;
transform: rotate(180deg) !important;
}
</style>
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