Skip to content

Commit 4cb5086

Browse files
committed
[FEATURE]adjust contractTemplateCategory
1 parent a536f4f commit 4cb5086

File tree

7 files changed

+370
-63
lines changed

7 files changed

+370
-63
lines changed

Diff for: mock/system.js

+36-4
Original file line numberDiff line numberDiff line change
@@ -22,8 +22,7 @@ for (let i = 0; i < inputInfoCount; i++) {
2222
'inputInfoCategory|1': ['数字', '汉字', '英文'],
2323
'format|1': ['数字', '汉字', '英文'],
2424
'fontLimit|1': [30, 60, 100],
25-
editDate: '@datetime',
26-
isShow: false
25+
editDate: '@datetime'
2726
}))
2827
}
2928

@@ -36,8 +35,25 @@ for (let i = 0; i < tableInfoCount; i++) {
3635
'useRate|1': ['月', '日', '年'],
3736
'infoName|1': ['承兑汇票种类', '乙方经销商名称', '转让原因'],
3837
'tableInfoCategory|1': ['数字', '汉字', '英文'],
39-
editDate: '@datetime',
40-
isShow: false
38+
editDate: '@datetime'
39+
}))
40+
}
41+
42+
const contractTemplateCategoryList = []
43+
const contractTemplateCategoryListCount = 25
44+
for (let i = 0; i < contractTemplateCategoryListCount; i++) {
45+
contractTemplateCategoryList.push(Mock.mock({
46+
id: '@increment',
47+
'reason|1': ['合规', '销售', '质量'],
48+
'tmplateName|1': ['药品销售合同', '药品警戒合同', '销售终止合同'],
49+
'exprise|1': ['长期', '一年'],
50+
'law': '罗氏贸易',
51+
'signtory': '@natural(1, 5)',
52+
'emailTemplate': '@natural(1, 5)',
53+
'signtoryWay|1': ['罗氏先签', '罗氏后签'],
54+
'isEsignature|1': ['是', '否'],
55+
'isenable|1': [true, false],
56+
'isShow': false
4157
}))
4258
}
4359

@@ -89,5 +105,21 @@ export default [
89105
}
90106
}
91107
}
108+
},
109+
{
110+
url: '/system/getContractTemplateCategoryList',
111+
type: 'get',
112+
response: config => {
113+
const { page = 1, limit = 10, sort } = config.query
114+
const pageList = contractTemplateCategoryList.filter((item, index) => index < limit * page && index >= limit * (page - 1))
115+
116+
return {
117+
code: 20000,
118+
data: {
119+
total: contractTemplateCategoryList.length,
120+
items: pageList
121+
}
122+
}
123+
}
92124
}
93125
]

Diff for: src/api/system.js

+8
Original file line numberDiff line numberDiff line change
@@ -23,3 +23,11 @@ export function fetchTableInfoList(query) {
2323
params: query
2424
})
2525
}
26+
27+
export function fetchContractTemplateCategoryList(query) {
28+
return request({
29+
url: '/system/getContractTemplateCategoryList',
30+
method: 'get',
31+
params: query
32+
})
33+
}

Diff for: src/styles/index.scss

+2-9
Original file line numberDiff line numberDiff line change
@@ -71,13 +71,6 @@ div:focus {
7171
padding: 20px 0 20px 20px;
7272
}
7373

74-
.oprationButtonGroup{
75-
position:absolute;
76-
border: 1px solid #66b1ff;
77-
top: 40px;
78-
z-index: 10;
79-
background-color: #fff;
80-
padding: 5px 20px;
81-
left: 50%;
82-
margin-left: -40px;
74+
.el-popover{
75+
min-width: 80px;
8376
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,263 @@
1+
<template>
2+
<div>
3+
<!-- 合同模板类型开始 -->
4+
5+
<!-- filter区域开始 -->
6+
<div class="paddingb20">
7+
<el-row>
8+
<el-input v-show="showContractTemplateCategoryFilterArea" v-model="infoValue" placeholder="信息编号/名称" style="width: 203px;" class="marginr20" size="small">
9+
<el-button slot="append" icon="el-icon-search" />
10+
</el-input>
11+
<el-select v-show="showContractTemplateCategoryFilterArea" v-model="reasonValue" size="small" clearable placeholder="事由" class="marginr20">
12+
<el-option
13+
v-for="item in reasonList"
14+
:key="item.value"
15+
:label="item.label"
16+
:value="item.value"
17+
/>
18+
</el-select>
19+
<el-select v-show="showContractTemplateCategoryFilterArea" v-model="contractRangeValue" size="small" clearable placeholder="合同期限" class="marginr20">
20+
<el-option
21+
v-for="item in contractRangeList"
22+
:key="item.value"
23+
:label="item.label"
24+
:value="item.value"
25+
/>
26+
</el-select>
27+
<el-select v-show="showContractTemplateCategoryFilterArea" v-model="lawValue" size="small" clearable placeholder="法律实体" class="marginr20">
28+
<el-option
29+
v-for="item in lawList"
30+
:key="item.value"
31+
:label="item.label"
32+
:value="item.value"
33+
/>
34+
</el-select>
35+
<i class="el-icon-arrow-up marginl20 text-blue float-right" @click="switchContractTemplateCategoryFilterArea" />
36+
<svg-icon icon-class="example" class="text-blue float-right" @click="switchContractTemplateCategoryFilterArea" />
37+
</el-row>
38+
<el-row v-show="showContractTemplateCategoryFilterArea" class="margint20">
39+
<el-select v-model="orderValue" size="small" clearable placeholder="签署顺序" class="marginr20">
40+
<el-option
41+
v-for="item in orderList"
42+
:key="item.value"
43+
:label="item.label"
44+
:value="item.value"
45+
/>
46+
</el-select>
47+
<el-select v-model="digitalSignValue" size="small" clearable placeholder="是否支持电子签">
48+
<el-option
49+
v-for="item in digitalSignList"
50+
:key="item.value"
51+
:label="item.label"
52+
:value="item.value"
53+
/>
54+
</el-select>
55+
<el-button size="small" round class="float-right marginl20">取消</el-button>
56+
<el-button size="small" round type="primary" class="float-right">应用</el-button>
57+
</el-row>
58+
</div>
59+
<!-- filter区域结束 -->
60+
61+
<!-- table区域开始 -->
62+
<div class="flex-container">
63+
<div>
64+
模板类型({{ contractTemplateCategoryListTotal }})
65+
<el-button type="primary" icon="el-icon-plus" size="small" round>新建</el-button>
66+
</div>
67+
<div class="flex-container">
68+
<div class="fs-12 marginr10">2019 07 02 00:21 Bruce Bu 最后更新</div>
69+
<el-button type="primary" icon="el-icon-upload" size="small" plain>上传模板类型列表</el-button>
70+
<el-button type="primary" icon="el-icon-download" size="small" plain>下载模板类型列表</el-button>
71+
</div>
72+
</div>
73+
<div class="border margint10">
74+
<el-table
75+
v-loading="listLoading"
76+
:data="contractTemplateCategoryTableData"
77+
size="small"
78+
stripe
79+
style="width: 100%"
80+
>
81+
<el-table-column sortable prop="id" label="编号" width="80" align="center" />
82+
<el-table-column sortable prop="reason" label="事由" width="80" align="center" />
83+
<el-table-column sortable prop="tmplateName" label="模板类型名称" width="180" align="center" />
84+
<el-table-column sortable prop="exprise" label="合同期限" align="center" width="100" />
85+
<el-table-column sortable prop="law" label="法律实体" align="center" width="150" />
86+
<el-table-column sortable prop="signtory" label="签署人" class="flex-container" align="center" width="120">
87+
<template slot-scope="{row}">
88+
<el-popover
89+
ref="popover1"
90+
placement="bottom"
91+
width="120"
92+
trigger="hover"
93+
content="MC总监|MC计划副总监"
94+
>
95+
<div slot="reference" class="round border text-blue dis-i cell-round-container">{{ row.signtory }}</div>
96+
</el-popover>
97+
</template>
98+
</el-table-column>
99+
<el-table-column sortable prop="emailTemplate" label="邮件模板" align="center" width="140">
100+
<template slot-scope="{row}">
101+
<el-popover
102+
ref="popover2"
103+
placement="bottom"
104+
width="120"
105+
trigger="hover"
106+
content="寄送邮件|签约邮件"
107+
>
108+
<div slot="reference" class="round border text-blue dis-i cell-round-container">{{ row.emailTemplate }}</div>
109+
</el-popover>
110+
</template>
111+
</el-table-column>
112+
<el-table-column sortable prop="signtoryWay" label="签署方式" align="center" width="140" />
113+
<el-table-column sortable prop="isEsignature" label="是否支持电子签" align="center" width="140" />
114+
<el-table-column label="操作" align="center">
115+
<template slot-scope="{row}">
116+
<el-popover
117+
ref="popover3"
118+
placement="bottom"
119+
width="60"
120+
trigger="click"
121+
>
122+
<div><el-button type="text" icon="el-icon-edit" size="mini">编辑</el-button></div>
123+
<div><el-button class="text-red" type="text" icon="el-icon-delete" size="mini">删除</el-button></div>
124+
<i slot="reference" class="el-icon-edit" style="cursor: pointer;" />
125+
</el-popover>
126+
</template>
127+
</el-table-column>
128+
</el-table>
129+
</div>
130+
<!-- table区域结束 -->
131+
132+
<pagination v-show="contractTemplateCategoryListTotal>0" class="paddingb10" :total="contractTemplateCategoryListTotal" :page.sync="contractTemplateCategoryListQuery.page" :limit.sync="contractTemplateCategoryListQuery.limit" @pagination="getContractTemplateCategoryList" />
133+
<!-- 合同模板类型结束 -->
134+
</div>
135+
</template>
136+
137+
<script>
138+
import { fetchContractTemplateCategoryList } from '@/api/system'
139+
import Pagination from '@/components/Pagination'
140+
export default {
141+
name: 'ContractTemplateCategory',
142+
components: { Pagination },
143+
data() {
144+
return {
145+
showContractTemplateCategoryFilterArea: true,
146+
infoValue: '',
147+
contractRangeList: [
148+
{
149+
label: '一天',
150+
value: 'day'
151+
},
152+
{
153+
label: '一周',
154+
value: 'week'
155+
}
156+
],
157+
contractRangeValue: '',
158+
reasonList: [
159+
{
160+
label: '事由1',
161+
value: 'reason1'
162+
},
163+
{
164+
label: '事由2',
165+
value: 'reason2'
166+
}
167+
],
168+
reasonValue: '',
169+
lawList: [
170+
{
171+
label: '条例1',
172+
value: 'law1'
173+
},
174+
{
175+
label: '条例2',
176+
value: 'law2'
177+
}
178+
],
179+
lawValue: '',
180+
orderList: [
181+
{
182+
label: '从高到底',
183+
value: 'reverse'
184+
},
185+
{
186+
label: '从低到高',
187+
value: 'order'
188+
}
189+
],
190+
orderValue: '',
191+
digitalSignList: [
192+
{
193+
label: '全部',
194+
value: 'all'
195+
},
196+
{
197+
label: '支持电子签',
198+
value: 'support'
199+
},
200+
{
201+
label: '不支持电子签',
202+
value: 'no-support'
203+
}
204+
],
205+
digitalSignValue: '',
206+
useRateList: [
207+
{
208+
label: 'A',
209+
value: 'all'
210+
},
211+
{
212+
label: 'B',
213+
value: 'run'
214+
},
215+
{
216+
label: 'C',
217+
value: 'stop'
218+
}
219+
],
220+
contractTemplateCategoryListTotal: 0,
221+
contractTemplateCategoryTableData: null,
222+
listLoading: false,
223+
contractTemplateCategoryListQuery: {
224+
page: 1,
225+
limit: 10,
226+
sort: '+id'
227+
}
228+
}
229+
},
230+
computed: {
231+
232+
},
233+
created() {
234+
this.getContractTemplateCategoryList()
235+
},
236+
methods: {
237+
switchContractTemplateCategoryFilterArea() {
238+
this.showContractTemplateCategoryFilterArea ? this.showContractTemplateCategoryFilterArea = false : this.showContractTemplateCategoryFilterArea = true
239+
},
240+
getContractTemplateCategoryList() {
241+
this.listLoading = true
242+
fetchContractTemplateCategoryList(this.contractTemplateCategoryListQuery).then(response => {
243+
this.contractTemplateCategoryTableData = response.data.items
244+
this.contractTemplateCategoryListTotal = response.data.total
245+
246+
// Just to simulate the time of the request
247+
setTimeout(() => {
248+
this.listLoading = false
249+
}, 1.5 * 1000)
250+
})
251+
}
252+
}
253+
}
254+
</script>
255+
256+
<style lang="scss" scoped>
257+
.cell-round-container {
258+
border-color: #007bff;
259+
width: 30px;
260+
height:30px;
261+
line-height: 30px;
262+
}
263+
</style>

0 commit comments

Comments
 (0)