漏斗图优化

src/views/user-path/add-funnel.vue

@@ -39,7 +39,7 @@
                     style="width:100%;">
                         <el-col :span="11">
                             <el-form-item label="步骤名称">
-                                <el-input :class="{'red-b': item.nameCheck}" v-model="item.actionName" @blur="stepNameRepeat(item.actionName, index)" maxlength="30" placeholder="请输入步骤名称" style="width:250px;"></el-input>
+                                <el-input :class="{'red-b': item.nameCheck}" v-model="item.actionName" @blur="stepNameRepeat(item.actionName, index)" maxlength="30" placeholder="请输入步骤名称" style="width:70%"></el-input>
                                 <span v-show="item.nameCheck" style="color: red; font-size: 12px;">名称重复，请重新输入</span>
                             </el-form-item>
                         </el-col>
@@ -50,7 +50,7 @@
                                 :class="{'red-b': item.unchecked}"
                                 @focus="getEventData" 
                                 v-model="item.eventName" 
-                                style="width:300px;"
+                                style="width:80%;"
                                 :title="item.eventName"
                                 placeholder="请选择用户触发事件"></el-input>
                                 <el-select 
@@ -61,7 +61,7 @@
                                 :class="{'red-b': item.unchecked}"
                                 @blur="selectValid(item, index)"
                                 @change="eventChange(item, index)"
-                                style="width:300px"
+                                style="width:80%;"
                                 >
                                     <el-option
                                     v-for="(eItem,eIndex) in eventSelect"
@@ -72,7 +72,7 @@
                                     </el-option>
                                 </el-select>
                                 <span v-show="item.unchecked" style="color: red; font-size: 12px;">触发事件不能为空</span>
-                                <span v-show="item.repChecked" style="color: red; font-size: 12px;">名称重复，请重新输入</span>
+                                <span v-show="item.repChecked" style="color: red; font-size: 12px;">触发事件重复，请重新选择</span>
                             </el-form-item>
                         </el-col>
                     </el-form>

src/views/user-path/funnel-data.vue

@@ -205,49 +205,49 @@ export default {
                 arrowTop = 105;
                 arrowH = 130;
                 lineTop = 50;
-                lineLeft = 250;
+                lineLeft = '4%';
                 lineHeight = 306;
             }else if(len == 3) {
                 blackH = 300;
                 arrowTop = 115;
                 arrowH = 130;
                 lineTop = 30;
-                lineLeft = 450;
+                lineLeft = '30%';
                 lineHeight = 306;
             }else if(len == 4) {
                 blackH = 300;
                 arrowTop = 88;
                 arrowH = 210;
                 lineTop = 30;
-                lineLeft = 550;
+                lineLeft = '45%';
                 lineHeight = 306;
             }else if(len == 5) {
                 blackH = 300;
                 arrowTop = 70;
                 arrowH = 260;
                 lineTop = 20;
-                lineLeft = 570;
+                lineLeft = '42%';
                 lineHeight = 346;
             }else if(len == 6) {
                 blackH = 300;
                 arrowTop = 60;
                 arrowH = 300;
                 lineTop = 20;
-                lineLeft = 570;
+                lineLeft = '40%';
                 lineHeight = 366;
             }else if(len == 7) {
                 blackH = 360;
                 arrowTop = 60;
                 arrowH = 390;
                 lineTop = 20;
-                lineLeft = 570;
+                lineLeft = '35%';
                 lineHeight = 456;
             }else {
                 blackH = 330;
                 arrowTop = 50;
                 arrowH = 390;
                 lineTop = 10;
-                lineLeft = 590;
+                lineLeft = '35%';
                 lineHeight = 466;
             }
             for (let i = 0; i < lineargroup.length; i++) {