Skip to content

Commit 3a97382

Browse files
GeekQiaQiaGeekQiaQia
committed
fix(styles): template
1 parent 84c6775 commit 3a97382

File tree

7 files changed

+226
-245
lines changed

7 files changed

+226
-245
lines changed

‎src/views/Dashboard/test.vue

+6-9
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
11
<template>
22
<div class="analysisInfo">
3-
<fragment>
4-
<div class="info">
5-
<span style="display: block; font-size: 24px; margin: 24px 0">数据可视化</span>
6-
<span style="text-align: left">数据可视化主要旨在借助于图形化手段，清晰有效地传达与沟通信息，</span>
7-
</div>
8-
</fragment>
3+
<div class="info">
4+
<span style="display: block; font-size: 24px; margin: 24px 0">数据可视化</span>
5+
<span style="text-align: left">数据可视化主要旨在借助于图形化手段，清晰有效地传达与沟通信息，</span>
6+
</div>
97
<!-- <el-row>
108
<el-col :offset="1" :span="15">
119
<div class="grid-content bg-purple-dark">
@@ -16,9 +14,8 @@
1614
</el-col>
1715
</el-row> -->
1816
<div class="echart-container">
19-
<fragment>
20-
<div ref="lineEchart" style="width: 100%; height: 400px" class="echart"></div>
21-
</fragment>
17+
<div ref="lineEchart" style="width: 100%; height: 400px" class="echart"></div>
18+
2219
<div class="bottom-chart">
2320
<div ref="refEchart" style="width: 49%; height: 400px" class="echart"></div>
2421
<div ref="radarEchart" style="width: 49%; height: 400px" class="echart"></div>

‎src/views/Editor/jsonEditor.vue

+4-6
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,10 @@
99
<el-col :offset="1" :span="22">
1010
<div class="grid-content bg-purple-dark">
1111
<el-card class="box-card">
12-
<fragment>
13-
<div style="text-align: left">
14-
<span>JSON编辑器</span>
15-
<el-divider></el-divider>
16-
</div>
17-
</fragment>
12+
<div style="text-align: left">
13+
<span>JSON编辑器</span>
14+
<el-divider></el-divider>
15+
</div>
1816
<div class="form-container">
1917
<el-form ref="form" :model="selectForm" label-width="120px">
2018
<el-form-item label="主题 theme" :inline="true" label-position="right">

‎src/views/Editor/richEditor.vue

+4-6
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,10 @@
99
<el-col :offset="1" :span="22">
1010
<div class="grid-content bg-purple-dark">
1111
<el-card class="box-card">
12-
<fragment>
13-
<div style="text-align: left">
14-
<span>富文本编辑器</span>
15-
<el-divider></el-divider>
16-
</div>
17-
</fragment>
12+
<div style="text-align: left">
13+
<span>富文本编辑器</span>
14+
<el-divider></el-divider>
15+
</div>
1816
<div ref="reditor"></div>
1917
</el-card>
2018
</div>

‎src/views/Form/advanceForm.vue

+104-111
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
11
<template>
22
<div class="FormInfo">
3-
<fragment>
4-
<div class="info">
5-
<el-divider content-position="left">高级表单</el-divider>
6-
<span style="text-align: left">高级表单常见于一次性输入和提交大批量数据的场景。</span>
7-
</div>
8-
</fragment>
3+
<div class="info">
4+
<el-divider content-position="left">高级表单</el-divider>
5+
<span style="text-align: left">高级表单常见于一次性输入和提交大批量数据的场景。</span>
6+
</div>
97
<el-row>
108
<el-col :offset="1" :span="22">
119
<div class="grid-content bg-purple-dark">
@@ -18,69 +16,66 @@
1816
<div></div>
1917
</div>
2018
</template>
19+
<div style="text-align: left">
20+
<span>记录管理</span>
21+
<el-divider></el-divider>
22+
</div>
23+
<el-table :data="tableData" style="width: 100%">
24+
<el-table-column label="姓名" width="180">
25+
<template #default="scope">
26+
<el-popover effect="light" trigger="hover" placement="top">
27+
<template #default>
28+
<p>姓名: {{ scope.row.name }}</p>
29+
<p>住址: {{ scope.row.address }}</p>
30+
</template>
31+
<template #reference>
32+
<el-input v-if="scope.row.edit" v-model="scope.row.name"></el-input>
33+
<div v-else class="name-wrapper">
34+
<el-tag size="medium">{{ scope.row.name }}</el-tag>
35+
</div>
36+
</template>
37+
</el-popover>
38+
</template>
39+
</el-table-column>
40+
<el-table-column prop="province" label="省份" width="120">
41+
<template #default="scope">
42+
<el-input v-if="scope.row.edit" v-model="scope.row.province"></el-input>
43+
<span v-else>{{ scope.row.province }}</span>
44+
</template>
45+
</el-table-column>
46+
<el-table-column prop="city" label="市区" width="120">
47+
<template #default="scope">
48+
<el-input v-if="scope.row.edit" v-model="scope.row.city"></el-input>
49+
<span v-else>{{ scope.row.city }}</span>
50+
</template>
51+
</el-table-column>
52+
<el-table-column prop="address" label="详细地址">
53+
<template #default="scope">
54+
<el-input v-if="scope.row.edit" v-model="scope.row.address"></el-input>
55+
<span v-else>{{ scope.row.address }}</span>
56+
</template>
57+
</el-table-column>
58+
<el-table-column label="操作" width="200">
59+
<template #default="scope">
60+
<el-button v-if="scope.row.edit" size="mini" type="success" icon="el-icon-check" @click="handleSave(scope.$index, scope.row)">保存</el-button>
2161

22-
<fragment>
23-
<div style="text-align: left">
24-
<span>记录管理</span>
25-
<el-divider></el-divider>
26-
</div>
27-
<el-table :data="tableData" style="width: 100%">
28-
<el-table-column label="姓名" width="180">
29-
<template #default="scope">
30-
<el-popover effect="light" trigger="hover" placement="top">
31-
<template #default>
32-
<p>姓名: {{ scope.row.name }}</p>
33-
<p>住址: {{ scope.row.address }}</p>
34-
</template>
35-
<template #reference>
36-
<el-input v-if="scope.row.edit" v-model="scope.row.name"></el-input>
37-
<div v-else class="name-wrapper">
38-
<el-tag size="medium">{{ scope.row.name }}</el-tag>
39-
</div>
40-
</template>
41-
</el-popover>
42-
</template>
43-
</el-table-column>
44-
<el-table-column prop="province" label="省份" width="120">
45-
<template #default="scope">
46-
<el-input v-if="scope.row.edit" v-model="scope.row.province"></el-input>
47-
<span v-else>{{ scope.row.province }}</span>
48-
</template>
49-
</el-table-column>
50-
<el-table-column prop="city" label="市区" width="120">
51-
<template #default="scope">
52-
<el-input v-if="scope.row.edit" v-model="scope.row.city"></el-input>
53-
<span v-else>{{ scope.row.city }}</span>
54-
</template>
55-
</el-table-column>
56-
<el-table-column prop="address" label="详细地址">
57-
<template #default="scope">
58-
<el-input v-if="scope.row.edit" v-model="scope.row.address"></el-input>
59-
<span v-else>{{ scope.row.address }}</span>
60-
</template>
61-
</el-table-column>
62-
<el-table-column label="操作" width="200">
63-
<template #default="scope">
64-
<el-button v-if="scope.row.edit" size="mini" type="success" icon="el-icon-check" @click="handleSave(scope.$index, scope.row)">保存</el-button>
65-
66-
<el-button v-else size="mini" icon="el-icon-edit" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
67-
<el-popconfirm
68-
confirm-button-text="确定"
69-
cancel-button-text="取消"
70-
icon="el-icon-info"
71-
icon-color="red"
72-
title="确定删除该条记录吗？"
73-
@confirm="handleDelete(scope.$index, scope.row)"
74-
>
75-
<template #reference>
76-
<el-button size="mini" icon="el-icon-delete" type="danger">删除</el-button>
77-
</template>
78-
</el-popconfirm>
79-
</template>
80-
</el-table-column>
81-
</el-table>
82-
<div style="margin: 5px"><el-button @click="handleAddRecord">+ 新增记录</el-button></div>
83-
</fragment>
62+
<el-button v-else size="mini" icon="el-icon-edit" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
63+
<el-popconfirm
64+
confirm-button-text="确定"
65+
cancel-button-text="取消"
66+
icon="el-icon-info"
67+
icon-color="red"
68+
title="确定删除该条记录吗？"
69+
@confirm="handleDelete(scope.$index, scope.row)"
70+
>
71+
<template #reference>
72+
<el-button size="mini" icon="el-icon-delete" type="danger">删除</el-button>
73+
</template>
74+
</el-popconfirm>
75+
</template>
76+
</el-table-column>
77+
</el-table>
78+
<div style="margin: 5px"><el-button @click="handleAddRecord">+ 新增记录</el-button></div>
8479
</el-card>
8580
</div>
8681
</el-col>
@@ -90,49 +85,47 @@
9085
<el-col :offset="1" :span="22">
9186
<div class="grid-content bg-purple-dark">
9287
<el-card class="box-card">
93-
<fragment>
94-
<div style="text-align: left">
95-
<span>活动管理</span>
96-
<el-divider></el-divider>
97-
</div>
98-
<el-form ref="activityForm" style="text-align: left" :model="sizeForm" label-width="80px" size="mini">
99-
<el-form-item label="活动名称">
100-
<el-input v-model="sizeForm.name"></el-input>
101-
</el-form-item>
102-
<el-form-item label="活动区域">
103-
<el-select v-model="sizeForm.region" placeholder="请选择活动区域">
104-
<el-option label="区域一" value="shanghai"></el-option>
105-
<el-option label="区域二" value="beijing"></el-option>
106-
</el-select>
107-
</el-form-item>
108-
<el-form-item label="活动时间">
109-
<el-col :span="11">
110-
<el-date-picker v-model="sizeForm.date1" type="date" placeholder="选择日期" style="width: 100%"></el-date-picker>
111-
</el-col>
112-
<el-col class="line" :span="2">-</el-col>
113-
<el-col :span="11">
114-
<el-time-picker v-model="sizeForm.date2" placeholder="选择时间" style="width: 100%"></el-time-picker>
115-
</el-col>
116-
</el-form-item>
117-
<el-form-item label="活动性质">
118-
<el-checkbox-group v-model="sizeForm.type">
119-
<el-checkbox-button label="美食/餐厅线上活动" name="type"></el-checkbox-button>
120-
<el-checkbox-button label="地推活动" name="type"></el-checkbox-button>
121-
<el-checkbox-button label="线下主题活动" name="type"></el-checkbox-button>
122-
</el-checkbox-group>
123-
</el-form-item>
124-
<el-form-item label="特殊资源">
125-
<el-radio-group v-model="sizeForm.resource" size="medium">
126-
<el-radio border label="线上品牌商赞助"></el-radio>
127-
<el-radio border label="线下场地免费"></el-radio>
128-
</el-radio-group>
129-
</el-form-item>
130-
<el-form-item size="large">
131-
<el-button type="primary" @click="submitForm">立即创建</el-button>
132-
<el-button>取消</el-button>
133-
</el-form-item>
134-
</el-form>
135-
</fragment>
88+
<div style="text-align: left">
89+
<span>活动管理</span>
90+
<el-divider></el-divider>
91+
</div>
92+
<el-form ref="activityForm" style="text-align: left" :model="sizeForm" label-width="80px" size="mini">
93+
<el-form-item label="活动名称">
94+
<el-input v-model="sizeForm.name"></el-input>
95+
</el-form-item>
96+
<el-form-item label="活动区域">
97+
<el-select v-model="sizeForm.region" placeholder="请选择活动区域">
98+
<el-option label="区域一" value="shanghai"></el-option>
99+
<el-option label="区域二" value="beijing"></el-option>
100+
</el-select>
101+
</el-form-item>
102+
<el-form-item label="活动时间">
103+
<el-col :span="11">
104+
<el-date-picker v-model="sizeForm.date1" type="date" placeholder="选择日期" style="width: 100%"></el-date-picker>
105+
</el-col>
106+
<el-col class="line" :span="2">-</el-col>
107+
<el-col :span="11">
108+
<el-time-picker v-model="sizeForm.date2" placeholder="选择时间" style="width: 100%"></el-time-picker>
109+
</el-col>
110+
</el-form-item>
111+
<el-form-item label="活动性质">
112+
<el-checkbox-group v-model="sizeForm.type">
113+
<el-checkbox-button label="美食/餐厅线上活动" name="type"></el-checkbox-button>
114+
<el-checkbox-button label="地推活动" name="type"></el-checkbox-button>
115+
<el-checkbox-button label="线下主题活动" name="type"></el-checkbox-button>
116+
</el-checkbox-group>
117+
</el-form-item>
118+
<el-form-item label="特殊资源">
119+
<el-radio-group v-model="sizeForm.resource" size="medium">
120+
<el-radio border label="线上品牌商赞助"></el-radio>
121+
<el-radio border label="线下场地免费"></el-radio>
122+
</el-radio-group>
123+
</el-form-item>
124+
<el-form-item size="large">
125+
<el-button type="primary" @click="submitForm">立即创建</el-button>
126+
<el-button>取消</el-button>
127+
</el-form-item>
128+
</el-form>
136129
</el-card>
137130
</div></el-col
138131
>

‎src/views/Form/formInfo.vue

+4-6
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
11
<template>
22
<div class="FormInfo">
3-
<fragment>
4-
<div class="info">
5-
<el-divider content-position="left">基础表单</el-divider>
6-
<span style="text-align: left">用于向用户收集或验证信息，基础表单常见于数据项较少的表单场景。</span>
7-
</div>
8-
</fragment>
3+
<div class="info">
4+
<el-divider content-position="left">基础表单</el-divider>
5+
<span style="text-align: left">用于向用户收集或验证信息，基础表单常见于数据项较少的表单场景。</span>
6+
</div>
97
<el-row>
108
<el-col :offset="1" :span="22">
119
<div class="grid-content bg-purple-dark">

‎src/views/Form/stepForm.vue

+11-12
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
<template>
22
<div class="stepForm">
3-
<fragment>
4-
<div class="info">
5-
<el-divider content-position="left">分步表单</el-divider>
6-
<span style="text-align: left">将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。</span>
7-
</div>
8-
</fragment>
3+
<div class="info">
4+
<el-divider content-position="left">分步表单</el-divider>
5+
<span style="text-align: left">将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。</span>
6+
</div>
7+
98
<el-row>
109
<el-col :offset="1" :span="22">
1110
<div class="grid-content bg-purple-dark">
@@ -23,7 +22,7 @@
2322
<el-step title="确认转账信息" description="请仔细核对转账信息"></el-step>
2423
<el-step title="完成" description="操作成功"></el-step>
2524
</el-steps>
26-
<fragment v-if="active == 0">
25+
<template v-if="active == 0">
2726
<el-form ref="accountForm" :model="ruleForm" :rules="rules" label-width="100px" class="demo-ruleForm">
2827
<el-form-item label="付款账户" prop="payAccountNo">
2928
<el-input v-model="ruleForm.payAccountNo"></el-input>
@@ -49,8 +48,8 @@
4948
<el-button @click="resetForm()">重置</el-button>
5049
</el-form-item>
5150
</el-form>
52-
</fragment>
53-
<fragment v-else-if="active == 1">
51+
</template>
52+
<template v-else-if="active == 1">
5453
<el-form ref="accountForm" :model="ruleForm" label-width="100px" class="demo-ruleForm">
5554
<el-form-item label="付款账户" prop="payAccountNo">
5655
<el-input v-model="ruleForm.payAccountNo" readonly></el-input>
@@ -70,14 +69,14 @@
7069
<el-button @click="handleLastStep()">上一步</el-button>
7170
</el-form-item>
7271
<el-divider></el-divider>
73-
</fragment>
74-
<fragment v-else-if="active == 3">
72+
</template>
73+
<template v-else-if="active == 3">
7574
<el-result icon="success" title="操作成功" sub-title="预计两小时内到账">
7675
<template #extra>
7776
<el-button type="primary" size="medium" @click="handleRedo">再转一笔</el-button>
7877
</template>
7978
</el-result>
80-
</fragment>
79+
</template>
8180
</el-card>
8281
</div>
8382
</el-col>

0 commit comments

Comments
 (0)