<template>
<div class="AppActivity Feedback">
<ul style="overflow: initial!important">
<li>
<span>
<em>{{$t('visa.v_tuanhao')}}：</em>
</span>
<el-input class="w180" v-model="obj.TCNUM"></el-input>
</li>
<li>
<span>
<em>{{$t('salesModule.Docments')}}</em>
</span>
<el-input @keyup.native="checkInteger(obj,'FinanceId')" class="w180" v-model="obj.FinanceId"></el-input>
</li>
<li>
<span>
<em>{{$t('fnc.acc')}}</em>
</span>
<el-select filterable v-model='obj.AccountId' >
<el-option :value="-1" :label="$t('pub.unlimitedSel')"></el-option>
<el-option v-for='item in accountList'
:label='item.Name'
:value='item.ID'
:key='item.ID'>
</el-option>
</el-select>
</li>
<!-- <li>
<span>
<em>{{$t('fnc.zhanghuleixing')}}</em>
</span>
<el-select filterable v-model="obj.Type" >
<el-option :label="$t('pub.unlimitedSel')" :value='0'></el-option>
<el-option :label="$t('fnc.yinhang')" :value='1'></el-option>
<el-option :label="$t('fnc.pingtai')" :value='2'></el-option>
<el-option :label="$t('fnc.xianjin')" :value='3'></el-option>
<el-option :label="$t('fnc.zjinchi')" :value='4'></el-option>
</el-select>
</li> -->
<li>
<em>{{$t('salesModule.Time')}}</em>
<el-date-picker
v-model="dateList"
type="daterange"
:range-separator="$t('OrderList.zhi')"
:start-placeholder="$t('OrderList.star')"
value-format="yyyy-MM-dd"
:end-placeholder="$t('OrderList.end')">
</el-date-picker>
</li>
<li style="float:right;margin-bottom:10px">
<input
type="button"
class="hollowFixedBtn"
:value="$t('pub.searchBtn')"
@click="getList(),getdataInfo()"
>
<input
type="button"
class="hollowFixedBtn"
:value="$t('pub.addBtn')"
@click="addRule"
>
</li>
</ul>
<div style="margin-top:15px">
<span>{{$t('objFill.zhidanysh')}}：{{dataInfo.CXMoney}}</span>
<span style="margin:0 20px">{{$t('objFill.zhidanwsh')}}：{{dataInfo.ZDMoney}}</span>
<span>{{$t('objFill.v101.FinancialModule.weizhidan')}}：{{dataInfo.Money}}</span>
</div>
<table class="singeRowTable" border="0" cellspacing="0" cellpadding="0" v-loading="loading">
<tr>
<th>ID</th>
<th>{{$t('visa.v_tuanhao')}}</th>
<th>{{$t('fnc.zhanghuleixing')}}</th>
<th>{{$t('objFill.zhanghuname')}}</th>
<th>{{$t('objFill.shoujujine')}}</th>
<th>{{$t('hotel.hotel_CurrentRate')}}</th>
<th>{{$t('fnc.bweibi')}}</th>
<th>{{$t('objFill.shoujuriqi')}}</th>
<th>{{$t('hotel.hotel_Order')}}</th>
<th>{{$t('fnc.a_djztai')}}</th>
<th>{{$t('fnc.a_cnyshenhe')}}</th>
<th>{{$t('pub.pubRemark')}}</th>
<th>{{$t('admin.admin_czPerson')}}/{{$t('salesModule.Time')}}</th>
<th>{{$t('system.table_operation')}}</th>
</tr>
<tr v-for="(item,i) in dataList" :key="i">
<td>{{item.Id}}</td>
<td>{{item.TCNUM}}（{{item.TCID}}）</td>
<td>
<span v-if="item.Type==1">{{$t('fnc.yinhang')}}</span>
<span v-if="item.Type==2">{{$t('fnc.pingtai')}}</span>
<span v-if="item.Type==3">{{$t('fnc.xianjin')}}</span>
<span v-if="item.Type==4">{{$t('fnc.zjinchi')}}</span>
</td>
<td>{{item.AccountName}}</td>
<td>{{item.WBMoney}}</td>
<td>{{item.Rate}}</td>
<td>{{item.Money}}</td>
<td>{{item.Time}}</td>
<td>{{item.FinanceId}}</td>
<td>{{item.fStatusName}}</td>
<td>
<span v-if="item.Is_Cashier==1">{{$t('pub.yes')}}</span>
<span v-if="item.Is_Cashier==0">{{$t('pub.no')}}</span>
</td>
<td>{{item.Remark}}</td>
<td>{{item.UpdateBy}}/{{item.UpdateDate}}</td>
<td>
<el-button v-if="item.FinanceId==0 && EmployeeId == item.UpdateById" @click="SetRules(item)" style="padding:4px" type="primary" icon="el-icon-edit" circle></el-button>
<el-button v-if="item.FinanceId==0 && EmployeeId == item.UpdateById" @click="Delete(item)" style="padding:4px" type="danger" icon="el-icon-delete" circle></el-button>
</td>
</tr>
<tr v-if="dataList.length==0">
<td colspan="15" align="center">{{$t('system.content_noData')}}</td>
</tr>
</table>
<el-pagination background @current-change="handleCurrentChange"
layout="total,prev, pager, next, jumper" :page-size="obj.pageSize" :total='total'>
</el-pagination>
<el-dialog
:title="$t('pub.updateMsg')"
:visible.sync="ruleVisible"
width="800px">
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item :label="$t('visa.v_tuanhao')" prop="TCNUM">
<el-input class="w220" v-model="form.TCNUM"></el-input>
</el-form-item>
<el-form-item :label="$t('fnc.acc')" prop="AccountId">
<el-select filterable v-model="form.AccountId" @change="getAccName(form.AccountId,1)">
<el-option :label="$t('pub.unlimitedSel')" :value='-1'></el-option>
<el-option v-for='item in accountList'
:label='item.Name'
:value='item.ID'
:key='item.ID'>
</el-option>
</el-select>
</el-form-item>
<el-form-item :label="$t('objFill.originalamount')" prop="WBMoney">
<el-input @blur="getMoney" class="w220" v-model="form.WBMoney"></el-input>
</el-form-item>
<el-form-item :label="$t('hotel.hotel_CurrentRate')">
<el-input class="w220" v-model="form.Rate" :disabled="true"></el-input>
</el-form-item>
<el-form-item :label="$t('fnc.bwbjine')">
<el-input class="w220" v-model="form.Money" :disabled="true"></el-input>
</el-form-item>
<el-form-item :label="$t('objFill.shoujuriqi')" prop="Time" >
<el-date-picker type="date" v-model="form.Time"
value-format="yyyy-MM-dd"></el-date-picker>
</el-form-item>
<el-form-item :label="$t('pub.pubRemark')">
<el-input class="w220" v-model="form.Remark"></el-input>
</el-form-item>
<div class="DocumentStatisticsDiv" >
<div>
<div class="_addUpload_box clearfix" >
<template v-for="(file,fIndex) in saveMsg">
<div v-if="file.Type==3">
<div style="width:100%;height:100%;overflow: hidden;">
<img :src="file.Url?file.Url:file.Content" @click="showUpLoadFile(file)">
</div>
<span class="iconfont icon-guanbi1" @click="deleteUploadFile(fIndex)"></span>
</div>
<div v-if="file.Type==1">
<div class="iconfont " :class="file.Content.substring(file.Content.lastIndexOf('.')+1,file.Content.length).toUpperCase()=='PDF'? 'icon-pdf' : 'icon-excel'" @click="showUpLoadFile(file)">
</div>
<span class="iconfont icon-guanbi1" @click="deleteUploadFile(fIndex)"></span>
</div>
<div v-if="file.Type==2">
<div class="iconfont icon-excel" @click="showUpLoadFile(file)">
</div>
<span class="iconfont icon-guanbi1" @click="deleteUploadFile(fIndex)"></span>
</div>
</template>
<div class="_pic_upload">
<el-upload
drag
:http-request="uploadFileBtn"
:multiple="true" :show-file-list="false" action="">
<i class="el-icon-plus avatar-uploader-icon"></i>
<div class="el-upload__text">{{$t('active.ld_djscwj')}}</div>
</el-upload>
</div>
</div>
</div>
</div>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="ruleVisible = false">{{$t('pub.cancelBtn')}}</el-button>
<el-button size="small" type="danger" @click="RulesOk('form')">{{$t('pub.sureBtn')}}</el-button>
</span>
</el-dialog>
<div v-if='picIsShow' class="_show_img_box" @click="picIsShow=false,picObj=[]">
<div style="position: absolute; width: 800px; height: 600px; left: 50%; top: 50%; margin-left: -400px; margin-top: -300px;">
<el-carousel :initial-index=initialIndex height="600px" :interval="5000" trigger="click">
<el-carousel-item style="height: 600px;overflow:auto;" v-for="(item,index) in picObj" :key="index">
<img :src="item" style=""/>
</el-carousel-item>
</el-carousel>
</div>
</div>
</div>
</template>
<script>
import moment from "moment"
export default {
name: 'Feedback',
data (){
return{
initialIndex:0,
edittrue:false,
allzb:100,
total:0,
obj:{
pageIndex:1,
pageSize:10,
TCNUM:'',
FinanceId:0,
AccountId:-1,
Type:3,
StartTime:'',
EndTime:'',
},
dataList:[],
loading:false,
dateList:[],
LineList:[],
companyList:[],
ruleVisible:false,
form:{
Id:0,
TCNUM:'',
AccountId:-1,
Type:3,
WBMoney:'',
Rate:'',
Money:'',
Time:'',
Remark:'',
VoucherList:[],
},
LineTeamList:[],
EmployeeList:[],
rules:{
TCNUM: [{ required: true, message: this.$t('objFill.v101.activity.rul2.t9'), trigger: 'blur' }],
AccountId: [{ required: true, message: this.$t('admin.admin_choAcc'), trigger: 'change' }],
WBMoney: [{ required: true, message: this.$t('objFill.v101.FinancialModule.qiingxzybje'), trigger: 'blur' }],
},
LineListObj:{},
companyListObj:{},
AccList:[],
accountList:[],
saveMsg:[],
imgList:[],
picIsShow:false,
picObj:[],
dataInfo:{},
EmployeeId:-1,
}
},
created(){
let userInfo = this.getLocalStorage();
this.form.groupId=userInfo.RB_Group_id;
this.EmployeeId=userInfo.EmployeeId;
if(this.$route.query.id){
this.obj.Id=Number(this.$route.query.Id);
}
if(this.$route.query.AccountId){
this.obj.AccountId=Number(this.$route.query.AccountId);
}
if(this.$route.query.StartTime){
this.dateList[0]=this.$route.query.StartTime;
this.dateList[1]=this.$route.query.EndTime;
}
},
mounted(){
this.getList();
this.AccountType_post_GetList();
this.getAccountList();
this.getdataInfo();
},
filters:{
YMD(date){
return moment(date).format("YYYY-MM-DD");
}
},
methods:{
getdataInfo(){
if(this.dateList && this.dateList.length>0){
this.obj.StartTime=this.dateList[0];
this.obj.EndTime=this.dateList[1];
}else{
this.obj.StartTime='';
this.obj.EndTime='';
}
this.apipost('Financial_get_GetFinanceReceiptStatistics',this.obj,res=>{
if(res.data.resultCode==1){
this.dataInfo = res.data.data;
}else{
this.$message.error(res.data.message);
}
},err=>{})
},
getMoney(){
this.form.Money=(this.form.WBMoney * this.form.Rate).toFixed(2);
},
getAccName(i,o){ // 根据选择账户获取账户名
this.accountList.forEach(x=>{
if(x.ID == i){
this.form.Rate=x.Rate;
this.getMoney();
}
})
},
showUpLoadFile(i){ // 预览上传文件
if(i.Type==3){
this.picObj.push(i.Url);
this.imgList.push(i.Url);
this.picIsShow= true;
// this.hideFlashMan = true;
}else{
if(i.Content.substring(i.Content.lastIndexOf('.')+1,i.Content.length).toUpperCase()=='PDF'){
this.previewPDF(i.Url)
}else{
window.open("https://view.officeapps.live.com/op/view.aspx?src="+i.Url)
}
}
},
deleteUploadFile(i){ // 删除上传文件
this.saveMsg.splice(i,1);
},
uploadFileBtn(file) { //上传
if(file.file.size > 1024 * 1024 * 10) {
this.$message.warning(this.$t('tips.wjdxbncgsz'))
return
}
// 1 文档 2 数据 3 图片
let typeArr=[
{stringArr:'GIF|JPG|JPEG|PNG|BMP',type:3},
{stringArr:'DOCX|DOC|XLSX|XLS|PPT|PPTX|PDF',type:1},
]
let ft=file.file.name.substring(file.file.name.lastIndexOf('.')+1,file.file.name.length).toUpperCase();
let fileTypeNumber = 2;
let typeOk = false;
typeArr.forEach(x=>{
if(x.stringArr.indexOf(ft)!='-1')
{
fileTypeNumber=x.type
typeOk = true;
}
})
if (!typeOk) return this.$message.error(this.$t('tips.qscWEfile'));
let newArr = [];
newArr.push(file.file)
let path = "/Upload/Temporary/"
this.$message.info(this.$t('tips.shangchuanzhong'))
this.UploadSelfFileT(path, newArr, x => {
let fileSize = file.file.size<1024? file.file.size:(file.file.size / 1024).toFixed(0);
this.saveMsg.push({
Content: x.data.FilePath,
ID:0,
Type:fileTypeNumber,
Url: this.domainManager().ViittoFileUrl + x.data.FilePath,
})
this.Success(this.$t('tips.scchenggong'))
},1);
},
getAccountList(){
this.apipost('FinancialInstitutions_post_GetALLAccountList',{TypeId:8}, res => {
if(res.data.resultCode == 1) {
let data = res.data.data;
data.forEach(x=>{
x.allName = x.BackNo+"("+x.Alias+")";
x.Name = x.Alias;
})
this.accountList = data;
}
}, err => {})
},
AccountType_post_GetList(){ //获取账户类型下拉
this.apipost('AccountType_post_GetList',{},res=>{
if(res.data.resultCode==1){
this.AccList = res.data.data;
}else{
this.$message.error(res.data.message);
}
},err=>{})
},
handleCurrentChange(val) {
this.obj.pageIndex = val;
this.getList();
},
Delete(item) {
this.$confirm(this.$t('objFill.shifouscbkhf'), this.$t('tips.tips'), {
confirmButtonText: this.$t('pub.sureBtn'),
cancelButtonText: this.$t('pub.cancelBtn'),
type: "warning"
})
.then(() => {
this.apipost('Financial_post_DelFinanceReceiptInfo', {ReceiptId:item.Id}, res => {
if (res.data.resultCode == 1) {
this.Success(res.data.message)
this.getList()
}else{
this.Error(res.data.message)
}
})
})
.catch(() => {});
},
addRule(){
this.ruleVisible=true;
this.edittrue=false;
this.InitForm();
},
SetRules(item){
this.ruleVisible=true;
this.edittrue=true;
this.form={
Id:item.Id,
TCNUM:item.TCNUM,
AccountId:item.AccountId,
Type:3,
WBMoney:item.WBMoney,
Rate:item.Rate,
Money:item.Money,
Time:item.Time,
Remark:item.Remark,
VoucherList:item.VoucherList,
}
this.saveMsg=[];
this.form.VoucherList.forEach(item=>{
let obj={
Url:item,
Type:3,
}
this.saveMsg.push(obj)
})
},
RulesOk(formName){
this.form.VoucherList=[];
this.$refs[formName].validate((valid) => {
if (valid) {
this.saveMsg.forEach(item=>{
this.form.VoucherList.push(item.Url);
})
this.apipost('Financial_post_SetFinanceReceiptInfo',this.form,res=>{
if(res.data.resultCode==1){
this.Success(res.data.message)
this.getList();
this.ruleVisible=false;
this.InitForm();
}else{
this.$message.error(res.data.message);
}
},err=>{})
} else {
}
});
},
InitForm(){
this.form={
Id:0,
TCNUM:'',
AccountId:-1,
Type:3,
WBMoney:'',
Rate:'',
Money:'',
Time:'',
Remark:'',
VoucherList:[],
}
this.saveMsg=[];
},
getList(){
this.loading=true;
if(this.dateList && this.dateList.length>0){
this.obj.StartTime=this.dateList[0];
this.obj.EndTime=this.dateList[1];
}else{
this.obj.StartTime='';
this.obj.EndTime='';
}
this.apipost('Financial_get_GetFinanceReceiptPageList',this.obj,res=>{
this.loading=false;
if(res.data.resultCode==1){
this.dataList = res.data.data.pageData;
this.total=res.data.data.count;
}else{
this.$message.error(res.data.message);
}
},err=>{})
},
}
}
</script>
<style>
.DocumentStatisticsDiv .el-upload-dragger{
width: 124px!important;
height: 80px!important;
}
._addUpload_box{
display: block;
margin-top: 15px;
}
._addUpload_box img{
width: 100%;
}
._addUpload_box>div{
float: left;
width:138px;
height:92px;
border:1px dashed rgba(210,210,210,1);
border-radius:2px;
cursor: pointer;
margin-bottom: 10px;
padding: 5px;
margin-right: 10px;
position: relative;
}
._addUpload_box>div:hover{
background-color: #f5f5f5;
}
._addFile_name{
padding-left: 15px;
max-width: 450px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
._addUpload_box .icon-guanbi1 {
font-size: 12px;
color: white;
display: inline-block;
margin-left: 15px;
position: absolute;
right: -6px;
top: -9px;
background-color: #f56c6c;
border-radius: 50%;
height: 20px;
width: 20px;
text-align: center;
line-height: 20px;
}
._addUpload_box .icon-guanbi1:hover {
font-size: 12px;
color: #c94052;
}
._addUpload_box .icon-excel,._addUpload_box .icon-pdf{
text-align: center;
font-size: 38px;
color: green;
line-height: 75px;
}
.AppActivity .el-form-item{
display: inline-block;
}
.Feedback ul>li{
display: inline-block;
font-size: 12px;
color: #666;
margin: 20px 30px 0px 0;
}
.Feedback .singeRowTable{
margin-top: 20px;
}
</style>