tj

src/views/appoint/components/saleContract/addTransportPrice.vue

@@ -8,34 +8,16 @@
       </div>
       <div id="liulan">
           <el-button type="primary" class="btn" @click="oilPriceFormulaClick">浏览</el-button>
-          <el-button type="primary" class="btn1" @click="ondrawerOut">选择</el-button>
+          <el-button type="primary" class="btn1" @click="ondrawerOut">浏览</el-button>
           <!-- <el-button type="primary" class="btn1" @click="addressClick">浏览</el-button> -->
       </div>
     </div>
     <div class="elForm">
       <el-form :inline="true" class="demo-form-inline" label-width="80px">
-        <el-form-item label="所属承运商">
-          <el-autocomplete
-            class="inline-input"
-            v-model="state"
-            :fetch-suggestions="querySearch"
-            placeholder="请输入承运商名称"
-            :trigger-on-focus="false"
-            @select="handleSelect"
-          >
-            <template slot-scope="{ item }">
-              <div class="name" v-if="item.carrierName">
-                {{ item.carrierName }}
-              </div>
-            </template>
-          </el-autocomplete>
-        </el-form-item>
+        <el-button type="primary" id="cysbutton" @click="ondrawerOutcys">浏览所属承运商</el-button>
       </el-form>
     </div>
-    <div class="button_box">
-      <el-button @click="cancel">取消</el-button>
-      <el-button type="primary" @click="makeSure">确定</el-button>
-    </div>
+
     <!-- 油价联动公式模态框 -->
     <el-drawer
       title="请选择油价联动公式"
@@ -107,6 +89,80 @@
       </div>
     </el-dialog>
 
+    <!-- 承运商模态框 -->
+    <el-drawer
+      title="选择承运商"
+      :visible.sync="drawer"
+      direction="rtl"
+      size="40%"
+      :show-close="false"
+    >
+      <el-input
+        placeholder="请输入内容"
+        v-model="index"
+        style="margin-top: 10px; margin-left: 20px;width:250px"
+        clearable
+      >
+      </el-input
+      ><el-button
+      type="primary"
+      class="btn"
+      @click="onclickCarrier"
+      style="margin-left: 4px;"
+    >
+      <i class="el-icon-search"></i>查询
+    </el-button>
+      <!-- <el-button @click="open">取消</el-button> -->
+      <el-button type="primary" @click="selectMakeSure">确定</el-button>
+      <div class="tablecls">
+        <!-- 查询所有的承运商 -->
+        <dilTable
+          v-bind.sync="carrier"
+          @selection-change="currentRadioChangecys"
+          :drawer="drawer"
+        >
+        </dilTable>
+      </div>
+    </el-drawer>
+
+    <!--  所属承运商表格  -->
+    <div class="selectionTable from">
+      <el-table
+        :data="selectionList"
+        border
+        style="width: 100%"
+        highlight-current-row
+      >
+        <el-table-column type="index" label="序号" width="50">
+        </el-table-column>
+        <el-table-column
+          v-for="(item, i) in tableTop"
+          :key="i"
+          :prop="item.prop"
+          :label="item.label"
+          :width="item.width"
+          align="center"
+          show-overflow-tooltip
+        >
+        </el-table-column>
+        <!-- 操作列 -->
+        <el-table-column fixed="right" label="操作" width="100">
+          <template slot-scope="scope">
+            <el-button
+              @click="deleteRow(scope.$index)"
+              type="text"
+              icon="el-icon-close"
+              size="big"
+            ></el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+
+    <div class="button_box">
+      <el-button @click="cancel">取消</el-button>
+      <el-button type="primary" @click="makeSure">确定</el-button>
+    </div>
   </div>
 </template>
 
@@ -117,6 +173,22 @@ export default {
   components: { PageTitle },
   data() {
     return {
+      carrierIdArray:[],
+      tableTop: [
+        {
+          prop: "carrierName",
+          label: "承运商"
+        }
+      ],
+      selectionList: [],
+      carrierTypes:[],
+      carrier: {
+        requestUrl: "",
+        selectionType: "select"
+      },
+      //是否显示承运商模态框
+      drawer: false,
+      index: "",
       //具体收货地址
       place:null,
       //承运商名称
@@ -211,6 +283,40 @@ export default {
     this.getAllProvince();
   },
   methods: {
+    //点击删除按钮删除当前点击的对象
+    deleteRow(index) {
+      this.selectionList.splice(index, 1);
+    },
+    ondrawerOutcys(){
+      this.carrier.requestUrl =
+        "/api/v1/uc/getCarrierListByLike?apiId=412&i=" + new Date();
+      this.drawer = true;
+    },
+    currentRadioChangecys(selection) {
+      this.carrierTypes=[];
+      for (let i = 0; i < selection.length; i++) {
+        if (this.carrierTypes.indexOf(selection[i]) === -1) {
+          this.carrierTypes.push(selection[i]);
+        }
+      }
+      console.log("this.carrierTypes "+JSON.stringify(this.carrierTypes));
+    },
+    //承运商确定按钮
+    selectMakeSure() {
+      for (let i = 0; i < this.carrierTypes.length; i++) {
+          this.selectionList.push(this.carrierTypes[i])
+      }
+      this.index = null;
+      this.drawer = false;
+    },
+    //模糊查询承运商
+    onclickCarrier() {
+      this.carrier.requestUrl =
+        "/api/v1/uc/getCarrierListByLike?apiId=412&index=" +
+        this.index +
+        "&i=" +
+        new Date();
+    },
     func(res){
         this.selectLineLoading = false;
         this.isKuang = false;
@@ -373,9 +479,12 @@ export default {
       }
     },
     makeSure() {
+      for (let i = 0; i < this.selectionList.length; i++) {
+        this.carrierIdArray.push(this.selectionList[i].carrierId)
+      }
       let mapValue={
         shipperId : this.form1.shipperId,
-        carrierId : this.carrierIds,
+        carrierId : this.carrierIdArray,
         cargonameId : this.oilPriceFormulaId,
         capacityTypeId : this.form1.capacityTypeId,
         priceValue : this.form1.priceValue,