|
|
@@ -1,14 +1,83 @@
|
|
|
<template>
|
|
|
- <!--新增履约模板-->
|
|
|
- <Drawer :title="'新增履约模板'"
|
|
|
- :placement="'right'"
|
|
|
- :visible="visible"
|
|
|
- @cancel="cancel"
|
|
|
- class="top486">
|
|
|
- <a-spin :spinning="loading">
|
|
|
-
|
|
|
- </a-spin>
|
|
|
- </Drawer>
|
|
|
+ <!--新增履约模板-->
|
|
|
+ <Drawer
|
|
|
+ :title="'新增履约模板'"
|
|
|
+ :placement="'right'"
|
|
|
+ :visible="visible"
|
|
|
+ @cancel="cancel"
|
|
|
+ class="top486"
|
|
|
+ >
|
|
|
+ <a-spin :spinning="loading">
|
|
|
+ <div class="listed">
|
|
|
+ <a-form class="inlineForm dialogForm">
|
|
|
+ <div class="formBar">
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="24">
|
|
|
+ <a-form-item label="模版名称">
|
|
|
+ <a-input
|
|
|
+ class="commonInput"
|
|
|
+ value="30天账期"
|
|
|
+ style="width: 260px"
|
|
|
+ />
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row class="tableTitle">
|
|
|
+ <a-col :span="7">步骤类型</a-col>
|
|
|
+ <a-col :span="6">步骤值（%）</a-col>
|
|
|
+ <a-col :span="7">距离上一步天数</a-col>
|
|
|
+ <a-col :span="4">操作</a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row class="tableContent">
|
|
|
+ <a-col :span="7">
|
|
|
+ <a-select
|
|
|
+ class="inlineFormSelect dialogTableSelect"
|
|
|
+ style="width: 108px"
|
|
|
+ placeholder="请选择"
|
|
|
+ v-model:value="form.pay"
|
|
|
+ >
|
|
|
+ <a-select-option key="1" value="1">买方支付</a-select-option>
|
|
|
+ </a-select>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="6">
|
|
|
+ <a-input
|
|
|
+ class="commonInput dialogTableInput"
|
|
|
+ style="width: 100px"
|
|
|
+ v-model:value="step1"
|
|
|
+ ></a-input>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="7">
|
|
|
+ <a-input
|
|
|
+ class="commonInput dialogTableInput"
|
|
|
+ style="width: 122px"
|
|
|
+ v-model:value="day1"
|
|
|
+ ></a-input>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="4">
|
|
|
+ <svg class="icon svg-icon" aria-hidden="true">
|
|
|
+ <use xlink:href="#icon-shanchu" />
|
|
|
+ </svg>
|
|
|
+ <PlusCircleOutlined />
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <div class="noticeTip">
|
|
|
+ <div>注意事项：</div>
|
|
|
+ <div>1、买方支付汇总值必须为100%；</div>
|
|
|
+ <div>2、卖方收款汇总值必须为100%；</div>
|
|
|
+ <div>3、配置卖方收款之前要有买方支付，且其值不能多于买方支付的值。</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :span="24" class="fixedBtns">
|
|
|
+ <a-form-item class="btnCenter">
|
|
|
+ <a-button class="listedBtn">确定</a-button>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </a-form>
|
|
|
+ </div>
|
|
|
+ </a-spin>
|
|
|
+ </Drawer>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts">
|
|
|
@@ -16,7 +85,7 @@ import { defineComponent, PropType, ref } from 'vue';
|
|
|
import { Des } from '@/common/components/commonDes';
|
|
|
import { _closeModal } from '@/common/setup/modal/modal';
|
|
|
import Drawer from '@/common/components/drawer/index.vue';
|
|
|
-import { PlusOutlined, MinusOutlined, SearchOutlined } from '@ant-design/icons-vue';
|
|
|
+import { PlusOutlined, MinusOutlined, SearchOutlined, PlusCircleOutlined } from '@ant-design/icons-vue';
|
|
|
import { QueryWrFriendApplyRsp } from '@/services/go/wrtrade/interface';
|
|
|
import { TempWrOrderQuoteDetail } from '@/views/market/spot_trade/components/post_buying/interface';
|
|
|
import { queryQueryWrFriend } from '@/services/go/wrtrade';
|
|
|
@@ -29,12 +98,18 @@ interface FriendList extends QueryWrFriendApplyRsp {
|
|
|
export default defineComponent({
|
|
|
emits: ['cancel', 'update'],
|
|
|
name: 'warehouse_receipt_trade_blocs_delisting',
|
|
|
- components: { Des, Drawer, PlusOutlined, MinusOutlined, SearchOutlined },
|
|
|
+ components: { Des, Drawer, PlusOutlined, MinusOutlined, SearchOutlined, PlusCircleOutlined },
|
|
|
setup(props, context) {
|
|
|
const { visible, cancel } = _closeModal(context);
|
|
|
const loading = ref<boolean>(false);
|
|
|
const searchValue = ref<string>('');
|
|
|
const myFriends = ref<FriendList[]>([]);
|
|
|
+ // 模板字段
|
|
|
+ const form = {
|
|
|
+ pay: '1',
|
|
|
+ step1: '',
|
|
|
+ day1: '',
|
|
|
+ };
|
|
|
// 查询好友列表
|
|
|
function queryMyFriend(value?: string) {
|
|
|
loading.value = true;
|
|
|
@@ -89,6 +164,7 @@ export default defineComponent({
|
|
|
submit,
|
|
|
searchValue,
|
|
|
getViewFriends,
|
|
|
+ form,
|
|
|
};
|
|
|
},
|
|
|
});
|
|
|
@@ -96,20 +172,60 @@ export default defineComponent({
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
.listed {
|
|
|
- padding: 18px 20px 0;
|
|
|
+ padding: 18px 10px 0;
|
|
|
.formBar {
|
|
|
- height: calc(100% - 120px);
|
|
|
- padding: 0 20px 0 13px;
|
|
|
- margin-top: 16px;
|
|
|
- background: #08131f;
|
|
|
- border: 1px solid #10202f;
|
|
|
- .item {
|
|
|
+ height: calc(100% - 70px);
|
|
|
+ padding: 0;
|
|
|
+ .ant-row.tableTitle {
|
|
|
+ .ant-col {
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-align: center;
|
|
|
+ color: @m-grey1;
|
|
|
+ font-size: 14px;
|
|
|
+ border-right: 1px solid @m-black6;
|
|
|
+ border-top: 1px solid @m-black6;
|
|
|
+ border-bottom: 1px solid @m-black6;
|
|
|
+ }
|
|
|
+ .ant-col:first-child {
|
|
|
+ border-left: 1px solid @m-black6;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ant-row.tableContent {
|
|
|
+ .ant-col {
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ text-align: center;
|
|
|
+ border-right: 1px solid @m-black6;
|
|
|
+ border-bottom: 1px solid @m-black6;
|
|
|
+ .icon {
|
|
|
+ color: @m-yellow7;
|
|
|
+ font-size: 18px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ .anticon {
|
|
|
+ font-size: 20px;
|
|
|
+ color: @m-blue0;
|
|
|
+ margin-left: 14px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ant-col:first-child {
|
|
|
+ border-left: 1px solid @m-black6;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .noticeTip {
|
|
|
width: 100%;
|
|
|
- height: 50px;
|
|
|
- line-height: 50px;
|
|
|
- border-bottom: 1px solid #10202f;
|
|
|
- font-size: 16px;
|
|
|
- color: #ffffff;
|
|
|
+ margin-top: 15px;
|
|
|
+ .flex;
|
|
|
+ flex-direction: column;
|
|
|
+ > div {
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: @m-grey1;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
marymelisa