arms-app 1.0.68 → 1.0.69
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/view/{5.vue → index.vue} +18 -47
- package/view/1.js +0 -23
- package/view/1.vue +0 -117
- package/view/111.js +0 -35
- package/view/2.js +0 -90
- package/view/2.vue +0 -129
- package/view/3.js +0 -289
- package/view/3.vue +0 -289
- package/view/4.vue +0 -473
- package/view/555.vue +0 -196
- package/view/CallRecordDetail.vue +0 -101
- package/view/ListedCompaniesView copy.vue +0 -238
- package/view/ListedCompaniesView.vue +0 -224
- package/view/ListedEnterprisesView.vue +0 -206
- package/view/ListedIncrementalEnterprisesView.vue +0 -195
- package/view/index.html +0 -51
- package/view//345/205/250/345/261/217.png +0 -0
- package/view//351/200/200/345/207/272/345/205/250/345/261/217.png +0 -0
|
@@ -1,101 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<div class="page">
|
|
3
|
-
<van-nav-bar title="外呼记录详情" left-arrow @click-left="onBack">
|
|
4
|
-
<template #right>
|
|
5
|
-
<van-icon name="edit" @click="toggleEdit" />
|
|
6
|
-
</template>
|
|
7
|
-
</van-nav-bar>
|
|
8
|
-
|
|
9
|
-
<van-form @submit="onSubmit">
|
|
10
|
-
<van-cell-group inset>
|
|
11
|
-
<van-field v-model="form.customer" label="客户姓名" required :readonly="!isEditing" placeholder="请输入" />
|
|
12
|
-
<van-field
|
|
13
|
-
v-model="form.content"
|
|
14
|
-
label="联系内容"
|
|
15
|
-
required
|
|
16
|
-
type="textarea"
|
|
17
|
-
:rows="4"
|
|
18
|
-
:readonly="!isEditing"
|
|
19
|
-
:maxlength="1000"
|
|
20
|
-
placeholder="请填写"
|
|
21
|
-
/>
|
|
22
|
-
<van-cell :border="false" class="content-footer-cell">
|
|
23
|
-
<template #title>
|
|
24
|
-
<div class="limit">{{ (form.content?.length || 0) }}/1000</div>
|
|
25
|
-
</template>
|
|
26
|
-
<template #value>
|
|
27
|
-
<span class="toggle-link" @click="showFull = true">展开</span>
|
|
28
|
-
</template>
|
|
29
|
-
</van-cell>
|
|
30
|
-
</van-cell-group>
|
|
31
|
-
</van-form>
|
|
32
|
-
<van-popup v-model:show="showFull" position="bottom" :style="{ height: '100%', width: '100%' }">
|
|
33
|
-
<div class="full-wrap">
|
|
34
|
-
<van-nav-bar title="联系内容" left-text="收起" left-arrow @click-left="showFull=false" />
|
|
35
|
-
<div class="full-body">
|
|
36
|
-
<van-field v-model="form.content" type="textarea" :rows="12" :readonly="!isEditing" :maxlength="1000" placeholder="请填写" />
|
|
37
|
-
</div>
|
|
38
|
-
<div class="full-footer">
|
|
39
|
-
<div class="limit">{{ (form.content?.length || 0) }}/1000</div>
|
|
40
|
-
<van-button size="small" type="primary" @click="showFull=false">收起</van-button>
|
|
41
|
-
</div>
|
|
42
|
-
</div>
|
|
43
|
-
</van-popup>
|
|
44
|
-
</div>
|
|
45
|
-
</template>
|
|
46
|
-
|
|
47
|
-
<script>
|
|
48
|
-
import { ref } from 'vue'
|
|
49
|
-
|
|
50
|
-
export default {
|
|
51
|
-
name: 'CallRecordDetail',
|
|
52
|
-
setup() {
|
|
53
|
-
const isEditing = ref(false)
|
|
54
|
-
const showFull = ref(false)
|
|
55
|
-
const form = ref({
|
|
56
|
-
customer: '北京银行金融科技部',
|
|
57
|
-
content: ''
|
|
58
|
-
})
|
|
59
|
-
|
|
60
|
-
const toggleEdit = () => {
|
|
61
|
-
isEditing.value = !isEditing.value
|
|
62
|
-
}
|
|
63
|
-
const onBack = () => {}
|
|
64
|
-
const onSubmit = () => {}
|
|
65
|
-
|
|
66
|
-
return { isEditing, form, showFull, toggleEdit, onBack, onSubmit }
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
</script>
|
|
70
|
-
|
|
71
|
-
<style scoped>
|
|
72
|
-
.page {
|
|
73
|
-
background-color: #f7f8fa;
|
|
74
|
-
min-height: 100vh;
|
|
75
|
-
}
|
|
76
|
-
.limit {
|
|
77
|
-
color: #969799;
|
|
78
|
-
font-size: 12px;
|
|
79
|
-
}
|
|
80
|
-
.toggle-link {
|
|
81
|
-
color: #1989fa;
|
|
82
|
-
font-size: 14px;
|
|
83
|
-
}
|
|
84
|
-
.full-wrap {
|
|
85
|
-
display: flex;
|
|
86
|
-
flex-direction: column;
|
|
87
|
-
height: 100%;
|
|
88
|
-
background: #fff;
|
|
89
|
-
}
|
|
90
|
-
.full-body {
|
|
91
|
-
padding: 12px 16px;
|
|
92
|
-
flex: 1;
|
|
93
|
-
overflow: auto;
|
|
94
|
-
}
|
|
95
|
-
.full-footer {
|
|
96
|
-
display: flex;
|
|
97
|
-
align-items: center;
|
|
98
|
-
justify-content: space-between;
|
|
99
|
-
padding: 8px 16px 16px;
|
|
100
|
-
}
|
|
101
|
-
</style>
|
|
@@ -1,238 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<section class="listed-companies-page">
|
|
3
|
-
<h1>并购企业</h1>
|
|
4
|
-
<div>
|
|
5
|
-
<el-form :model="filters" label-position="top" size="mini">
|
|
6
|
-
<el-row :gutter="12">
|
|
7
|
-
<el-col :span="5">
|
|
8
|
-
<el-form-item label="并购方名称">
|
|
9
|
-
<el-input v-model="filterAcquirer" placeholder="请输入" clearable size="mini" style="width: 100%" />
|
|
10
|
-
</el-form-item>
|
|
11
|
-
</el-col>
|
|
12
|
-
<el-col :span="5">
|
|
13
|
-
<el-form-item label="被并购方名称">
|
|
14
|
-
<el-input v-model="filterTarget" placeholder="请输入" clearable size="mini" style="width: 100%" />
|
|
15
|
-
</el-form-item>
|
|
16
|
-
</el-col>
|
|
17
|
-
<el-col :span="5">
|
|
18
|
-
<el-form-item label="交易方式">
|
|
19
|
-
<el-select v-model="filterMethod" placeholder="请选择" clearable size="mini" style="width: 100%">
|
|
20
|
-
<el-option v-for="opt in methodOptions" :key="opt.value" :label="opt.label" :value="opt.value" />
|
|
21
|
-
</el-select>
|
|
22
|
-
</el-form-item>
|
|
23
|
-
</el-col>
|
|
24
|
-
<el-col :span="5">
|
|
25
|
-
<el-form-item label=" ">
|
|
26
|
-
<el-button type="primary" size="mini" @click="applyFilters">查询</el-button>
|
|
27
|
-
<el-button size="mini" @click="onResetFilters">重置</el-button>
|
|
28
|
-
</el-form-item>
|
|
29
|
-
</el-col>
|
|
30
|
-
</el-row>
|
|
31
|
-
</el-form>
|
|
32
|
-
</div>
|
|
33
|
-
|
|
34
|
-
<el-table
|
|
35
|
-
:data="pagedRows"
|
|
36
|
-
stripe
|
|
37
|
-
border
|
|
38
|
-
style="width: 100%"
|
|
39
|
-
@sort-change="onSortChange"
|
|
40
|
-
>
|
|
41
|
-
<el-table-column type="index" label="序号" width="56" align="center" header-align="center" />
|
|
42
|
-
<el-table-column prop="name" label="并购方" align="center" header-align="center">
|
|
43
|
-
<template slot-scope="scope">
|
|
44
|
-
<div class="name-row">
|
|
45
|
-
<span class="name">{{ scope.row.name }}</span>
|
|
46
|
-
<span class="code">({{ scope.row.code }})</span>
|
|
47
|
-
</div>
|
|
48
|
-
<div class="sub-row">
|
|
49
|
-
<el-tag size="mini">{{ scope.row.exchange }}</el-tag>
|
|
50
|
-
<el-tag size="mini" type="info">{{ scope.row.region }}</el-tag>
|
|
51
|
-
</div>
|
|
52
|
-
</template>
|
|
53
|
-
</el-table-column>
|
|
54
|
-
<el-table-column prop="customerTags" label="客户标签" align="center" header-align="center">
|
|
55
|
-
<template slot-scope="scope">
|
|
56
|
-
<div class="tag-list">
|
|
57
|
-
<el-tag v-for="(t, i) in (scope.row.customerTags || [scope.row.customerLevel])" :key="i" size="mini" type="info">{{ t }}</el-tag>
|
|
58
|
-
</div>
|
|
59
|
-
</template>
|
|
60
|
-
</el-table-column>
|
|
61
|
-
<el-table-column prop="targetName" label="被并购方" align="center" header-align="center" />
|
|
62
|
-
<el-table-column prop="targetShortName" label="被并购方简称" align="center" header-align="center" />
|
|
63
|
-
<el-table-column prop="industry" label="行业" align="center" header-align="center" />
|
|
64
|
-
<el-table-column prop="region" label="地区" align="center" header-align="center" />
|
|
65
|
-
<el-table-column prop="startDate" label="开始时间" sortable="custom" align="center" header-align="center">
|
|
66
|
-
<template slot-scope="scope">{{ formatDate(scope.row.startDate) }}</template>
|
|
67
|
-
</el-table-column>
|
|
68
|
-
<el-table-column prop="closingDate" label="完成时间" sortable="custom" align="center" header-align="center">
|
|
69
|
-
<template slot-scope="scope">{{ formatDate(scope.row.closingDate) }}</template>
|
|
70
|
-
</el-table-column>
|
|
71
|
-
<el-table-column prop="tradeStatus" label="交易状态" align="center" header-align="center" />
|
|
72
|
-
<el-table-column prop="tradeMethod" label="交易方式" align="center" header-align="center">
|
|
73
|
-
<template slot-scope="scope">{{ methodLabel(scope.row.tradeMethod) }}</template>
|
|
74
|
-
</el-table-column>
|
|
75
|
-
<el-table-column prop="amount" label="交易金额" align="center" header-align="center" sortable="custom">
|
|
76
|
-
<template slot-scope="scope">{{ formatCurrency(scope.row.amount) }}</template>
|
|
77
|
-
</el-table-column>
|
|
78
|
-
<el-table-column prop="amountCNY" label="交易金额(人民币)" align="center" header-align="center">
|
|
79
|
-
<template slot-scope="scope">{{ formatCurrency(scope.row.amountCNY) }}</template>
|
|
80
|
-
</el-table-column>
|
|
81
|
-
<el-table-column prop="equityPercent" label="交易股权" align="center" header-align="center" sortable="custom">
|
|
82
|
-
<template slot-scope="scope">{{ (scope.row.equityPercent != null ? scope.row.equityPercent : 0) + '%' }}</template>
|
|
83
|
-
</el-table-column>
|
|
84
|
-
<el-table-column prop="valuation" label="估值(人民币)" align="center" header-align="center" sortable="custom">
|
|
85
|
-
<template slot-scope="scope">{{ formatCurrency(scope.row.valuation) }}</template>
|
|
86
|
-
</el-table-column>
|
|
87
|
-
</el-table>
|
|
88
|
-
|
|
89
|
-
<div>
|
|
90
|
-
<el-pagination
|
|
91
|
-
layout="prev, pager, next, sizes, total"
|
|
92
|
-
:current-page.sync="page.current"
|
|
93
|
-
:page-size.sync="page.size"
|
|
94
|
-
:page-sizes="[10,20,30,50]"
|
|
95
|
-
:total="filteredRows.length"
|
|
96
|
-
@current-change="onPageChange"
|
|
97
|
-
@size-change="onSizeChange"
|
|
98
|
-
/>
|
|
99
|
-
</div>
|
|
100
|
-
</section>
|
|
101
|
-
|
|
102
|
-
</template>
|
|
103
|
-
|
|
104
|
-
<script>
|
|
105
|
-
import { mapState, mapMutations } from 'vuex';
|
|
106
|
-
export default {
|
|
107
|
-
name: 'ListedCompaniesView',
|
|
108
|
-
data() {
|
|
109
|
-
return {
|
|
110
|
-
keyword: '',
|
|
111
|
-
methodOptions: [
|
|
112
|
-
{ label: '现金', value: 'cash' },
|
|
113
|
-
{ label: '股票发行', value: 'stock' },
|
|
114
|
-
{ label: '混合', value: 'hybrid' }
|
|
115
|
-
],
|
|
116
|
-
sort: { prop: '', order: '' },
|
|
117
|
-
page: { current: 1, size: 10 },
|
|
118
|
-
rows: [
|
|
119
|
-
{ name: '博雅医药', code: '000013', exchange: '创业板', region: '四川', industry: '医药', customerLevel: 'NK', customerTags: ['NK','电子产品厂','后备供应商'], targetName: '华康制药', targetShortName: '华康', startDate: '2024-01-10', closingDate: '2024-03-28', tradeStatus: '已完成', tradeMethod: 'cash', amount: 120000000, amountCNY: 120000000, equityPercent: 35, valuation: 350000000 },
|
|
120
|
-
{ name: '优选消费', code: '000014', exchange: '沪深A股', region: '福建', industry: '消费', customerLevel: 'A', targetName: '乐享食品', targetShortName: '乐享', startDate: '2019-06-02', closingDate: '2019-07-11', tradeStatus: '已完成', tradeMethod: 'stock', amount: 90000000, amountCNY: 90000000, equityPercent: 20, valuation: 260000000 },
|
|
121
|
-
{ name: '恒材材料', code: '000015', exchange: '科创板', region: '上海', industry: '材料', customerLevel: 'B', customerTags: ['B','新材料','重点供应商'], targetName: '新材科技', targetShortName: '新材', startDate: '2024-07-01', closingDate: '2024-09-20', tradeStatus: '已完成', tradeMethod: 'hybrid', amount: 135000000, amountCNY: 135000000, equityPercent: 28, valuation: 420000000 },
|
|
122
|
-
{ name: '联通通信', code: '000016', exchange: '沪深A股', region: '广东', industry: '通信', customerLevel: 'C', targetName: '朗讯通讯', targetShortName: '朗讯', startDate: '2015-08-01', closingDate: '2015-10-12', tradeStatus: '已完成', tradeMethod: 'cash', amount: 75000000, amountCNY: 75000000, equityPercent: 15, valuation: 180000000 },
|
|
123
|
-
{ name: '远景能源', code: '000017', exchange: '沪深A股', region: '内蒙古', industry: '能源', customerLevel: 'A', targetName: '清源电力', targetShortName: '清源', startDate: '2020-03-01', closingDate: '2020-05-06', tradeStatus: '已完成', tradeMethod: 'stock', amount: 210000000, amountCNY: 210000000, equityPercent: 42, valuation: 680000000 },
|
|
124
|
-
{ name: '未来科技', code: '000018', exchange: '科创板', region: '上海', industry: '科技', customerLevel: 'S', targetName: '数云科技', targetShortName: '数云', startDate: '2022-12-20', closingDate: '2023-02-18', tradeStatus: '已完成', tradeMethod: 'hybrid', amount: 420000000, amountCNY: 420000000, equityPercent: 51, valuation: 980000000 },
|
|
125
|
-
{ name: '工匠制造', code: '000019', exchange: '沪深A股', region: '安徽', industry: '制造', customerLevel: 'B', targetName: '精工机械', targetShortName: '精工', startDate: '2021-02-10', closingDate: '2021-03-30', tradeStatus: '已完成', tradeMethod: 'cash', amount: 56000000, amountCNY: 56000000, equityPercent: 18, valuation: 150000000 },
|
|
126
|
-
{ name: '卓越金融', code: '000020', exchange: '港股', region: '香港', industry: '金融', customerLevel: 'A', targetName: '恒盛资管', targetShortName: '恒盛', startDate: '2014-10-20', closingDate: '2014-12-01', tradeStatus: '已完成', tradeMethod: 'stock', amount: 320000000, amountCNY: 320000000, equityPercent: 33, valuation: 760000000 },
|
|
127
|
-
{ name: '广域地产', code: '000021', exchange: '沪深A股', region: '广东', industry: '地产', customerLevel: 'B', targetName: '新城置地', targetShortName: '新城', startDate: '2018-09-02', closingDate: '2018-11-07', tradeStatus: '已完成', tradeMethod: 'hybrid', amount: 270000000, amountCNY: 270000000, equityPercent: 25, valuation: 500000000 },
|
|
128
|
-
{ name: '星海科技', code: '000022', exchange: '科创板', region: '北京', industry: '科技', customerLevel: 'C', targetName: '极光智能', targetShortName: '极光', startDate: '2022-04-05', closingDate: '2022-06-10', tradeStatus: '已完成', tradeMethod: 'stock', amount: 600000000, amountCNY: 600000000, equityPercent: 60, valuation: 1200000000 }
|
|
129
|
-
]
|
|
130
|
-
};
|
|
131
|
-
},
|
|
132
|
-
computed: {
|
|
133
|
-
...mapState('listedCompanies', ['filters']),
|
|
134
|
-
filterAcquirer: {
|
|
135
|
-
get() { return this.filters.acquirer; },
|
|
136
|
-
set(v) { this.setFilterField({ key: 'acquirer', value: v }); }
|
|
137
|
-
},
|
|
138
|
-
filterTarget: {
|
|
139
|
-
get() { return this.filters.target; },
|
|
140
|
-
set(v) { this.setFilterField({ key: 'target', value: v }); }
|
|
141
|
-
},
|
|
142
|
-
filterMethod: {
|
|
143
|
-
get() { return this.filters.method; },
|
|
144
|
-
set(v) { this.setFilterField({ key: 'method', value: v }); }
|
|
145
|
-
},
|
|
146
|
-
filteredRows() {
|
|
147
|
-
const kw = (this.keyword || '').trim().toLowerCase();
|
|
148
|
-
const acq = (this.filters.acquirer || '').trim().toLowerCase();
|
|
149
|
-
const tgt = (this.filters.target || '').trim().toLowerCase();
|
|
150
|
-
const method = this.filters.method || '';
|
|
151
|
-
return this.rows.filter(r => {
|
|
152
|
-
const okKw = kw ? (r.name.toLowerCase().includes(kw) || r.code.toLowerCase().includes(kw)) : true;
|
|
153
|
-
const okAcq = acq ? r.name.toLowerCase().includes(acq) : true;
|
|
154
|
-
const okTgt = tgt ? (r.targetName || '').toLowerCase().includes(tgt) : true;
|
|
155
|
-
const okMethod = method ? r.tradeMethod === method : true;
|
|
156
|
-
return okKw && okAcq && okTgt && okMethod;
|
|
157
|
-
});
|
|
158
|
-
},
|
|
159
|
-
sortedRows() {
|
|
160
|
-
const arr = this.filteredRows.slice();
|
|
161
|
-
const prop = this.sort.prop;
|
|
162
|
-
const order = this.sort.order;
|
|
163
|
-
if (!prop || !order) return arr;
|
|
164
|
-
arr.sort((a, b) => {
|
|
165
|
-
const va = a[prop];
|
|
166
|
-
const vb = b[prop];
|
|
167
|
-
if (prop === 'closingDate' || prop === 'listedDate') {
|
|
168
|
-
const ta = new Date(va).getTime();
|
|
169
|
-
const tb = new Date(vb).getTime();
|
|
170
|
-
return order === 'ascending' ? ta - tb : tb - ta;
|
|
171
|
-
}
|
|
172
|
-
if (typeof va === 'number' && typeof vb === 'number') {
|
|
173
|
-
return order === 'ascending' ? va - vb : vb - va;
|
|
174
|
-
}
|
|
175
|
-
const sa = String(va || '').localeCompare(String(vb || ''));
|
|
176
|
-
return order === 'ascending' ? sa : -sa;
|
|
177
|
-
});
|
|
178
|
-
return arr;
|
|
179
|
-
},
|
|
180
|
-
pagedRows() {
|
|
181
|
-
const start = (this.page.current - 1) * this.page.size;
|
|
182
|
-
return this.filteredRows.slice(start, start + this.page.size);
|
|
183
|
-
}
|
|
184
|
-
},
|
|
185
|
-
methods: {
|
|
186
|
-
...mapMutations('listedCompanies', ['setFilters', 'setFilterField', 'resetFilters']),
|
|
187
|
-
onSearch() {},
|
|
188
|
-
formatDate(d) {
|
|
189
|
-
if (!d) return '';
|
|
190
|
-
const dt = new Date(d);
|
|
191
|
-
const y = dt.getFullYear();
|
|
192
|
-
const m = String(dt.getMonth() + 1).padStart(2, '0');
|
|
193
|
-
const day = String(dt.getDate()).padStart(2, '0');
|
|
194
|
-
return `${y}-${m}-${day}`;
|
|
195
|
-
},
|
|
196
|
-
statusTagType(st) {
|
|
197
|
-
if (st === '正常') return 'success';
|
|
198
|
-
if (st === '风险') return 'warning';
|
|
199
|
-
if (st === '退市') return 'danger';
|
|
200
|
-
return 'info';
|
|
201
|
-
},
|
|
202
|
-
methodLabel(v) {
|
|
203
|
-
if (v === 'cash') return '现金';
|
|
204
|
-
if (v === 'stock') return '股票发行';
|
|
205
|
-
if (v === 'hybrid') return '混合';
|
|
206
|
-
return '—';
|
|
207
|
-
},
|
|
208
|
-
formatCurrency(n) {
|
|
209
|
-
const v = Number(n || 0);
|
|
210
|
-
return v.toLocaleString('zh-CN', { minimumFractionDigits: 2, maximumFractionDigits: 2 });
|
|
211
|
-
},
|
|
212
|
-
formatNumber(n) {
|
|
213
|
-
const v = Number(n || 0);
|
|
214
|
-
return v.toLocaleString('zh-CN');
|
|
215
|
-
},
|
|
216
|
-
onSortChange({ prop, order }) {
|
|
217
|
-
this.sort = { prop, order };
|
|
218
|
-
},
|
|
219
|
-
applyFilters() {
|
|
220
|
-
this.page.current = 1;
|
|
221
|
-
},
|
|
222
|
-
onResetFilters() {
|
|
223
|
-
this.resetFilters();
|
|
224
|
-
this.page.current = 1;
|
|
225
|
-
},
|
|
226
|
-
onPageChange(page) {
|
|
227
|
-
this.page.current = page;
|
|
228
|
-
},
|
|
229
|
-
onSizeChange(size) {
|
|
230
|
-
this.page.size = size;
|
|
231
|
-
this.page.current = 1;
|
|
232
|
-
}
|
|
233
|
-
}
|
|
234
|
-
};
|
|
235
|
-
</script>
|
|
236
|
-
|
|
237
|
-
<style scoped>
|
|
238
|
-
</style>
|
|
@@ -1,224 +0,0 @@
|
|
|
1
|
-
<template>
|
|
2
|
-
<section class="listed-companies-page">
|
|
3
|
-
<h1>并购企业</h1>
|
|
4
|
-
<div>
|
|
5
|
-
<el-form :model="filters" label-position="top" size="mini">
|
|
6
|
-
<el-row :gutter="12">
|
|
7
|
-
<el-col :span="5">
|
|
8
|
-
<el-form-item label="并购方名称">
|
|
9
|
-
<el-input v-model="filters.acquirer" placeholder="请输入" clearable size="mini" style="width: 100%" />
|
|
10
|
-
</el-form-item>
|
|
11
|
-
</el-col>
|
|
12
|
-
<el-col :span="5">
|
|
13
|
-
<el-form-item label="被并购方名称">
|
|
14
|
-
<el-input v-model="filters.target" placeholder="请输入" clearable size="mini" style="width: 100%" />
|
|
15
|
-
</el-form-item>
|
|
16
|
-
</el-col>
|
|
17
|
-
<el-col :span="5">
|
|
18
|
-
<el-form-item label="交易方式">
|
|
19
|
-
<el-select v-model="filters.method" placeholder="请选择" clearable size="mini" style="width: 100%">
|
|
20
|
-
<el-option v-for="opt in methodOptions" :key="opt.value" :label="opt.label" :value="opt.value" />
|
|
21
|
-
</el-select>
|
|
22
|
-
</el-form-item>
|
|
23
|
-
</el-col>
|
|
24
|
-
<el-col :span="5">
|
|
25
|
-
<el-form-item label=" ">
|
|
26
|
-
<el-button type="primary" size="mini" @click="applyFilters">查询</el-button>
|
|
27
|
-
<el-button size="mini" @click="resetFilters">重置</el-button>
|
|
28
|
-
</el-form-item>
|
|
29
|
-
</el-col>
|
|
30
|
-
</el-row>
|
|
31
|
-
</el-form>
|
|
32
|
-
</div>
|
|
33
|
-
|
|
34
|
-
<el-table
|
|
35
|
-
:data="pagedRows"
|
|
36
|
-
stripe
|
|
37
|
-
border
|
|
38
|
-
style="width: 100%"
|
|
39
|
-
@sort-change="onSortChange"
|
|
40
|
-
>
|
|
41
|
-
<el-table-column type="index" label="序号" width="56" align="center" header-align="center" />
|
|
42
|
-
<el-table-column prop="name" label="并购方" align="center" header-align="center">
|
|
43
|
-
<template slot-scope="scope">
|
|
44
|
-
<div class="name-row">
|
|
45
|
-
<span class="name">{{ scope.row.name }}</span>
|
|
46
|
-
<span class="code">({{ scope.row.code }})</span>
|
|
47
|
-
</div>
|
|
48
|
-
<div class="sub-row">
|
|
49
|
-
<el-tag size="mini">{{ scope.row.exchange }}</el-tag>
|
|
50
|
-
<el-tag size="mini" type="info">{{ scope.row.region }}</el-tag>
|
|
51
|
-
</div>
|
|
52
|
-
</template>
|
|
53
|
-
</el-table-column>
|
|
54
|
-
<el-table-column prop="customerTags" label="客户标签" align="center" header-align="center">
|
|
55
|
-
<template slot-scope="scope">
|
|
56
|
-
<div class="tag-list">
|
|
57
|
-
<el-tag v-for="(t, i) in (scope.row.customerTags || [scope.row.customerLevel])" :key="i" size="mini" type="info">{{ t }}</el-tag>
|
|
58
|
-
</div>
|
|
59
|
-
</template>
|
|
60
|
-
</el-table-column>
|
|
61
|
-
<el-table-column prop="targetName" label="被并购方" align="center" header-align="center" />
|
|
62
|
-
<el-table-column prop="targetShortName" label="被并购方简称" align="center" header-align="center" />
|
|
63
|
-
<el-table-column prop="industry" label="行业" align="center" header-align="center" />
|
|
64
|
-
<el-table-column prop="region" label="地区" align="center" header-align="center" />
|
|
65
|
-
<el-table-column prop="startDate" label="开始时间" sortable="custom" align="center" header-align="center">
|
|
66
|
-
<template slot-scope="scope">{{ formatDate(scope.row.startDate) }}</template>
|
|
67
|
-
</el-table-column>
|
|
68
|
-
<el-table-column prop="closingDate" label="完成时间" sortable="custom" align="center" header-align="center">
|
|
69
|
-
<template slot-scope="scope">{{ formatDate(scope.row.closingDate) }}</template>
|
|
70
|
-
</el-table-column>
|
|
71
|
-
<el-table-column prop="tradeStatus" label="交易状态" align="center" header-align="center" />
|
|
72
|
-
<el-table-column prop="tradeMethod" label="交易方式" align="center" header-align="center">
|
|
73
|
-
<template slot-scope="scope">{{ methodLabel(scope.row.tradeMethod) }}</template>
|
|
74
|
-
</el-table-column>
|
|
75
|
-
<el-table-column prop="amount" label="交易金额" align="center" header-align="center" sortable="custom">
|
|
76
|
-
<template slot-scope="scope">{{ formatCurrency(scope.row.amount) }}</template>
|
|
77
|
-
</el-table-column>
|
|
78
|
-
<el-table-column prop="amountCNY" label="交易金额(人民币)" align="center" header-align="center">
|
|
79
|
-
<template slot-scope="scope">{{ formatCurrency(scope.row.amountCNY) }}</template>
|
|
80
|
-
</el-table-column>
|
|
81
|
-
<el-table-column prop="equityPercent" label="交易股权" align="center" header-align="center" sortable="custom">
|
|
82
|
-
<template slot-scope="scope">{{ (scope.row.equityPercent != null ? scope.row.equityPercent : 0) + '%' }}</template>
|
|
83
|
-
</el-table-column>
|
|
84
|
-
<el-table-column prop="valuation" label="估值(人民币)" align="center" header-align="center" sortable="custom">
|
|
85
|
-
<template slot-scope="scope">{{ formatCurrency(scope.row.valuation) }}</template>
|
|
86
|
-
</el-table-column>
|
|
87
|
-
</el-table>
|
|
88
|
-
|
|
89
|
-
<div>
|
|
90
|
-
<el-pagination
|
|
91
|
-
layout="prev, pager, next, sizes, total"
|
|
92
|
-
:current-page.sync="page.current"
|
|
93
|
-
:page-size.sync="page.size"
|
|
94
|
-
:page-sizes="[10,20,30,50]"
|
|
95
|
-
:total="filteredRows.length"
|
|
96
|
-
@current-change="onPageChange"
|
|
97
|
-
@size-change="onSizeChange"
|
|
98
|
-
/>
|
|
99
|
-
</div>
|
|
100
|
-
</section>
|
|
101
|
-
|
|
102
|
-
</template>
|
|
103
|
-
|
|
104
|
-
<script>
|
|
105
|
-
export default {
|
|
106
|
-
name: 'ListedCompaniesView',
|
|
107
|
-
data() {
|
|
108
|
-
return {
|
|
109
|
-
keyword: '',
|
|
110
|
-
filters: { acquirer: '', target: '', method: '' },
|
|
111
|
-
methodOptions: [
|
|
112
|
-
{ label: '现金', value: 'cash' },
|
|
113
|
-
{ label: '股票发行', value: 'stock' },
|
|
114
|
-
{ label: '混合', value: 'hybrid' }
|
|
115
|
-
],
|
|
116
|
-
sort: { prop: '', order: '' },
|
|
117
|
-
page: { current: 1, size: 10 },
|
|
118
|
-
rows: [
|
|
119
|
-
{ name: '博雅医药', code: '000013', exchange: '创业板', region: '四川', industry: '医药', customerLevel: 'NK', customerTags: ['NK','电子产品厂','后备供应商'], targetName: '华康制药', targetShortName: '华康', startDate: '2024-01-10', closingDate: '2024-03-28', tradeStatus: '已完成', tradeMethod: 'cash', amount: 120000000, amountCNY: 120000000, equityPercent: 35, valuation: 350000000 },
|
|
120
|
-
{ name: '优选消费', code: '000014', exchange: '沪深A股', region: '福建', industry: '消费', customerLevel: 'A', targetName: '乐享食品', targetShortName: '乐享', startDate: '2019-06-02', closingDate: '2019-07-11', tradeStatus: '已完成', tradeMethod: 'stock', amount: 90000000, amountCNY: 90000000, equityPercent: 20, valuation: 260000000 },
|
|
121
|
-
{ name: '恒材材料', code: '000015', exchange: '科创板', region: '上海', industry: '材料', customerLevel: 'B', customerTags: ['B','新材料','重点供应商'], targetName: '新材科技', targetShortName: '新材', startDate: '2024-07-01', closingDate: '2024-09-20', tradeStatus: '已完成', tradeMethod: 'hybrid', amount: 135000000, amountCNY: 135000000, equityPercent: 28, valuation: 420000000 },
|
|
122
|
-
{ name: '联通通信', code: '000016', exchange: '沪深A股', region: '广东', industry: '通信', customerLevel: 'C', targetName: '朗讯通讯', targetShortName: '朗讯', startDate: '2015-08-01', closingDate: '2015-10-12', tradeStatus: '已完成', tradeMethod: 'cash', amount: 75000000, amountCNY: 75000000, equityPercent: 15, valuation: 180000000 },
|
|
123
|
-
{ name: '远景能源', code: '000017', exchange: '沪深A股', region: '内蒙古', industry: '能源', customerLevel: 'A', targetName: '清源电力', targetShortName: '清源', startDate: '2020-03-01', closingDate: '2020-05-06', tradeStatus: '已完成', tradeMethod: 'stock', amount: 210000000, amountCNY: 210000000, equityPercent: 42, valuation: 680000000 },
|
|
124
|
-
{ name: '未来科技', code: '000018', exchange: '科创板', region: '上海', industry: '科技', customerLevel: 'S', targetName: '数云科技', targetShortName: '数云', startDate: '2022-12-20', closingDate: '2023-02-18', tradeStatus: '已完成', tradeMethod: 'hybrid', amount: 420000000, amountCNY: 420000000, equityPercent: 51, valuation: 980000000 },
|
|
125
|
-
{ name: '工匠制造', code: '000019', exchange: '沪深A股', region: '安徽', industry: '制造', customerLevel: 'B', targetName: '精工机械', targetShortName: '精工', startDate: '2021-02-10', closingDate: '2021-03-30', tradeStatus: '已完成', tradeMethod: 'cash', amount: 56000000, amountCNY: 56000000, equityPercent: 18, valuation: 150000000 },
|
|
126
|
-
{ name: '卓越金融', code: '000020', exchange: '港股', region: '香港', industry: '金融', customerLevel: 'A', targetName: '恒盛资管', targetShortName: '恒盛', startDate: '2014-10-20', closingDate: '2014-12-01', tradeStatus: '已完成', tradeMethod: 'stock', amount: 320000000, amountCNY: 320000000, equityPercent: 33, valuation: 760000000 },
|
|
127
|
-
{ name: '广域地产', code: '000021', exchange: '沪深A股', region: '广东', industry: '地产', customerLevel: 'B', targetName: '新城置地', targetShortName: '新城', startDate: '2018-09-02', closingDate: '2018-11-07', tradeStatus: '已完成', tradeMethod: 'hybrid', amount: 270000000, amountCNY: 270000000, equityPercent: 25, valuation: 500000000 },
|
|
128
|
-
{ name: '星海科技', code: '000022', exchange: '科创板', region: '北京', industry: '科技', customerLevel: 'C', targetName: '极光智能', targetShortName: '极光', startDate: '2022-04-05', closingDate: '2022-06-10', tradeStatus: '已完成', tradeMethod: 'stock', amount: 600000000, amountCNY: 600000000, equityPercent: 60, valuation: 1200000000 }
|
|
129
|
-
]
|
|
130
|
-
};
|
|
131
|
-
},
|
|
132
|
-
computed: {
|
|
133
|
-
filteredRows() {
|
|
134
|
-
const kw = (this.keyword || '').trim().toLowerCase();
|
|
135
|
-
const acq = (this.filters.acquirer || '').trim().toLowerCase();
|
|
136
|
-
const tgt = (this.filters.target || '').trim().toLowerCase();
|
|
137
|
-
const method = this.filters.method || '';
|
|
138
|
-
return this.rows.filter(r => {
|
|
139
|
-
const okKw = kw ? (r.name.toLowerCase().includes(kw) || r.code.toLowerCase().includes(kw)) : true;
|
|
140
|
-
const okAcq = acq ? r.name.toLowerCase().includes(acq) : true;
|
|
141
|
-
const okTgt = tgt ? (r.targetName || '').toLowerCase().includes(tgt) : true;
|
|
142
|
-
const okMethod = method ? r.tradeMethod === method : true;
|
|
143
|
-
return okKw && okAcq && okTgt && okMethod;
|
|
144
|
-
});
|
|
145
|
-
},
|
|
146
|
-
sortedRows() {
|
|
147
|
-
const arr = this.filteredRows.slice();
|
|
148
|
-
const prop = this.sort.prop;
|
|
149
|
-
const order = this.sort.order;
|
|
150
|
-
if (!prop || !order) return arr;
|
|
151
|
-
arr.sort((a, b) => {
|
|
152
|
-
const va = a[prop];
|
|
153
|
-
const vb = b[prop];
|
|
154
|
-
if (prop === 'closingDate' || prop === 'listedDate') {
|
|
155
|
-
const ta = new Date(va).getTime();
|
|
156
|
-
const tb = new Date(vb).getTime();
|
|
157
|
-
return order === 'ascending' ? ta - tb : tb - ta;
|
|
158
|
-
}
|
|
159
|
-
if (typeof va === 'number' && typeof vb === 'number') {
|
|
160
|
-
return order === 'ascending' ? va - vb : vb - va;
|
|
161
|
-
}
|
|
162
|
-
const sa = String(va || '').localeCompare(String(vb || ''));
|
|
163
|
-
return order === 'ascending' ? sa : -sa;
|
|
164
|
-
});
|
|
165
|
-
return arr;
|
|
166
|
-
},
|
|
167
|
-
pagedRows() {
|
|
168
|
-
const start = (this.page.current - 1) * this.page.size;
|
|
169
|
-
return this.filteredRows.slice(start, start + this.page.size);
|
|
170
|
-
}
|
|
171
|
-
},
|
|
172
|
-
methods: {
|
|
173
|
-
onSearch() {},
|
|
174
|
-
formatDate(d) {
|
|
175
|
-
if (!d) return '';
|
|
176
|
-
const dt = new Date(d);
|
|
177
|
-
const y = dt.getFullYear();
|
|
178
|
-
const m = String(dt.getMonth() + 1).padStart(2, '0');
|
|
179
|
-
const day = String(dt.getDate()).padStart(2, '0');
|
|
180
|
-
return `${y}-${m}-${day}`;
|
|
181
|
-
},
|
|
182
|
-
statusTagType(st) {
|
|
183
|
-
if (st === '正常') return 'success';
|
|
184
|
-
if (st === '风险') return 'warning';
|
|
185
|
-
if (st === '退市') return 'danger';
|
|
186
|
-
return 'info';
|
|
187
|
-
},
|
|
188
|
-
methodLabel(v) {
|
|
189
|
-
if (v === 'cash') return '现金';
|
|
190
|
-
if (v === 'stock') return '股票发行';
|
|
191
|
-
if (v === 'hybrid') return '混合';
|
|
192
|
-
return '—';
|
|
193
|
-
},
|
|
194
|
-
formatCurrency(n) {
|
|
195
|
-
const v = Number(n || 0);
|
|
196
|
-
return v.toLocaleString('zh-CN', { minimumFractionDigits: 2, maximumFractionDigits: 2 });
|
|
197
|
-
},
|
|
198
|
-
formatNumber(n) {
|
|
199
|
-
const v = Number(n || 0);
|
|
200
|
-
return v.toLocaleString('zh-CN');
|
|
201
|
-
},
|
|
202
|
-
onSortChange({ prop, order }) {
|
|
203
|
-
this.sort = { prop, order };
|
|
204
|
-
},
|
|
205
|
-
applyFilters() {
|
|
206
|
-
this.page.current = 1;
|
|
207
|
-
},
|
|
208
|
-
resetFilters() {
|
|
209
|
-
this.filters = { acquirer: '', target: '', method: '' };
|
|
210
|
-
this.page.current = 1;
|
|
211
|
-
},
|
|
212
|
-
onPageChange(page) {
|
|
213
|
-
this.page.current = page;
|
|
214
|
-
},
|
|
215
|
-
onSizeChange(size) {
|
|
216
|
-
this.page.size = size;
|
|
217
|
-
this.page.current = 1;
|
|
218
|
-
}
|
|
219
|
-
}
|
|
220
|
-
};
|
|
221
|
-
</script>
|
|
222
|
-
|
|
223
|
-
<style scoped>
|
|
224
|
-
</style>
|