123

gongjinbao

2025-01-08 2476a53d6a126723cc0526b2bf46295bb220b3c3

123

 package.json

@@ -19,7 +19,9 @@
    "qs": "^6.11.2",
    "vue": "^2.6.10",
    "vue-cookies": "^1.8.3",
    "vue-quill-editor": "^3.0.6",
    "vue-router": "^3.6.5",
    "vue-ueditor-wrap": "^2.5.6",
    "vuex-persistedstate": "^4.1.0"
  },
  "devDependencies": {

 src/view/addOrder.vue

@@ -9,7 +9,7 @@
        </div>
        <div class="box-cards">
          <div class="flex">
            

            <el-form-item label="" class="label1" prop="container" label-width="0">
              <div class="flex">
                <div class="box">
@@ -105,7 +105,10 @@
                  </div>
                  <div class="box_text2">ETA</div>
                </div>
                <el-date-picker type="date" placeholder="选择日期" v-model="form.ETA" style="width: 100%"></el-date-picker>
                <el-date-picker type="date" suffix-icon="el-icon-date" placeholder="选择日期" v-model="form.ETA"
                  style="width: 100%">
                  <div></div>
                </el-date-picker>
              </div>
            </el-form-item>
          </div>
@@ -236,7 +239,7 @@
                <el-input v-model="form.QTY" placeholder="请输入"></el-input>
              </div>
            </el-form-item>
            <el-form-item label="" class="label4" prop="ETA" label-width="0">
            <el-form-item label="" class="label4" prop="QTYUnit" label-width="0">
              <div class="flex">
                <div class="box2">
                  <div class="flex">
@@ -245,7 +248,7 @@
                  </div>
                  <div class="box_text2">QTY Unit</div>
                </div>
                <el-select v-model="form.carrier" clearable placeholder="请选择">
                <el-select v-model="form.QTYUnit" clearable placeholder="请选择">
                  <el-option :label="item.label" :value="item.value" v-for="item in optionsUs"
                    :key="item.value"></el-option>
                </el-select>
@@ -262,7 +265,9 @@
                  </div>
                  <div class="box_text2">Weight</div>
                </div>
                <el-input v-model="form.weight" placeholder="请输入"></el-input>
                <el-input v-model="form.weight" placeholder="请输入">
                  <div style="line-height: 50px;" slot="prefix-icon">KG</div>
                </el-input>
              </div>
            </el-form-item>

@@ -275,7 +280,9 @@
                  </div>
                  <div class="box_text2">≈Pound weight</div>
                </div>
                <el-input v-model="form.poundWeight" placeholder="请输入"></el-input>
                <el-input v-model="form.poundWeight" placeholder="请输入">
                  <div style="line-height: 50px;" slot="suffix">LBS</div>
                </el-input>
              </div>
            </el-form-item>
            <el-form-item label="" class="label3" prop="volume" label-width="0px">
@@ -287,7 +294,9 @@
                  </div>
                  <div class="box_text2">Voume</div>
                </div>
                <el-input v-model="form.volume" placeholder="请输入"></el-input>
                <el-input v-model="form.volume" placeholder="请输入">
                  <div style="line-height: 50px;" slot="suffix">CMB</div>
                </el-input>
              </div>
            </el-form-item>
          </div>
@@ -383,8 +392,8 @@
                  <span>联系电话和邮箱至少填写其中一项</span>
                </div>
              </div>
              <div class="tip_box">
                <el-form-item label="" class="label5" prop="email" label-width="0px">
              <div class="tip_box label5">
                <el-form-item label="" class="" prop="email" label-width="0px">
                  <div class="flex">
                    <div class="box1">
                      <div class="flex">
@@ -402,7 +411,42 @@
                </div>
              </div>
            </div>

          </div>
         
            <el-form-item label="" class="label5 mt-43" prop="specialRequest" label-width="0px">
            <div class="flex">
              <div class="box10">
                <div class="flex">
                  <!-- <div class="red">*</div> -->
                  <div class="box_text1">其他联系方式：</div>
                </div>
                <div class="box_text3">Other Information</div>
              </div>
              <quill-editor class="ql-editor" v-model="content" ref="myQuillEditor" :options="editorOption"
                @blur="onEditorBlur($event)" @focus="onEditorFocus($event)" @change="onEditorChange($event)">
              </quill-editor>

            </div>
            </el-form-item>
       

      
            <el-form-item label="" class="label5 mt-43" prop="remark" label-width="0px">
            <div class="flex">
              <div class="box10">
                <div class="flex">
                  <!-- <div class="red">*</div> -->
                  <div class="box_text1">备注：</div>
                </div>
                <div class="box_text3">Remark</div>
              </div>
              <quill-editor class="ql-editor" style="height: 243px;"  v-model="content" ref="myQuillEditor" :options="editorOption"
                @blur="onEditorBlur($event)" @focus="onEditorFocus($event)" @change="onEditorChange($event)">
              </quill-editor>
            </div>
            </el-form-item>
         
        </div>
      </el-card>
      <el-card class="box-card mt-13">
@@ -456,7 +500,19 @@
</template>

<script>
import { addOrder } from './addservier'
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'

import { quillEditor, Quill } from 'vue-quill-editor' //引入插件



export default {
  components: {
    quillEditor
  },
  data() {
    return {
      form: {
@@ -489,7 +545,31 @@
        DOFileUrl: '',//DO附件
        PODFileUrls: '',//POD附件
        otherFileUrls: '',//其他附件
        specialRequest: '',//特殊要求
        remark: '',//备注
      },
      editorOption: {
        modules: {
          toolbar: [
            ["bold", "italic", "underline", "strike"], //加粗，斜体，下划线，删除线
            ["blockquote", "code-block"], //引用，代码块
            [{ header: 1 }, { header: 2 }], // 标题，键值对的形式；1、2表示字体大小
            [{ list: "ordered" }, { list: "bullet" }], //列表
            [{ script: "sub" }, { script: "super" }], // 上下标
            [{ indent: "-1" }, { indent: "+1" }], // 缩进
            [{ direction: "rtl" }], // 文本方向
            [{ size: ["small", false, "large", "huge"] }], // 字体大小
            [{ header: [1, 2, 3, 4, 5, 6, false] }], //几级标题
            [{ color: [] }, { background: [] }], // 字体颜色，字体背景颜色
            [{ font: [] }], //字体
            [{ align: [] }], //对齐方式
            ["clean"], //清除字体样式
            ["image", "video"], //上传图片、上传视频
          ],
          },
        },
    

      // 导入参数
      upload: {
        // 是否显示弹出层
@@ -628,8 +708,25 @@
    };
  },
  methods: {
    onEditorBlur(quill) {
      console.log("editor blur!", quill);
    },
    onEditorFocus(quill) {
      console.log("editor focus!", quill);
    },
    onEditorReady(quill) {
      console.log("editor ready!", quill);
    },
    onEditorChange({ quill, html, text }) {
      console.log("editor change!", quill, html, text);
      this.content = html;
    },


    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        console.log(valid, '----');

        if (valid) {
          alert("submit!");
        } else {
@@ -728,7 +825,9 @@
  align-items: center;
  justify-content: center;
}

.ql-editor{
  // height: 243px;
}
.mr-14 {
  margin-right: 14px;
}
@@ -877,9 +976,14 @@
  }
}

::v-deep .label5,
.el-form-item {
  margin-bottom: 11px !important;
.label5 {
  ::v-deep .el-form-item {
    margin-bottom: 11px !important;
  }
}

.mt-43 {
  margin-top: 43px;
}

.box1 {
@@ -977,6 +1081,16 @@
  flex-shrink: 0;
}

.box10 {
  width: 120px;
  display: flex;
  flex-direction: column;
  line-height: 23px !important;
  align-items: flex-end;
  font-weight: 500;
  flex-shrink: 0;
}

.box_text1 {
  font-weight: 500;
  font-size: 16px;
@@ -992,6 +1106,14 @@
  margin-right: 14px;
}

.box_text3 {
  font-weight: 500;
  font-size: 12px;
  color: rgba(59, 63, 86, 0.8);
  line-height: 24px;
  margin-right: 14px;
}

.red {
  color: red;
}

 src/view/addservier.js

New file
@@ -0,0 +1,6 @@
import axios from "@/utils/request";

//添加订单
export const addOrder = (data) => {
  return axios.post("/zj0FFk5wx4S05X-zksG9xBd0i00XB-1", data);
};