|
|
@@ -8,8 +8,8 @@
|
|
|
size="small"
|
|
|
style="margin-top: 15px"
|
|
|
>
|
|
|
- <el-row type="flex" justify="space-between">
|
|
|
- <el-col :span="5">
|
|
|
+ <el-row style="flex-wrap: wrap; display: flex">
|
|
|
+ <el-col :span="5" :xs="10" :sm="10" :md="5">
|
|
|
<el-form-item label="工号">
|
|
|
<el-input
|
|
|
placeholder="请输入工号"
|
|
|
@@ -28,7 +28,7 @@
|
|
|
</el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
- <el-col :span="5">
|
|
|
+ <el-col :span="5" :xs="5" :sm="10" :md="5" :offset="1">
|
|
|
<el-form-item label="业务员" prop="name">
|
|
|
<el-input
|
|
|
placeholder="请输入业务员"
|
|
|
@@ -47,7 +47,7 @@
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
|
|
|
- <el-col :span="5">
|
|
|
+ <el-col :span="5" :offset="1" :xs="5" :sm="10" :md="5">
|
|
|
<el-form-item label="工号类型">
|
|
|
<el-select v-model="salespersonForm.noType" disabled>
|
|
|
<el-option label="业务员" value="A"></el-option>
|
|
|
@@ -55,7 +55,7 @@
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
- <el-col :span="5">
|
|
|
+ <el-col :span="5" :offset="1" :xs="5" :sm="10" :md="5">
|
|
|
<el-form-item label="归属" >
|
|
|
<el-input v-model="salespersonForm.deptName" disabled></el-input>
|
|
|
</el-form-item>
|
|
|
@@ -65,7 +65,7 @@
|
|
|
</div>
|
|
|
<div class="quotation-page">
|
|
|
<el-tabs v-model="activeName" tab-position="left" @tab-click="handleClick">
|
|
|
- <el-tab-pane label="报价" name="999" >
|
|
|
+ <el-tab-pane label="报价" name="999" class="first">
|
|
|
<span slot="label" title="报价">
|
|
|
<img class="active" v-if="activeName == '999'" src="@/assets/image/task/active_quotation.png" alt="">
|
|
|
<img class="img" v-else src="@/assets/image/task/quotation.png" alt="">
|
|
|
@@ -277,6 +277,7 @@ export default {
|
|
|
overflow-y: auto;
|
|
|
height: 80vh;
|
|
|
}
|
|
|
+
|
|
|
/deep/.el-tabs{
|
|
|
position: relative;
|
|
|
.el-tabs__header {
|
|
|
@@ -364,4 +365,52 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+@media (max-width: 1000px) {
|
|
|
+ /deep/.el-tabs {
|
|
|
+ .el-tabs__header {
|
|
|
+ position: absolute;
|
|
|
+ z-index: 99;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ bottom: 50px;
|
|
|
+ height: 60px !important;
|
|
|
+ margin: 0;
|
|
|
+ padding: 0 20px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ background: #F4F4F4;
|
|
|
+ box-shadow: 2px 2px 10px 0px rgba(0,0,0,0.25);
|
|
|
+ border-radius: 8px 8px 8px 8px;
|
|
|
+ text-align: center;
|
|
|
+ .el-tabs__item:not(:first-child)::after{
|
|
|
+ content: '' !important;
|
|
|
+ color: #9F9F9F;
|
|
|
+ padding: 0 !important;
|
|
|
+ }
|
|
|
+ .el-tabs__item {
|
|
|
+ display: none !important;
|
|
|
+ }
|
|
|
+ #tab-999 {
|
|
|
+ display: block !important;
|
|
|
+ }
|
|
|
+ &:hover {
|
|
|
+ .el-tabs__item {
|
|
|
+ display: block !important;
|
|
|
+ }
|
|
|
+ .el-tabs__item:not(:first-child)::after{
|
|
|
+ content: '|' !important;
|
|
|
+ color: #9F9F9F;
|
|
|
+ padding: 0 24px !important;
|
|
|
+ vertical-align: text-bottom;
|
|
|
+ }
|
|
|
+ .el-tabs__item:last-child::after{
|
|
|
+ content: '' !important;
|
|
|
+ color: #9F9F9F;
|
|
|
+ padding: 0 !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|