页面修改

src/components/studyAbroad/studyAbroad-form copy.vue

+<template>
+  <q-dialog v-model="persistent" content-class="bg-grey-1" persistent transition-show="scale" transition-hide="scale">
+    <q-card style="width: 800px;max-width:900px;">
+      <q-card-section>
+        <div class="text-h6">{{objOption.Id==0?'新增留学':'修改留学'}}</div>
+      </q-card-section>
+      <q-card-section class="q-pt-none scroll" style="max-height: 70vh">
+        <div class="text-caption q-mb-lg q-px-md text-grey-6">留学信息</div>
+        <div class="row wrap">
+          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.Name" ref="Name"
+            class="col-6 q-pr-lg q-pb-lg" label="项目名称" :rules="[val => !!val || '项目名称']" />
+          <q-select filled stack-label option-value="Id" option-label="Name" v-model="objOption.SupplierId" ref="Type"
+            :options="supplierList" label="供应编号" :dense="false" class="col-6 q-pb-lg q-pr-lg" emit-value map-options />
+        </div>
+        <div class="row wrap">
+          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.SupplierContract"
+            ref="SupplierContract" class="col-6 q-pr-lg q-pb-lg" label="供应商合同" :rules="[val => !!val || '供应商合同']" />
+          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.CommissionProfits"
+            ref="SupplierContract" class="col-6 q-pr-lg q-pb-lg" label="佣金利润说明" :rules="[val => !!val || '佣金利润说明']" />
+        </div>
+        <div class="row wrap">
+          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.SellPrice" ref="SellPrice"
+            class="col-6 q-pr-lg q-pb-lg" label="卖价"" :rules=" [val=> !!val || '卖价']" />
+            <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.CostPrice" ref="CostPrice"
+              class="col-6 q-pr-lg q-pb-lg" label="直接成本价" :rules="[val => !!val || '直接成本价']" />
+        </div>
+        <div class="row wrap">
+          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.CostInfo" ref="CostInfo"
+            class="col-6 q-pr-lg q-pb-lg" label="成本价包含内容"" :rules=" [val=> !!val || '成本价包含内容']" />
+            <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.B2BCommission"
+              ref="B2BCommission" class="col-6 q-pr-lg q-pb-lg" label="同行返佣" :rules="[val => !!val || '同行返佣']" />
+        </div>
+        <div class="row wrap">
+          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.SaleCommission"
+            ref="SaleCommission" class="col-6 q-pr-lg q-pb-lg" label="销售返佣" :rules="[val => !!val || '销售返佣']" />
+          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.OfferPrice" ref="OfferPrice"
+            class="col-6 q-pr-lg q-pb-lg" label="校企报价" :rules="[val => !!val || '校企报价']" />
+        </div>
+        <div class="row wrap">
+          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.OfferCommission"
+            ref="OfferCommission" class="col-6 q-pr-lg q-pb-lg" label="校企返佣金额" :rules="[val => !!val || '校企返佣金额']" />
+        </div>
+        <div class="row wrap">
+          <q-input filled stack-label :dense="false" v-model="objOption.Remark" style="margin-top: 20px" type="textarea"
+            class="col-12" label="备注" />
+        </div>
+
+      </q-card-section>
+      <q-separator />
+      <q-card-actions align="right" class="bg-white">
+        <q-btn label="取消" flat color="grey-10" style="font-weight:400 !important" @click="closeSaveForm" />
+        <q-btn label="立即提交" color="accent q-px-md" style="font-weight:400 !important" :loading="saveLoading"
+          @click="saveStudyInfo" />
+      </q-card-actions>
+    </q-card>
+  </q-dialog>
+</template>
+<script>
+  import {
+    saveStudyAbroad,
+    queryStudyAbroadInfo,
+    querySupplierList
+  } from '../../api/studyabroad/index'
+  export default {
+    props: {
+      saveObj: {
+        type: Object,
+        default: null
+      }
+    },
+    data() {
+      return {
+        persistent: true,
+        objOption: {
+          Id: 0,
+          Type: 1, //1留学 2就业
+          Name: '', //项目名称
+          SupplierId: 0, //供应商编号
+          SupplierContract: '', //供应商合同
+          CommissionProfits: '', //佣金利润说明
+          SellPrice: '', //卖价
+          CostPrice: '', //直接成本价
+          CostInfo: '', //成本价包含内容
+          B2BCommission: '', //同行返佣
+          B2BCommissionType: 0, //同行返佣类型
+          SaleCommission:'', //销售返佣
+          SaleCommissionType: 0, //销售返佣类型
+          OfferPrice: '', //校企报价
+          OfferCommissionType: 0, //校企报价返佣类型
+          OfferCommission: '', //校企返佣金额
+          Remark: '', //备注
+          SaleState: 0 //销售状态(0-待完善，1-上架审核中，2-上架)
+        },
+        optionTitle: "",
+        saveLoading: false,
+        supplierList: [], //供应商下拉数据
+      }
+    },
+    mounted() {
+      this.getStudyAbroadList();
+      this.initObj()
+    },
+    methods: {
+      //初始化表单
+      initObj() {
+        if (this.saveObj && this.saveObj.Id > 0) {
+          queryStudyAbroadInfo({
+            Id: this.saveObj.Id
+          }).then(res => {
+            if (res.Code == 1) {
+              var tempObj = res.Data;
+              if (tempObj) {
+                this.objOption.Id = tempObj.Id;
+                this.objOption.Type = tempObj.Type;
+                this.objOption.Name = tempObj.Name;
+                this.objOption.SupplierId = tempObj.SupplierId;
+                this.objOption.SupplierContract = tempObj.SupplierContract;
+                this.objOption.CommissionProfits = tempObj.CommissionProfits;
+                this.objOption.SellPrice = tempObj.SellPrice;
+                this.objOption.CostPrice = tempObj.CostPrice;
+                this.objOption.CostInfo = tempObj.CostInfo;
+                this.objOption.B2BCommission = tempObj.B2BCommission;
+                this.objOption.B2BCommissionType = tempObj.B2BCommissionType;
+                this.objOption.SaleCommission = tempObj.SaleCommission;
+                this.objOption.SaleCommissionType = tempObj.SaleCommissionType;
+                this.objOption.OfferPrice = tempObj.OfferPrice;
+                this.objOption.OfferCommissionType = tempObj.OfferCommissionType;
+                this.objOption.OfferCommission = tempObj.OfferCommission;
+                this.objOption.Remark = tempObj.Remark;
+                this.objOption.SaleState = tempObj.SaleState;
+              }
+            }
+          })
+        } else {
+          this.objOption.Id = 0;
+          this.objOption.Type = 1;
+          this.objOption.Name = '';
+          this.objOption.SupplierId = 0;
+          this.objOption.SupplierContract = '';
+          this.objOption.CommissionProfits = '';
+          this.objOption.SellPrice = '';
+          this.objOption.CostPrice = '';
+          this.objOption.CostInfo = '';
+          this.objOption.B2BCommission = '';
+          this.objOption.B2BCommissionType = 0;
+          this.objOption.SaleCommission = '';
+          this.objOption.SaleCommissionType = 0;
+          this.objOption.OfferPrice = '';
+          this.objOption.OfferCommissionType = 0;
+          this.objOption.OfferCommission = '';
+          this.objOption.Remark = '';
+          this.objOption.SaleState = 0;
+        }
+      },
+      //关闭弹窗
+      closeSaveForm() {
+        this.$emit('close')
+        this.persistent = false
+      },
+      //保存菜单
+      saveStudyInfo() {
+        this.saveLoading = true;
+        saveStudyAbroad(this.objOption).then(res => {
+          this.saveLoading = false
+          this.$q.notify({
+            icon: 'iconfont icon-chenggong',
+            color: 'accent',
+            timeout: 2000,
+            message: '数据保存成功！',
+            position: 'top'
+          })
+          this.$emit("success");
+          this.closeSaveForm();
+        })
+      },
+      //获取下拉框数据
+      getStudyAbroadList() {
+        querySupplierList({}).then(res => {
+          if (res.Code == 1) {
+            this.supplierList = res.Data;
+            let obj = {
+              Id: 0,
+              Name: '请选择'
+            }
+            this.supplierList.unshift(obj);
+          }
+        })
+      }
+    }
+  }
+
+</script>

src/components/studyAbroad/studyAbroad-form.vue

@@ -10,33 +10,11 @@
           <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.Name" ref="Name"
             class="col-6 q-pr-lg q-pb-lg" label="项目名称" :rules="[val => !!val || '项目名称']" />
           <q-select filled stack-label option-value="Id" option-label="Name" v-model="objOption.SupplierId" ref="Type"
-            :options="supplierList" label="供应编号" :dense="false" class="col-6 q-pb-lg q-pr-lg" emit-value map-options />
+            :options="supplierList" label="供应商" :dense="false" class="col-6 q-pb-lg q-pr-lg" emit-value map-options />
         </div>
         <div class="row wrap">
-          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.SupplierContract"
-            ref="SupplierContract" class="col-6 q-pr-lg q-pb-lg" label="供应商合同" :rules="[val => !!val || '供应商合同']" />
-          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.CommissionProfits"
-            ref="SupplierContract" class="col-6 q-pr-lg q-pb-lg" label="佣金利润说明" :rules="[val => !!val || '佣金利润说明']" />
-        </div>
-        <div class="row wrap">
-          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.SellPrice" ref="SellPrice"
-            class="col-6 q-pr-lg q-pb-lg" label="卖价"" :rules=" [val=> !!val || '卖价']" />
-            <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.CostPrice" ref="CostPrice"
-              class="col-6 q-pr-lg q-pb-lg" label="直接成本价" :rules="[val => !!val || '直接成本价']" />
-        </div>
-        <div class="row wrap">
-          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.CostInfo" ref="CostInfo"
-            class="col-6 q-pr-lg q-pb-lg" label="成本价包含内容"" :rules=" [val=> !!val || '成本价包含内容']" />
-            <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.B2BCommission"
-              ref="B2BCommission" class="col-6 q-pr-lg q-pb-lg" label="同行返佣" :rules="[val => !!val || '同行返佣']" />
-        </div>
-        <div class="row wrap">
-          <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.SaleCommission"
-            ref="SaleCommission" class="col-6 q-pr-lg q-pb-lg" label="销售返佣" :rules="[val => !!val || '销售返佣']" />
           <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.OfferPrice" ref="OfferPrice"
             class="col-6 q-pr-lg q-pb-lg" label="校企报价" :rules="[val => !!val || '校企报价']" />
-        </div>
-        <div class="row wrap">
           <q-input filled stack-label maxlength="30" :dense="false" v-model="objOption.OfferCommission"
             ref="OfferCommission" class="col-6 q-pr-lg q-pb-lg" label="校企返佣金额" :rules="[val => !!val || '校企返佣金额']" />
         </div>
@@ -83,7 +61,7 @@
           CostInfo: '', //成本价包含内容
           B2BCommission: '', //同行返佣
           B2BCommissionType: 0, //同行返佣类型
-          SaleCommission:'', //销售返佣
+          SaleCommission: '', //销售返佣
           SaleCommissionType: 0, //销售返佣类型
           OfferPrice: '', //校企报价
           OfferCommissionType: 0, //校企报价返佣类型