|
@@ -0,0 +1,402 @@
|
|
|
+<template>
|
|
|
+ <!-- 添加汽运单价 111-->
|
|
|
+ <div class="addTransportPrice">
|
|
|
+ <page-title>新增</page-title>
|
|
|
+ <div class="form">
|
|
|
+ <div class="form_box">
|
|
|
+ <dil-form :formId="379" v-model="form1" ref="from1"></dil-form>
|
|
|
+ <el-form>
|
|
|
+ <el-form-item label="承运起止地点">
|
|
|
+ <el-select v-model="rangeId" placeholder="请选择承运起止地点">
|
|
|
+ <el-option
|
|
|
+ v-for="item in options"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-button type="primary" class="btnml" @click="materialDrawer">浏览物资</el-button>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div class="liulan">
|
|
|
+ <el-button type="primary" class="btn" @click="oilPriceFormulaClick"
|
|
|
+ >浏览</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div class="rangeStyle"></div>
|
|
|
+ </div>
|
|
|
+ <!-- 物资表格 -->
|
|
|
+ <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>
|
|
|
+ <!-- 油价联动公式模态框 -->
|
|
|
+ <el-drawer
|
|
|
+ title="请选择油价联动公式"
|
|
|
+ :visible.sync="oilPriceFormulaDrawer"
|
|
|
+ :direction="direction"
|
|
|
+ :before-close="handleClose"
|
|
|
+ close-on-press-escape
|
|
|
+ modal
|
|
|
+ wrapperClosable
|
|
|
+ size="40%"
|
|
|
+ >
|
|
|
+ <div class="selectText">
|
|
|
+ <!-- <span></span> -->
|
|
|
+ <el-input v-model="LineText" placeholder="请输入内容"></el-input>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="selectLineClick"
|
|
|
+ :loading="selectLineLoading"
|
|
|
+ ><i class="el-icon-search"></i>查询</el-button
|
|
|
+ >
|
|
|
+ <el-button type="primary" @click="addoilPriceFormula">确定</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="LineTable">
|
|
|
+ <vue-scroll :ops="ops" style="width:100%;height:100%">
|
|
|
+ <dilTable
|
|
|
+ v-bind.sync="oilPriceFormula"
|
|
|
+ @radio-change="currentRadioChange"
|
|
|
+ :isKuang="isKuang"
|
|
|
+ :loading="tableLoading"
|
|
|
+ :drawer="oilPriceFormulaDrawer"
|
|
|
+ @func="func"
|
|
|
+ ></dilTable>
|
|
|
+ </vue-scroll>
|
|
|
+ </div>
|
|
|
+ </el-drawer>
|
|
|
+ <!-- 物资模态框 -->
|
|
|
+ <el-drawer
|
|
|
+ title="请选择物资"
|
|
|
+ :visible.sync="drawerMaterial"
|
|
|
+ :direction="direction"
|
|
|
+ close-on-press-escape
|
|
|
+ modal
|
|
|
+ wrapperClosable
|
|
|
+ size="40%"
|
|
|
+ >
|
|
|
+ <div class="selectText">
|
|
|
+ <el-input v-model="materialText" placeholder="请输入内容"></el-input>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="selectMaterial"
|
|
|
+ :loading="selectLineLoading"
|
|
|
+ ><i class="el-icon-search"></i>查询</el-button
|
|
|
+ >
|
|
|
+ <el-button type="primary" @click="addMaterialList">确定</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="LineTable">
|
|
|
+ <vue-scroll :ops="ops" style="width:100%;height:100%">
|
|
|
+ <dilTable
|
|
|
+ v-bind.sync="materialOptions"
|
|
|
+ @selection-change="selectionChange"
|
|
|
+ :isKuang="isKuang"
|
|
|
+ :loading="tableLoading"
|
|
|
+ :drawer="oilPriceFormulaDrawer"
|
|
|
+ @func="func"
|
|
|
+ ></dilTable>
|
|
|
+ </vue-scroll>
|
|
|
+ </div>
|
|
|
+ </el-drawer>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import PageTitle from "@/components/Page/Title";
|
|
|
+import { sjTime, isNumber } from "@/utils/sharedJsFile";
|
|
|
+export default {
|
|
|
+ components: { PageTitle },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ //物资模态框默认隐藏
|
|
|
+ drawerMaterial:false,
|
|
|
+ //物资查询框
|
|
|
+ materialText:null,
|
|
|
+ selectionList:[],
|
|
|
+ rangeId: null,
|
|
|
+ //是否点击查询
|
|
|
+ isKuang: false,
|
|
|
+ //表格加载状态
|
|
|
+ tableLoading: false,
|
|
|
+ //公式内容
|
|
|
+ formulaString: null,
|
|
|
+ //油价联动公式Id
|
|
|
+ oilPriceFormulaId: null,
|
|
|
+ //是否打开油价联动公式的模态窗口
|
|
|
+ oilPriceFormulaDrawer: false,
|
|
|
+ //油价联动公式查询条件
|
|
|
+ LineText: null,
|
|
|
+ //油价联动公式模态框查询按钮状态
|
|
|
+ selectLineLoading: false,
|
|
|
+ //油价联动公式模态窗口的数据
|
|
|
+ oilPriceFormula: {
|
|
|
+ requestUrl: "",
|
|
|
+ selectionType: "radio"
|
|
|
+ },
|
|
|
+ options: [],
|
|
|
+ newsArr:[],
|
|
|
+ //模态窗口的打开的方向
|
|
|
+ direction: "rtl",
|
|
|
+ materialOptions:{
|
|
|
+ requestUrl:"",
|
|
|
+ selectionType: "select",
|
|
|
+ },
|
|
|
+ //表单数据
|
|
|
+ form1: {
|
|
|
+ priceDate: new Date(),
|
|
|
+ oilTypeId: 10,
|
|
|
+ capacityTypeId: 1
|
|
|
+ },
|
|
|
+ tableTop: [
|
|
|
+ {
|
|
|
+ prop: "materialName",
|
|
|
+ label: "物资名称",
|
|
|
+ }
|
|
|
+ ],
|
|
|
+
|
|
|
+ //提交给后端的数据
|
|
|
+ // map:{},
|
|
|
+ ops: {
|
|
|
+ vuescroll: {},
|
|
|
+ scrollPanel: {},
|
|
|
+ rail: {
|
|
|
+ keepShow: true
|
|
|
+ },
|
|
|
+ bar: {
|
|
|
+ hoverStyle: true,
|
|
|
+ onlyShowBarOnScroll: false, //是否只有滚动的时候才显示滚动条
|
|
|
+ background: "#5f9ea0", //滚动条颜色
|
|
|
+ opacity: 0.8, //滚动条透明度
|
|
|
+ "overflow-x": "hidden"
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.axios.get("/api/v1/uc/getTransRange").then(res => {
|
|
|
+ console.log(res.data.data)
|
|
|
+ this.options = res.data.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ func(res) {
|
|
|
+ this.selectLineLoading = false;
|
|
|
+ this.isKuang = false;
|
|
|
+ this.tableLoading = false;
|
|
|
+ },
|
|
|
+ materialDrawer(){
|
|
|
+ this.drawerMaterial = true
|
|
|
+ this.materialOptions.requestUrl = "/api/v1/uc/queryMaterialByLike?apiId=244&i=" + new Date()
|
|
|
+ },
|
|
|
+ selectMaterial(){
|
|
|
+ if(this.materialText == null){
|
|
|
+ this.materialOptions.requestUrl = "/api/v1/uc/queryMaterialByLike?apiId=244&i=" + new Date()
|
|
|
+ }else{
|
|
|
+ this.materialOptions.requestUrl = "/api/v1/uc/queryMaterialByLike?apiId=244&index=" + this.materialText
|
|
|
+ }
|
|
|
+ },
|
|
|
+ addMaterialList(){
|
|
|
+ this.drawerMaterial = false
|
|
|
+ this.newsArr.forEach((e) => {
|
|
|
+ console.log((e.materialName))
|
|
|
+ var addmap = {
|
|
|
+ materialName:e.materialName,
|
|
|
+ materialId:e.materialId
|
|
|
+ }
|
|
|
+ this.selectionList.push(addmap)
|
|
|
+ })
|
|
|
+ console.log(this.selectionList)
|
|
|
+ this.newsArr = []
|
|
|
+ },
|
|
|
+ //点击删除按钮删除当前点击的对象
|
|
|
+ deleteRow(index){
|
|
|
+ this.selectionList.splice(index,1)
|
|
|
+ },
|
|
|
+ selectionChange(selection){
|
|
|
+ console.log(selection)
|
|
|
+ for (let i = 0; i < selection.length; i++) {
|
|
|
+ if(this.newsArr.indexOf(selection[i]) === -1){
|
|
|
+ this.newsArr.push(selection[i]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ selectLineClick() {
|
|
|
+ this.tableLoading = true;
|
|
|
+ this.selectLineLoading = true;
|
|
|
+ this.isKuang = true;
|
|
|
+ if (this.LineText) {
|
|
|
+ this.oilPriceFormula.requestUrl =
|
|
|
+ "api/v1/uc/getOilFormula?apiId=444&con=" + this.LineText;
|
|
|
+ } else {
|
|
|
+ this.oilPriceFormula.requestUrl =
|
|
|
+ "api/v1/uc/getOilFormula?apiId=444&i=" + new Date();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //选定联动公式确定
|
|
|
+ addoilPriceFormula() {
|
|
|
+ let mapvalue = {
|
|
|
+ shipperId: this.form1.shipperId,
|
|
|
+ oilPriceFormula: this.formulaString,
|
|
|
+ cargonameId: this.oilPriceFormulaId,
|
|
|
+ capacityTypeId: this.form1.capacityTypeId,
|
|
|
+ priceValue: this.form1.priceValue,
|
|
|
+ priceDate: this.form1.priceDate,
|
|
|
+ type: this.form1.type,
|
|
|
+ oilpriceBase: this.form1.oilpriceBase,
|
|
|
+ oilTypeId: this.form1.oilTypeId,
|
|
|
+ oilpriceChangeThreshold: this.form1.oilpriceChangeThreshold
|
|
|
+ };
|
|
|
+ this.form1 = mapvalue;
|
|
|
+ this.oilPriceFormulaDrawer = false;
|
|
|
+ },
|
|
|
+ currentRadioChange(val) {
|
|
|
+ this.formulaString = val.formulaString;
|
|
|
+ this.oilPriceFormulaId = val.formulaId;
|
|
|
+ },
|
|
|
+ //打开线路的模态窗口
|
|
|
+ oilPriceFormulaClick() {
|
|
|
+ this.oilPriceFormulaDrawer = true;
|
|
|
+ this.oilPriceFormula.requestUrl = "/api/v1/uc/getOilFormula?apiId=444";
|
|
|
+ },
|
|
|
+ //模态窗口关闭时调用
|
|
|
+ handleClose() {
|
|
|
+ if (this.oilPriceFormulaDrawer) {
|
|
|
+ this.oilPriceFormulaDrawer = false;
|
|
|
+ this.LineText = null;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ makeSure() {
|
|
|
+ let mapValue = {
|
|
|
+ cargonameId: this.oilPriceFormulaId,
|
|
|
+ capacityTypeId: this.form1.capacityTypeId,
|
|
|
+ priceValue: this.form1.priceValue,
|
|
|
+ priceDate: sjTime(this.form1.priceDate),
|
|
|
+ type: this.form1.type,
|
|
|
+ oilpriceBase: this.form1.oilpriceBase,
|
|
|
+ oilTypeId: this.form1.oilTypeId,
|
|
|
+ oilpriceChangeThreshold: this.form1.oilpriceChangeThreshold,
|
|
|
+ rangeId:this.rangeId,
|
|
|
+ mapList:this.selectionList
|
|
|
+ };
|
|
|
+ this.axios
|
|
|
+ .post("/api/v1/ams/insertInwardPrice", mapValue)
|
|
|
+ .then(res => {
|
|
|
+ if (res.data.code == "200") {
|
|
|
+ this.$router.go(-1);
|
|
|
+ }
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "新增运输单价成功!"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 取消
|
|
|
+ cancel() {
|
|
|
+ this.$router.push("/inwardTransPrice");
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss">
|
|
|
+.elForm {
|
|
|
+ margin-left: 30%;
|
|
|
+}
|
|
|
+.addTransportPrice {
|
|
|
+ .form {
|
|
|
+ display: flex;
|
|
|
+ .form_box {
|
|
|
+ width: 320px;
|
|
|
+ margin-left: 30%;
|
|
|
+ margin-top: 30px;
|
|
|
+ margin-right: 20px;
|
|
|
+ .el-form {
|
|
|
+ .preview-group {
|
|
|
+ .el-form-item {
|
|
|
+ .el-form-item__label {
|
|
|
+ display: inline-block;
|
|
|
+ width: 70px !important;
|
|
|
+ }
|
|
|
+ .el-form-item__content {
|
|
|
+ .el-select {
|
|
|
+ width: 250px;
|
|
|
+ }
|
|
|
+ .el-input {
|
|
|
+ width: 250px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .liulan {
|
|
|
+ width: 120px;
|
|
|
+ margin-top: 30px;
|
|
|
+ .el-button {
|
|
|
+ width: 100px !important;
|
|
|
+ margin: auto;
|
|
|
+ }
|
|
|
+ .btn {
|
|
|
+ margin-top: 54px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .button_box {
|
|
|
+ margin-left: 45%;
|
|
|
+ }
|
|
|
+ .selectText {
|
|
|
+ .el-input {
|
|
|
+ width: 250px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .LineTable {
|
|
|
+ width: 100%;
|
|
|
+ height: 480px;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-top: 10px;
|
|
|
+ }
|
|
|
+ .btnml {
|
|
|
+ width: 250px;
|
|
|
+ margin-left: 50px;
|
|
|
+ }}
|
|
|
+</style>
|
|
|
+<style lang="scss">
|
|
|
+/deep/.__bar-is-vertical {
|
|
|
+ right: -1px !important;
|
|
|
+}
|
|
|
+/deep/.__bar-is-horizontal {
|
|
|
+ display: none !important;
|
|
|
+}
|
|
|
+</style>
|