Commit 28aabf73 authored by 黄奎's avatar 黄奎

页面修改

parent f8429996
......@@ -132,7 +132,8 @@
</q-card-section>
<q-card-actions align="right" class="bg-white">
<q-btn label="取消" flat color="primary" v-close-popup />
<q-btn label="创建报价单" color="accent" class="q-px-md" style="font-weight:400 !important" @click="saveOffice" />
<q-btn :label="model.Id==0?'创建报价单':'保存报价单'" color="accent" class="q-px-md" style="font-weight:400 !important"
@click="saveOffice" />
</q-card-actions>
</q-card>
</template>
......
......@@ -3,104 +3,104 @@
list-style-type: none;
}
.courseList ul {
padding: 0px
.courseOffer ul {
padding: 0px;
}
.courseList li {
.courseOffer li {
background: rgba(221, 222, 224, 0.2);
border-radius: 4px;
margin-top: 15px
margin-top: 15px;
}
.courseList li .dline {
.courseOffer li .dline {
display: table;
width: 100%;
display: flex;
flex-direction: row
flex-direction: row;
}
.courseList li .d1,
.courseList li .d2,
.courseList li .d3,
.courseList li .d4,
.courseList li .d5 {
.courseOffer li .d1,
.courseOffer li .d2,
.courseOffer li .d3,
.courseOffer li .d4,
.courseOffer li .d5 {
width: 18%;
padding: 20px 20px 10px;
}
.courseList li .d7 {
.courseOffer li .d7 {
flex: 1;
width: 1px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center
justify-content: center;
}
.courseList li .d1 .di-title {
.courseOffer li .d1 .di-title {
font-size: 16px;
color: #111111;
}
.courseList li .d1 .di-c {
.courseOffer li .d1 .di-c {
font-size: 14px;
display: flex;
line-height: 28px;
color: #111111
color: #111111;
}
.courseList li .d6 {
.courseOffer li .d6 {
padding: 10px 20px;
width: 100%;
height: inherit;
position: relative;
border-top: 1px solid #DDDEE0
border-top: 1px solid #dddee0;
}
.courseList li .d6 .progress {
.courseOffer li .d6 .progress {
width: 100%;
height: 5px;
position: absolute;
left: 0;
bottom: 0
bottom: 0;
}
.courseList li .d2 div {
.courseOffer li .d2 div {
margin: 2px 0;
font-size: 14px;
color: #111111;
}
.courseList li .d2-n {
.courseOffer li .d2-n {
font-size: 12px;
color: #999999;
margin-right: 20px
margin-right: 20px;
}
.courseList li .d3 .d3-s {
.courseOffer li .d3 .d3-s {
color: var(--q-color-negative);
font-weight: bold
font-weight: bold;
}
.courseList li .d3 div {
.courseOffer li .d3 div {
margin: 2px 0;
font-size: 14px;
}
.courseList li .d4 div {
.courseOffer li .d4 div {
font-size: 14px;
color: #111111;
margin: 2px 0;
}
.courseList li .d5 div {
.courseOffer li .d5 div {
font-size: 14px;
color: #111111;
margin: 2px 0;
}
.courseList .myCourseNName {
.courseOffer .myCourseNName {
width: 25px;
height: 25px;
border-radius: 50%;
......@@ -112,7 +112,7 @@
</style>
<template>
<div class="page-body courseList">
<div class="page-body courseOffer">
<div class="page-search row items-center">
<div class="col row wrap q-mr-lg q-col-gutter-md">
<div class="col-3">
......@@ -122,79 +122,29 @@
</div>
</div>
<div class="page-content">
<ul v-if="data.length!=0">
<li v-for="(item,index) in data" :key="index">
<div class="dline">
<div class="d1" style="width:25%">
<div class="di-title">流水号</div>
<div class="di-c" style="margin-top: 25px;">
<div>{{item.SerialNum}}
</div>
</div>
</div>
<div class="d2">
<div class="di-title">名称</div>
<div class="di-c" style="margin-top: 25px;">
<div style="margin-left:5px;">{{item.Name}}</div>
</div>
</div>
<div class="d3">
<div class="di-title">客户信息</div>
<div class="di-c" style="margin-top: 25px;">
<span style="margin-right:5px;">{{item.CustomerName}} / {{item.CustomerTel}}</span>
</div>
</div>
<div class="d4" style="width:20%">
<div class="di-title">总原价</div>
<div class="di-c" style="margin-top: 25px;">
<span
style="color: var(--q-color-negative); font-weight: bold;">{{item.TotalOriginalPrice.toFixed(2)}}</span>
</div>
</div>
<div class="d5" style="width:20%">
<div class="di-title">总价格</div>
<div class="di-c" style="margin-top: 25px;">
<span style="color: var(--q-color-negative); font-weight: bold;">{{item.TotalPrice.toFixed(2)}}</span>
</div>
</div>
<div class="d5" style="width:20%">
<div class="di-title">总优惠</div>
<div class="di-c" style="margin-top: 25px;">
<span
style="color: var(--q-color-negative); font-weight: bold;">{{item.TotalDiscountPrice.toFixed(2)}}</span>
</div>
</div>
<div class="d5" style="width:19%">
<div class="di-title">报名人数</div>
<div class="di-c" style="margin-top: 25px;">
<span style="color: var(--q-color-negative); font-weight: bold;">{{item.JoinNum}}</span>
</div>
</div>
<div class="d5" style="width:19%">
<div class="di-title">状态</div>
<div class="di-c" style="margin-top: 25px;">
<span>{{item.CustomerStatusName}}</span>
</div>
</div>
<div class="d5" style="width:19%">
<div class="di-title">操作</div>
<div class="di-c" style="margin-top: 25px;">
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="修改报价单"
@click="editQuotation(item)" />
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="详情"
@click="gotoDetails(item)" />
</div>
</div>
<q-table :pagination="msg" :loading="loading" no-data-label="暂无相关数据" flat class="sticky-tow-column-table"
separator="none" :data="data" :columns="columns" row-key="name">
<template v-slot:top="props">
<div class="col-2 q-table__title">课程报价单</div>
<q-space />
<div class="page-option">
<q-btn color="accent" size="sm" class="q-mr-md" icon="add" label="创建报价单" @click="editQuotation(null)" />
</div>
</li>
<li style="border: none;display: flex;justify-content: flex-end;background: white;padding: 5px 20px">
<q-pagination v-model="msg.pageIndex" :max="pageCount" @input="changePage" class="full-width justify-end"
color="primary" :input="true">
</q-pagination>
</li>
</ul>
<div v-else style="width: 100%;color: #999999;text-align: center;font-size: 15px">暂无数据</div>
</template>
<template v-slot:body-cell-optioned="props">
<q-td :props="props">
<div>
<q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="编辑"
@click="editQuotation(props.row)" />
<q-btn flat color="primary" label="详情" @click="gotoDetails(props.row)" />
</div>
</q-td>
</template>
<template v-slot:bottom>
<q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount"
:input="true" @input="changePage" />
</template>
</q-table>
</div>
<q-dialog v-model="showForm" persistent>
<quotation-form :obj="offerObj" @save="showForm=false"></quotation-form>
......@@ -220,14 +170,87 @@
loading: true,
msg: {
pageIndex: 1,
pageSize: 12,
rowsPerPage: 12,
pageSize: 10,
rowsPerPage: 10,
Name: "",
IsGetDetails: 1,
},
pageCount: 0,
showForm: false, //是否显示报价单弹窗
offerObj: {}, //报价单信息
columns: [{
name: "SerialNum",
label: "流水号",
field: "SerialNum",
align: "left"
},
{
name: "Name",
label: "名称",
field: "Name",
align: "left"
},
{
name: "CustomerName",
required: true,
label: "客户信息",
align: "left",
field: row => row.CustomerName
},
{
name: "CustomerTel",
required: true,
label: "客户电话",
align: "left",
field: row => row.CustomerTel
},
{
name: "TotalOriginalPrice",
required: true,
label: "总原价",
align: "left",
field: row => row.TotalOriginalPrice.toFixed(2)
},
{
name: "TotalPrice",
required: true,
label: "总价",
align: "left",
field: row => row.TotalPrice.toFixed(2)
},
{
name: "TotalDiscountPrice",
required: true,
label: "总优惠",
align: "left",
field: row => row.TotalDiscountPrice.toFixed(2)
},
{
name: "JoinNum",
label: "报名人数",
field: "JoinNum",
align: "left",
format: (val, row) => `${val}人`
},
{
name: "CustomerStatusName",
label: "状态",
field: "CustomerStatusName",
align: "left",
format: (val, row) => `${val}`
},
{
name: "CreateTimeStr",
label: "报价时间",
field: "CreateTimeStr",
align: "left"
},
{
name: 'optioned',
label: '操作',
field: 'Id'
}
],
}
},
mounted() {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment