2025-01-17 18:18:49 +08:00

470 lines
12 KiB
Vue

<template>
<view class="main">
<view class="header" :style="{ height: menu.bottom + 'px' }">
<image
@click="handleBack"
class="allowLeft"
:style="{ top: menu.top + (menu.height - 24) / 2 + 'px' }"
src="https://eshangtech.com/ShopICO/ahyd-BID/examine/leftArrowWhite.svg"
></image>
</view>
<p class="title">{{ item.BillState === 1 ? "已提单" : "提单申请" }}</p>
<view class="content">
<view class="detail">
<view
class="type"
:style="{ color: item.PaymentTerms === 1 ? 'red' : '' }"
>{{
detailInfo.PaymentTerms === 1
? "收款"
: detailInfo.PaymentTerms === 0
? "退款"
: ""
}}</view
>
<view class="top">
<view class="left">
<image
class="logo"
:src="
detailInfo.BUSINESSPROJECT_ICO
? detailInfo.BUSINESSPROJECT_ICO
: 'https://eshangtech.com/ShopICO/yxcl/projectWarning/defaultImg.svg'
"
></image>
</view>
<view class="right">
<p class="detailTitle">
{{
detailInfo.BusinessProcess_Name
? detailInfo.BusinessProcess_Name.split("】")[1]
: "-"
}}
</p>
<view class="fixed">
<image
class="serviceFixed"
src="https://eshangtech.com/ShopICO/yxcl/projectWarning/position.svg"
></image>
<span class="service">{{ detailInfo.Serverpart_Name }}</span>
</view>
<view class="other">
<view class="item">
<image
class="icon"
src="https://eshangtech.com/ShopICO/yxcl/projectWarning/user.svg"
></image>
<span class="value">{{ detailInfo.Staff_Name || "-" }}</span>
</view>
<!-- <view class="item">
<image
class="icon"
src="https://eshangtech.com/ShopICO/yxcl/projectWarning/phone.svg"
></image>
<span class="value">{{
detailInfo.BusinessProcess_StartDate || "-"
}}</span>
</view> -->
</view>
</view>
</view>
<view class="bottom">
<view class="message">
<image
class="icon"
src="https://eshangtech.com/ShopICO/yxcl/projectWarning/money.svg"
></image>
<span class="text">退补款</span>
<span class="money">{{
detailInfo.Liquidation_Amount || "-"
}}</span>
</view>
<view class="message">
<image
class="icon"
src="https://eshangtech.com/ShopICO/yxcl/projectWarning/phone.svg"
></image>
<span class="text">提单时间</span>
<span class="money">{{
detailInfo.BusinessProcess_EndDate
? $moment(detailInfo.BusinessProcess_EndDate).format(
"YYYY/MM/DD"
)
: "-"
}}</span>
</view>
<view class="message" style="margin-bottom: 0">
<image
class="icon"
src="https://eshangtech.com/ShopICO/yxcl/projectWarning/date.svg"
></image>
<span class="text">本期时间</span>
<span class="money"
>{{ detailInfo.STARTDATE || "-" }} -
{{ detailInfo.ENDDATE || "-" }}</span
>
</view>
</view>
</view>
<view class="contentTextBox" v-if="detailInfo.BillState !== 1">
<textarea v-model="desc"></textarea>
</view>
<view class="bottomBtn" v-if="detailInfo.BillState !== 1">
<button class="btn change" @click="handleBillLading">发起提单</button>
</view>
<view class="bottomBtn" v-if="detailInfo.BillState === 1">
<button
:style="{
background: '#e0ba98',
}"
class="btn change"
>
已发起
</button>
</view>
</view>
</view>
</template>
<script>
import { mapState } from "vuex";
export default {
data() {
return {
menu: {}, // 手机信息
detailInfo: {}, // 结算业务信息
desc: "项目结算完成,发起提单审批流程", // 审核意见
};
},
computed: {
...mapState({
user: (state) => {
return state.userData;
},
}),
},
onLoad(query) {
this.menu = uni.getMenuButtonBoundingClientRect();
// 推送进的话 直接进来拿id去查详情
if (query.id) {
console.log("query.id", query.id);
this.handleGetDetail(query.id);
}
},
methods: {
// 查详情
async handleGetDetail(id) {
uni.showLoading({
title: "加载中...",
});
const req = {
SearchParameter: {
BusinessApproval_ID: id,
BusinessProcess_State: 9000,
Operation_Type: 11,
PendState: 3,
},
};
const data = await this.$request.$webPost(
"EShangApiMain/Finance/GetMonthAccountProinst",
req
);
console.log("data", data);
let list = data.Result_Data.List;
if (list && list.length > 0) {
this.detailInfo = list[0];
this.detailInfo.Liquidation_Amount = this.$util.formatNumber(
this.detailInfo.Liquidation_Amount
);
}
console.log("this.detailInfo ", this.detailInfo);
// let req = {
// BUSINESSAPPROVALId: id,
// };
// const data = await this.$request.$webGet(
// "EShangApiMain/BusinessProcess/GetBUSINESSAPPROVALDetail",
// req
// );
// console.log("data", data);
// this.detailInfo = data.Result_Data;
// console.log("this.detailInfo", this.detailInfo);
uni.hideLoading();
},
// 返回上一页面
handleBack() {
uni.navigateBack({
delta: 1,
});
},
// 发起提单
async handleBillLading() {
if (!this.desc) {
uni.showToast({
title: "请先输入审核意见!",
icon: "none",
});
return;
}
console.log("user", this.user);
const req = {
businessApprovalID: this.detailInfo.BusinessApproval_ID,
approveedInfo: this.desc || "",
approveedStaffId: this.user.UserId,
approveedStaffName: this.user.UserName,
};
// const data = await handleGetLadingBill(req);
const data = await this.$request.$webGet(
"EShangApiMain/Finance/LadingBill",
req
);
uni.showToast({
title: data.Result_Desc,
icon: "none",
});
let _this = this;
setTimeout(() => {
_this.handleGetDetail(_this.BUSINESSAPPROVAL_ID);
}, 2000);
// if (data.Result_Code === 100) {
// setTimeout(() => {
// uni.navigateBack({
// delta: 1,
// });
// });
// }
},
},
};
</script>
<style scoped lang="scss">
@import "/static/public/font/stylesheet.css";
.main {
width: 100vw;
height: 100vh;
box-sizing: border-box;
background-image: url("https://eshangtech.com/ShopICO/yxcl/projectWarning/bg.svg");
background-size: cover;
.header {
width: 100%;
box-sizing: border-box;
padding: 0 16px;
position: relative;
margin-top: 0;
z-index: 222;
.allowLeft {
position: absolute;
width: 24px;
height: 24px;
left: 16px;
}
}
.title {
font-size: 28px;
font-family: Alimama ShuHeiTi;
color: #160002;
line-height: 39px;
margin: 18px 0 16px 16px;
background: linear-gradient(180deg, #c25e18 30%, #8c4917 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.content {
width: 100%;
box-sizing: border-box;
padding: 0 32rpx;
.detail {
width: 100%;
box-sizing: border-box;
background: linear-gradient(
314deg,
#fffcf3 0%,
#fff0e6 20%,
#fff9f5 51%,
#fff8e7 73%,
#fff6ee 100%
);
border-radius: 8px;
padding: 16px;
position: relative;
.type {
position: absolute;
right: 0;
top: 55px;
background: linear-gradient(
270deg,
#f8d792 0%,
#ffe6b2 50%,
#fbc13b 100%
);
border-radius: 10px 0 0 2px;
padding: 2px 8px;
font-size: 14px;
font-family: PingFangSC-Regular;
font-weight: 400;
color: #604128;
line-height: 20px;
}
.top {
width: 100%;
height: 168rpx;
display: flex;
align-items: center;
.left {
width: 168rpx;
height: 168rpx;
margin-right: 12px;
border-radius: 8px;
overflow: hidden;
.logo {
width: 168rpx;
height: 168rpx;
}
}
.right {
width: calc(100% - 180rpx);
//display: flex;
//flex-direction: column;
//justify-content: space-between;
//align-items: flex-start;
.detailTitle {
font-size: 30rpx;
width: 100%;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #160002;
margin-bottom: 12rpx;
line-height: 32rpx;
display: -webkit-box;
-webkit-line-clamp: 2; /* 设置显示的行数 */
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
.fixed {
height: 24px;
line-height: 24px;
padding: 1px 4px;
box-sizing: border-box;
background: rgba(252, 186, 118, 0.2);
border-radius: 4px;
display: inline-block;
margin-bottom: 12rpx;
.serviceFixed {
width: 20rpx;
height: 24rpx;
margin-right: 8rpx;
line-height: 24px;
}
.service {
font-size: 28rpx;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #6c492a;
line-height: 40rpx;
}
}
.other {
width: 100%;
display: flex;
align-items: center;
.item {
display: flex;
align-items: center;
margin-right: 16px;
.icon {
width: 16px;
height: 16px;
margin-right: 6px;
}
.value {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #160002;
line-height: 40rpx;
white-space: nowrap;
}
}
}
}
}
.bottom {
margin-top: 24px;
.message {
width: 100%;
display: flex;
align-items: center;
margin-bottom: 8px;
.icon {
width: 16px;
height: 16px;
margin-right: 8px;
}
.text {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #786b6c;
line-height: 20px;
margin-right: 8px;
}
.money {
font-size: 14px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #7d5632;
line-height: 20px;
}
}
}
}
.contentTextBox {
width: 100%;
margin-top: 24rpx;
background: #fff;
border-radius: 8px;
box-sizing: border-box;
padding: 16px;
}
.bottomBtn {
width: 100%;
box-sizing: border-box;
padding: 8px 0;
margin-top: 24rpx;
display: flex;
justify-content: space-between;
.btn {
// width: calc((100% - 32rpx) / 2);
width: 100%;
height: 41px;
background: rgba(125, 86, 50, 0.1);
border-radius: 4px;
font-size: 16px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #6d5f5e;
opacity: 0.6;
}
.change {
background: #7d5632;
color: #feffff;
opacity: 1;
}
}
}
}
</style>