Commit 6f64534a authored by 王晓旭's avatar 王晓旭

添加在线取号记录报表

parent a378e28b
......@@ -31,6 +31,10 @@ export function getQueueData(params) {
export function getQueueInfo(params) {
return http.post(`${BASEURL}/inter/reportform/queinfo`, params);
}
//在线取号记录报表接口
export function getQuhaoData(params) {
return http.post(`${BASEURL}/inter/reportform/onlineQueList`, params);
}
//业务事项关联
export function getBusinessEvent(params) {
return http.get(`${BASEURL}/inter/reportform/busanalyse`, params);
......
<template>
<div class="search-form">
<a-space direction="vertical" size="middle">
<a-button block class="export-btn" icon="upload" @click="handleExport">
导出
</a-button>
<y-select
allowClear
showSearch
optionFilterProp="label"
placeholder="请选择大厅"
v-model="searchForm.hallid"
>
<a-select-option value="" label="全部大厅"> 全部大厅 </a-select-option>
<a-select-option
v-for="v in datingList"
:key="v.id"
:value="v.id"
:label="v.hallName"
>
{{ v.hallName }}
</a-select-option>
</y-select>
<y-select
allowClear
showSearch
optionFilterProp="label"
placeholder="请选择部门"
v-model="searchForm.sectionid"
>
<a-select-option value="" label="全部部门"> 全部部门 </a-select-option>
<a-select-option
v-for="v in deptList"
:key="v.id"
:value="v.id"
:label="v.name"
>
{{ v.name }}
</a-select-option>
</y-select>
<y-select
allowClear
showSearch
optionFilterProp="label"
placeholder="请选择设备"
v-model="searchForm.id"
>
<a-select-option value="" label="全部设备"> 全部设备 </a-select-option>
<a-select-option
v-for="v in deviceData"
:key="v.id"
:value="v.id"
:label="v.name"
>
{{ v.name }}
</a-select-option>
</y-select>
<y-select
allowClear
showSearch
optionFilterProp="label"
placeholder="请选择状态"
v-model="searchForm.style"
>
<a-select-option value="" label="全部状态"> 全部状态 </a-select-option>
<a-select-option
v-for="v in style"
:key="v.key"
:value="v.key"
:label="v.name"
>
{{ v.name }}
</a-select-option>
</y-select>
<y-range-picker valueFormat="YYYY-MM-DD" v-model="searchForm.time" />
<a-input
allowClear
placeholder="输入排队编号搜索"
v-model="searchForm.flownum"
/>
<a-button block class="search-btn" icon="search" @click="handleSearch">
搜索
</a-button>
</a-space>
</div>
</template>
<script>
import YSelect from "@/components/YSelect.vue";
import YRangePicker from "@/components/YRangePicker.vue";
import storage from "@/utils/js/Storage";
import { mapMutations } from "vuex";
import { getDatingList, getBumenList, getTaskList ,getTakeableList} from "@/api/dataAdmin";
import { debounce } from "lodash";
const style = [
{
key: 0,
name: "排队中",
},
{
key: 1,
name: "办理中",
},
{
key: 4,
name: "办理完成",
},
];
export default {
name: "numAcquisition-search",
components: {
YSelect,
YRangePicker,
},
data() {
return {
siteId: storage.get(2, "siteId"),
style,
datingList: [], // 大厅列表
deptList: [], // 部门列表
deviceData: [], // 设备列表
// 搜索数据
searchForm: {
id: "", // 排队机id
style: "", // 状态
device_type:"",//设备类型
time: [
this.$moment().format("YYYY-MM-DD"),
this.$moment().format("YYYY-MM-DD"),
], // 时间区间
flownum: "", // 排号编码
hallid: "", // 大厅id
sectionid: "", // 部门id
},
};
},
created() {
this.getDatingListArr();
this.getBumenListArr();
this.getTakeableList();
},
methods: {
...mapMutations("search", ["set_searForm", "set_isExport", "reset"]),
// 获取大厅列表
async getDatingListArr() {
let res = await getDatingList({
page: 1,
size: -1,
siteId: this.siteId,
});
if (res.code == 1) {
let { data } = res.data;
this.datingList = data;
}
},
// // 获取部门列表
async getBumenListArr() {
let res = await getBumenList({
page: 1,
size: -1,
siteId: this.siteId,
});
if (res.code == 1) {
let { data } = res.data;
this.deptList = data;
}
},
//获取排号机设备列表
async getTakeableList() {
let res = await getTakeableList({
page: 1,
size: -1,
});
if (res.code == 1) {
let { data } = res;
this.deviceData = data;
// console.log(this.deviceData)
}
},
// async getTaskList() {
// let res = await getTaskList({
// page: 1,
// size: -1,
// });
// if (res.code == 1) {
// let { data } = res.data;
// this.deviceData = data;
// console.log(this.deviceData)
// }
// },
// 搜索
handleSearch() {
if(this.searchForm.id){
let device = this.deviceData.filter((i)=>{
return this.searchForm.id == i.id
})
this.searchForm.device_type = device[0].device_type
}
this.set_searForm(this.searchForm);
},
// 导出
handleExport: debounce(
function () {
this.$bus.$emit("export");
},
2000,
{
leading: true,
trailing: false,
}
),
},
beforeDestroy() {
this.reset();
},
};
</script>
<style lang="less" scoped>
</style>
......@@ -115,6 +115,18 @@ const routes = [
activeMenu: "/home/dataManagement",
},
},
{
path: "numAcquisition",
name: "numAcquisition",
component: () =>
import(
/* webpackChunkName: "numAcquisition" */ "@/views/dataAdmin/components/queueCall/numAcquisition.vue"
),
meta: {
title: "在线取号记录报表",
activeMenu: "/home/dataManagement",
},
},
{
path: "callRecord",
name: "callRecord",
......
<template>
<div>
<a-drawer
title="办理明细"
placement="right"
width="700px"
:visible="Visible"
@close="onClose"
>
<!-- 头部 -->
<div class="header">
<div class="elapsed-time">
<p class="elapsed-time-title">
<span>总耗时:</span>
<span
>{{ detailsInfo.alltime ? detailsInfo.alltime : "--" }}
<span v-if="detailsInfo.alltime">
<a-icon
v-if="compareTime(detailsInfo.alltime, detailsInfo.p_alltime)"
type="arrow-up"
style="color: #ff4d4f"
/>
<a-icon v-else type="arrow-down" style="color: #1bbc9b" />
</span>
</span>
</p>
<p class="time">
<span>平均耗时:</span>
<span>{{
detailsInfo.p_alltime ? detailsInfo.p_alltime : "--"
}}</span>
</p>
</div>
<div class="elapsed-time">
<p class="elapsed-time-title">
<span>等待时间:</span>
<span>{{
detailsInfo.waittime ? detailsInfo.waittime : "--"
}}</span>
<span v-if="detailsInfo.waittime">
<a-icon
v-if="compareTime(detailsInfo.waittime, detailsInfo.p_waittime)"
type="arrow-up"
style="color: #ff4d4f"
/>
<a-icon v-else type="arrow-down" style="color: #1bbc9b" />
</span>
</p>
<p class="time">
<span>平均等待时间:</span>
<span>{{
detailsInfo.p_waittime ? detailsInfo.p_waittime : "--"
}}</span>
</p>
</div>
<div class="elapsed-time">
<p class="elapsed-time-title">
<span>办理时间:</span>
<span>{{ detailsInfo.bltime ? detailsInfo.bltime : "--" }}</span>
<span v-if="detailsInfo.bltime">
<a-icon
v-if="compareTime(detailsInfo.bltime, detailsInfo.p_bltime)"
type="arrow-up"
style="color: #ff4d4f"
/>
<a-icon v-else type="arrow-down" style="color: #1bbc9b" />
</span>
</p>
<p class="time">
<span>平均办理时间:</span>
<span>{{
detailsInfo.p_bltime ? detailsInfo.p_bltime : "--"
}}</span>
</p>
</div>
</div>
<!-- 步骤条 -->
<a-steps direction="vertical" :current="style">
<a-step title="未办理">
<a-icon type="environment" slot="icon" />
<div slot="description" class="transact-step">
<a-row :gutter="[0, 8]">
<a-col :span="12">
<span>申报人:</span>{{ detailsInfo.people_name || "--" }}
</a-col>
<a-col :span="12">
<span>取号时间:</span>{{ detailsInfo.taketime }}
</a-col>
</a-row>
<a-row :gutter="[0, 8]">
<a-col :span="12">
<span>取号编号:</span
>{{ detailsInfo.flownum ? detailsInfo.flownum : "--" }}
</a-col>
<a-col :span="12">
<span>取号方式:</span
>{{ detailsInfo.wy_signin === 0 ? "现场取号" : "线上取号" }}
</a-col>
</a-row>
<a-row :gutter="[0, 8]">
<a-col :span="12">
<span>注册方式:</span
>{{
detailsInfo.register_type == "Applets"
? "小程序"
: detailsInfo.register_type == "wechat"
? "公众号"
: detailsInfo.register_type == "app"
? "自助服务终端"
: "--"
}}
</a-col>
<!-- <a-col :span="12">
<span>取号设备:</span>{{ detailsInfo.take_name }}
</a-col> -->
</a-row>
<a-row :gutter="[0, 8]">
<a-col :span="24">
<span>办理业务:</span>{{ detailsInfo.business || "--" }}
</a-col>
</a-row>
<!-- 当前办理步骤标识 -->
<div class="transact-tips2" v-if="detailsInfo.style === 0">
<span class="tips-text"> 未办理 </span>
</div>
<div class="transact-tips1" v-if="detailsInfo.style === 1">
<span class="tips-text"> 办理中 </span>
</div>
<div class="transact-tips3" v-if="detailsInfo.style === 4">
<span class="tips-text"> 办理完成 </span>
</div>
</div>
</a-step>
<a-step
title="办理中"
v-if="detailsInfo.style === 1 || detailsInfo.style === 4"
>
<a-icon type="environment" slot="icon" />
<div slot="description">
<a-row :gutter="[0, 8]">
<a-col :span="12">
<span>办理窗口:</span>{{ detailsInfo.window_name }}
</a-col>
<a-col :span="12">
<span>开始办理时间:</span>{{ detailsInfo.calltime }}
</a-col>
</a-row>
<a-row :gutter="[0, 8]">
<a-col :span="12">
<span>工作人员:</span>{{ detailsInfo.workman_name }}
</a-col>
<!-- <a-col :span="12"> <span>健康状态:</span>绿码 </a-col> -->
</a-row>
<a-row :gutter="[0, 8]">
<a-col :span="12">
<span>叫号设备:</span>{{ detailsInfo.call_name || "--" }}
</a-col>
</a-row>
</div>
</a-step>
<a-step title="办理完成" v-if="detailsInfo.style === 4">
<a-icon type="environment" slot="icon" />
<div slot="description">
<a-row :gutter="[0, 8]">
<a-col :span="12">
<span>办理结束时间:</span>{{ detailsInfo.endtime }}
</a-col>
</a-row>
<a-row :gutter="[0, 8]">
<a-col :span="12">
<span>办件编号:</span
>{{ detailsInfo.ordernumber ? detailsInfo.ordernumber : "--" }}
</a-col>
</a-row>
</div>
</a-step>
</a-steps>
</a-drawer>
</div>
</template>
<script>
export default {
props: {
detailsVisible: {
type: Boolean,
required: true,
default: false,
},
detailsInfo: {
type: Object,
required: true,
default: () => {
return {};
},
},
},
data() {
return {};
},
computed: {
Visible: {
get() {
return this.detailsVisible;
},
set(val) {
this.$emit("update:detailsVisible", val);
},
},
style() {
if (this.detailsInfo === 0) {
return 1;
} else if (this.detailsInfo === 2) {
return 2;
} else {
return 3;
}
},
},
methods: {
onClose() {
this.Visible = false;
},
// 比较时间大小
compareTime(time1, time2) {
if (this.timeToSec(time1) - this.timeToSec(time2) > 0) {
return true;
}
return false;
},
// 转换时间为秒
timeToSec(time) {
if (time) {
let s = "";
let min,
sec = "";
if (time.includes("分钟") && time.includes("")) {
min = time.split("分钟")[0];
sec = time.split("分钟")[1].split("")[0];
s = Number(min * 60) + Number(sec);
return s;
} else if (time.includes("分钟")) {
min = time.split("分钟")[0];
s = Number(min * 60);
return s;
} else if (time.includes("")) {
sec = time.split("")[0];
s = Number(sec);
return s;
} else {
return 0;
}
} else {
return 0;
}
},
},
};
</script>
<style lang="less" scoped>
.header {
height: 90px;
margin-bottom: 20px;
border-left: 5px solid #1890ff;
border-radius: 0px 8px 8px 0px;
background-color: #e6f2fd;
display: flex;
justify-content: space-around;
align-items: center;
.elapsed-time-title {
font-size: 16px;
}
.time {
color: #1890ff;
}
}
.transact-step {
position: relative;
.transact-tips1,
.transact-tips2,
.transact-tips3 {
width: 90px;
height: 90px;
font-size: 16px;
font-weight: 600;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: -27px;
right: 0px;
transform: rotate(45deg);
}
.transact-tips1 {
border: 8px solid rgba(0, 168, 112, 0.1);
color: #00a870;
}
.transact-tips2 {
border: 8px solid rgba(8, 87, 232, 0.1);
color: #0857e8;
}
.transact-tips3 {
border: 8px solid rgba(101, 101, 101, 0.1);
color: #656565;
}
}
</style>
\ No newline at end of file
......@@ -66,14 +66,14 @@
</div>
</div>
<div slot="footer" class="btn-box">
<a-space>
<!-- <a-space>
<a-button type="primary" @click="checkPortrayal"
>查看TA的数据画像</a-button
>
<a-button type="primary" @click="checkBlockchain"
>区块链信息</a-button
>
</a-space>
</a-space> -->
</div>
</a-modal>
</div>
......
<template>
<div class="queue">
<a-table
size="middle"
:columns="columns"
:data-source="tableData"
:loading="loading"
:scroll="{
x: 1500,
y: 490,
}"
:row-selection="{
selectedRowKeys: selectedRowKeys,
onChange: onSelectChange,
}"
:rowKey="(record) => record.id"
:pagination="{
showTotal: (total) => `共 ${total} 条`,
current: current,
total: total,
pageSize: size,
showQuickJumper: true,
}"
@change="changeTable"
>
<!-- 申报人 -->
<template slot="people_name" slot-scope="text, record">
<a class="text-[#0857E8]" v-if="text" @click="checkUser(record)">{{
text
}}</a>
<span v-else>--</span>
</template>
<!-- 办理业务 -->
<template slot="business" slot-scope="text, record">
<a class="text-[#0857E8]" v-if="text" @click="checkBusiness(record)">{{
text
}}</a>
<span v-else>--</span>
</template>
<!-- 工作人员 -->
<template slot="workman_name" slot-scope="text, record">
<a
class="text-[#0857E8]"
v-if="text"
@click="checkWorkman(record.workmanid)"
>{{ text }}</a
>
<span v-else>--</span>
</template>
<!-- 状态 -->
<template slot="style" slot-scope="text">
<span v-if="text == 0">
<i class="iconfont icon-dot text-[#0857E8]"></i>
<span>未办理</span>
</span>
<span v-else-if="text == 1">
<i class="iconfont icon-dot text-[#00A870]"></i>
<span>办理中</span>
</span>
<span v-if="text == 4">
<i class="iconfont icon-dot text-[#656565]"></i>
<span>结束</span>
</span>
</template>
<!-- 操作 -->
<template slot="action" slot-scope="text, record">
<a-tag
class="cursor-pointer"
color="blue"
@click="checkInfo(record.id, record)"
>
详细信息
</a-tag>
<!-- <a class="text-[#0857E8]" @click="checkInfo(text)">详细信息</a> -->
</template>
</a-table>
<!-- 用户信息 -->
<userInfo
:userInfoVisible.sync="userInfoVisible"
:userInfo="userInfo"
></userInfo>
<!-- 业务信息 -->
<businessInfo
:analysisVisible.sync="analysisVisible"
:businessInfo="businessInfo"
:businessName="businessName"
></businessInfo>
<!-- 工作人员信息 -->
<workpeopleInfo
:workerInfo="workerInfo"
:workerInfoVisible.sync="workerInfoVisible"
></workpeopleInfo>
<!-- 排队详细信息 -->
<HandlNumDetails
:detailsVisible.sync="detailsVisible"
:detailsInfo="detailsInfo"
></HandlNumDetails>
</div>
</template>
<script>
import { mapState } from "vuex";
import storage from "@/utils/js/Storage";
import userInfo from "./components/userInfo";
import businessInfo from "./components/businessInfo.vue";
import workpeopleInfo from "./components/workpeopleInfo.vue";
import HandlNumDetails from "./components/HandlNumDetails.vue";
import { export2Excel } from "@/utils/js/exportExcel";
import {
getQuhaoData,
getQueueInfo,
getBusinessEvent,
getWorkerInfo,
getPeopleanalyse,
getWorkmananalyse,
} from "@/api/dataAdmin";
const tHeader = [
"取号编号",
"申报人",
"联系方式",
"在线取号时间",
"办理业务",
"签到时间",
"办理开始时间",
"办理窗口",
"工作人员",
"办理结束时间",
"状态",
]; // 导出的表头名信息
const filterVal = [
"flownum",
"people_name",
"people_phone",
"taketime",
"business",
"sigintime",
"calltime",
"window_name",
"workman_name",
"endtime",
"style",
]; // 导出的表头字段名,需要导出表格字段名
export default {
components: {
userInfo,
businessInfo,
workpeopleInfo,
HandlNumDetails,
},
data() {
const columns = [
{
title: "序号",
width: 50,
align: "center",
fixed: "left",
customRender: (text, record, index) => {
return (this.current - 1) * this.size + index + 1;
},
},
{
title: "取号编号",
fixed: "left",
align: "center",
width: 100,
dataIndex: "flownum",
},
{
title: "申报人",
width: 150,
dataIndex: "people_name",
scopedSlots: {
customRender: "people_name",
},
},
{
title: "联系方式",
width: 150,
dataIndex: "people_phone",
customRender: (text) => {
return text || "--";
},
},
{
title: "取号时间",
width: 150,
dataIndex: "taketime",
},
{
title: "办理业务",
width: 200,
dataIndex: "business",
scopedSlots: {
customRender: "business",
},
},
{
title: "签到时间",
width: 150,
dataIndex: "sigintime",
customRender: (text) => {
return text || "--";
},
},
{
title: "办理开始时间",
width: 150,
dataIndex: "calltime",
customRender: (text) => {
return text || "--";
},
},
{
title: "办理窗口",
width: 200,
dataIndex: "window_name",
customRender: (text, record) => {
return text ? `${text}-${record.window_fromnum}` : "--";
},
},
{
title: "工作人员",
width: 150,
dataIndex: "workman_name",
scopedSlots: {
customRender: "workman_name",
},
},
{
title: "办理结束时间",
width: 150,
dataIndex: "endtime",
customRender: (text) => {
return text || "--";
},
},
{
title: "当前排号总时长",
width: 150,
dataIndex: "all_time",
customRender: (text) => {
return text || "--";
},
},
{
title: "业务平均办理时长",
width: 160,
dataIndex: "run_time",
customRender: (text) => {
return text || "--";
},
},
{
title: "业务平均等待时长",
width: 160,
dataIndex: "wait_time",
customRender: (text) => {
return text || "--";
},
},
{
title: "状态",
width: 150,
dataIndex: "style",
scopedSlots: {
customRender: "style",
},
},
{
title: "操作",
align: "center",
width: 100,
fixed: "right",
scopedSlots: {
customRender: "action",
},
},
];
return {
siteId: storage.get(2, "siteId"),
columns,
tHeader,
filterVal,
tableData: [],
current: 1,
size: 10,
total: 0,
searchForm: {
id: "", // 排队机id
style: "", // 状态
time: [
this.$moment().format("YYYY-MM-DD"),
this.$moment().format("YYYY-MM-DD"),
], // 时间区间
flownum: "", // 排号编码
hallid: "", // 大厅id
sectionid: "", // 部门id
},
loading: false,
userInfoVisible: false,
userInfo: {}, // 用户信息
analysisVisible: false, // 业务查看
businessName: "", // 业务名称
businessInfo: {}, // 业务信息
workerInfo: {}, // 工作人员信息
workerInfoVisible: false,
detailsVisible: false,
detailsInfo: {}, // 排队详细信息
selectedRowKeys: [], // 表格选中的key
excelData: [], // 导出数据
};
},
computed: {
...mapState("search", ["searForm", "isExport"]),
},
watch: {
searForm: {
handler(newForm) {
if (JSON.stringify(newForm) != "{}") {
this.searchForm = newForm;
this.current = 1;
this.getQuhaoData();
}
},
deep: true,
},
},
created() {
this.getQuhaoData();
this.$bus.$off("export");
this.$bus.$on("export", () => {
this.exportExcel();
});
},
methods: {
// 获取报表
async getQuhaoData() {
this.loading = true;
let res = await getQuhaoData({
page: this.current,
size: this.size,
siteId: this.siteId,
...this.searchForm,
});
if (res.code == 1) {
let { data, total } = res.data;
this.total = total;
this.tableData = data;
this.$emit("update", { total, time: this.searchForm.time });
}
this.loading = false;
this.$forceUpdate();
},
// 翻页
changeTable(pagination) {
let { current } = pagination;
this.current = current;
this.getQuhaoData();
},
// 查看用户信息
async checkUser(row) {
this.loading = true;
let res = await getPeopleanalyse({
idcard: row.people_idcard,
peopleid: row.peopleid,
time: this.searchForm.time,
});
if (res.code == 1) {
let { data } = res;
this.userInfo = { ...row, ...data };
}
this.loading = false;
this.userInfoVisible = true;
},
// 查看业务信息
async checkBusiness(row) {
this.loading = true;
let res = await getBusinessEvent({
businessid: row.businessid,
time: this.searchForm.time,
});
if (res.code == 1) {
let { data } = res;
let { business } = row;
this.businessName = business;
this.businessInfo = data;
this.analysisVisible = true;
}
this.loading = false;
},
// 查看工作人员
async checkWorkman(id) {
this.loading = true;
let res = await getWorkmananalyse({
workmanid: id,
time: this.searchForm.time,
});
let result = await getWorkerInfo({
id,
});
let { data } = res;
this.workerInfo = { ...data, ...result.data };
this.loading = false;
this.workerInfoVisible = true;
},
// 查看详细信息
async checkInfo(id, row) {
this.loading = true;
let res = await getQueueInfo({
id,
});
if (res.code == 1) {
let { data } = res;
this.detailsInfo = {
...data,
business: row.business,
};
this.detailsVisible = true;
}
this.loading = false;
},
// 勾选表格
onSelectChange(keys, rows) {
this.selectedRowKeys = keys;
const res = new Map();
this.excelData = [...this.excelData, ...rows]
.filter((v) => {
return !res.has(v.id) && res.set(v.id, 1);
})
.filter((v) => {
return this.selectedRowKeys.some((val) => v.id == val);
});
},
// 导出表格
async exportExcel() {
let obj = {
0: "未办理",
1: "办理中",
4: "办理完成",
};
if (this.selectedRowKeys.length && this.excelData.length) {
let data = this.$_.cloneDeep(this.excelData);
data.forEach((item) => {
Object.keys(obj).forEach((keys) => {
if (item.style == keys) {
item.style = obj[keys];
}
});
});
export2Excel(
this.tHeader,
this.filterVal,
data,
"排队机记录报表" + this.$moment().format("YYYYMMDDHHmmss")
);
} else {
this.excelData = [];
await this.dataSection(1, 1000, () => {
if (!this.excelData.length) return;
for (let item of this.excelData) {
Object.keys(obj).forEach((key) => {
if (item.style == key) {
item.style = obj[key];
}
});
}
export2Excel(
this.tHeader,
this.filterVal,
this.excelData,
"排队记录报表" + this.$moment().format("YYYYMMDDHHmmss")
);
});
}
},
// 数据切片
async dataSection(page, size = 100, fn) {
let res = await getQuhaoData({
page: page || 1,
size: size,
...this.searchForm,
});
if (res.code == 1) {
let { data, total } = res.data;
this.excelData = this.excelData.concat(data || []);
// app.vue loading
this.$app.progressFile.show = true;
this.$app.progressFile.percent = parseInt(
(this.excelData.length / total) * 100
);
if (this.excelData.length >= total || data.length == 0) {
fn();
this.$app.progressFile.show = false;
this.$app.progressFile.percent = 1;
return;
}
setTimeout(() => {
let index = parseInt(page || 1) + 1;
this.dataSection(index, size, fn);
});
}
},
},
};
</script>
<style lang="less" scoped></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