yos_web/src/SDrpManagement/salerOrder/modules/add.vue

<template>
  <div>
    <!-- <el-dropdown size="small" split-button type="primary" @command="handleCommand">
      新 建
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item command="标准订单">标准订单</el-dropdown-item>
       <el-dropdown-item command="特殊订单">特殊订单</el-dropdown-item>
        <el-dropdown-item command="项目订单">项目订单</el-dropdown-item>
       <el-dropdown-item command="促销订单">促销订单</el-dropdown-item>
        <el-dropdown-item command="工具订单">工具订单</el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown> -->
    <el-dropdown @command="handleCommand">
      <el-button type="primary" size="small">
        新 建<i class="el-icon-arrow-down el-icon--right" ></i>
      </el-button>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item command="标准订单">标准订单</el-dropdown-item>
<!--        <el-dropdown-item command="特殊订单">特殊订单</el-dropdown-item>-->
        <el-dropdown-item command="项目订单">项目订单</el-dropdown-item>
<!--        <el-dropdown-item command="促销订单">促销订单</el-dropdown-item>-->
        <el-dropdown-item command="工具订单">工具订单</el-dropdown-item>
        <!-- <el-dropdown-item command="样品订单" v-if="siteId=='HY'">样品订单</el-dropdown-item> -->
      </el-dropdown-menu>
    </el-dropdown>
    <el-drawer
      title="新建订单"
      :visible.sync="drawer"
      direction="rtl"
      :show-close="false"
      append-to-body
      size="800px"
      @close="refresh">
      <div class="drawer__panel">
        <el-row :gutter="15">
          <el-form size="small" ref="form" :model="form" :rules="rules" label-width="110px" :status-icon="false">
            <el-col :span="24">
              <el-form-item label="订单类型" prop="type">
                <el-input readonly v-model="form.type" placeholder="订单类型" :maxlength="11" clearable :style="{width: '100%'}"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="form.type==='工具订单'?24:12" v-if="form.type !== '项目订单'">
              <el-form-item label="选择经销商" prop="sys_enterpriseid">
                <agent ref="enterprise" ismanage="0" @rowClick="rowClick"></agent>
              </el-form-item>
            </el-col>
            <el-col v-if="form.type === '促销订单'" :span="12">
              <el-form-item label="活动信息" prop="promname">
                <el-popover
                  placement="bottom"
                  trigger="click"
                  v-model="visible1">
                  <orderCanUseActivity ref="activity" @rowClick="activityClick"></orderCanUseActivity>
                  <el-input readonly v-model="form.promname" slot="reference" placeholder="选择活动"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col v-if="form.type === '项目订单'" :span="12">
              <el-form-item label="项目合同" prop="contractname">
                <el-popover
                  placement="bottom"
                  trigger="click"
                  v-model="visible">
                  <orderCanUseContract ref="contract" @listCreate="listCreate" ismanage="0" @rowClick="contractClick"></orderCanUseContract>
                  <el-input readonly v-model="form.contractname" slot="reference" placeholder="选择合同"></el-input>
                </el-popover>
              </el-form-item>
            </el-col>
            <el-col v-if="form.type === '特殊订单'" :span="12">
              <el-form-item label="特殊订单分类" prop="typemx">
                <el-select v-model="form.typemx" placeholder="请选择特殊订单分类" clearable :style="{width: '100%'}">
                  <el-option v-for="(item, index) in typemxlist" :key="index" :label="item.value"
                    :value="item.value"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="form.type !=='工具订单' && form.type !=='项目订单'">
              <el-form-item label="选择品牌" prop="sa_brandid">
                <el-select :disabled="form.type==='促销订单'" v-model="form.sa_brandid" placeholder="请选择选择品牌" clearable :style="{width: '100%'}">
                  <el-option v-for="(item, index) in sa_brandidOptions" :key="index" :label="item.brandname"
                    :value="item.sa_brandid" :disabled="item.disabled"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12"  v-if="form.type !=='工具订单' && form.type !=='项目订单'">
              <el-form-item label="选择领域" prop="tradefield">
                <el-select :disabled="form.type==='促销订单'" v-model="form.tradefield" placeholder="请选择选择领域" clearable :style="{width: '100%'}">
                  <el-option v-for="(item, index) in tradefieldOptions" :key="index" :label="item.tradefield"
                    :value="item.tradefield" @click.native="setChildField(item)"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12"  v-if="form.type !=='工具订单' && form.type !=='项目订单'">
              <el-form-item label="领域明细">
                <el-select v-model="form.tradefieldmx" placeholder="请选择领域明细" clearable :style="{width: '100%'}">
                  <el-option v-for="(item, index) in childField" :key="index" :label="item"
                    :value="item"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12" v-if="form.type =='标准订单' || form.type =='项目订单'">
              <el-form-item label="是否样品订单" prop="typemx">
                <el-radio-group v-model="form.typemx">
                  <el-radio label="样品">是</el-radio>
                  <el-radio label="">否</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="24"  v-if="form.type ==='标准订单' || form.type ==='特殊订单' || form.type ==='样品订单'">
              <el-form-item label="项目备注">
                <el-input size="mini" class="order__note__input" type="textarea" v-model="form.projectnote" :autosize="{minRows:5}" placeholder="请输入项目备注"></el-input>
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
      </div>
      <div class="fixed__btn__panel">
        <el-button class="normal-btn-width" type="primary" size="small" @click="submitForm">创 建</el-button>
        <el-button class="normal-btn-width" size="small" @click="resetForm">重 置</el-button>
      </div>
    </el-drawer>
  </div>
</template>

<script>
import agent from '@/template/orderAddCanUseAgent/index.vue'
import enterprise from '@/template/orderAddCanUseEnterprise/index.vue'

import orderCanUseContract from '@/template/orderCanUseContract/index.vue'
import orderCanUseActivity from '@/template/orderCanUseActivity/index.vue'

export default {
  data () {
    return {
      drawer:false,
      visible:false,
      visible1:false,
      siteId:JSON.parse(sessionStorage.getItem('active_account')).siteid,
      form:{
        "sa_orderid": 0,
        "sys_enterpriseid": 0, //订货企业id，可不传，默认取当前账号的
        "sa_accountclassid": 0, //营销账户类型ID
        "sa_brandid": "", //品牌ID
        "sa_contractid": 0, //合同ID，标准订单不传
        "sa_projectid": 0, //工程项目表ID，标准订单不传
        "sys_enterprise_financeid": 0, //合作企业财务信息ID（开票信息）
        "sa_logiscompid": 0, //物流公司档案ID
        "rec_contactsid": 0, //合作企业联系人表ID（收货信息）
        "type": "", //订单类型
        "typemx": "", //明细分类，可选
        "remarks": "", //可选
        "tradefield":"",//必选
        "pay_enterpriseid": 0, //结算单位
        "rebate_used":0,//默认0，是否使用返利金
        "billdate":"",//单据日期，默认创建日期
        "signbacknum":"",
        "promname":"",
        "contractname":''
      },
      rules: {
        sa_brandid: [{
          required: true,
          message: '请选择选择品牌',
          trigger: 'change'
        }],
        tradefield: [{
          required: true,
          message: '请选择选择领域',
          trigger: 'change'
        }],
        sys_enterpriseid:[{
          required: true,
          message: '订货经销商不能为空',
          trigger: 'blur'
        }],
        sa_contractid:[{
          required: true,
          message: '项目不能为空',
          trigger: 'blur'
        }],
        promname:[{
          required: true,
          message: '活动不能为空',
          trigger: 'blur'
        }],
        contractname:[{
          required: true,
          message: '请选择合同',
          trigger: 'change'
        }],
      },
      sa_brandidOptions: [],
      tradefieldOptions: [],
      typemxlist:[],
      childField:[]
    }
  },
  components:{
    agent,
    enterprise,
    orderCanUseContract,
    orderCanUseActivity
  },
  watch: {
    drawer (val) {
      if (!val) {
        this.refresh()
        this.$refs.form.resetFields()
      }
    }
  },
  methods:{
    async handleCommand (command) {
      this.form.type = command
      if (this.form.type == '特殊订单') {
        this.rules.typemx = [{
          required: true,
          message: '请选择选子分类',
          trigger: 'change'
        }]
      } else {
        delete this.rules.typemx
      }
      this.drawer = true
      this.specordermx()
     
    },
    submitForm() {
      this.$refs['form'].validate(async valid => {
        if (!valid) return
        const res = await this.$api.requested({
          "id":this.form.type ==='项目订单'?20230103141402: 20221108111402,
          "content":this.form
        })
        this.tool.showMessage(res,()=>{
          this.drawer = false
          this.refresh()
          this.$store.dispatch('changeDetailDrawer',true)
          this.$router.push({path:'/saler_orderDetails',query:{id:res.data.sa_orderid,rowindex:res.data.rowindex}})
        })
      })
    },
    async specordermx () {
      const res = await this.$store.dispatch('optiontypeselect','specordermx')
      this.typemxlist = res.data
    },
    resetForm() {
      this.$refs['form'].resetFields()
    },
    async pageData () {
      const res = await this.$api.requested({
        "id": 20220924163702,
        "content": {
          "sys_enterpriseid": this.form.sys_enterpriseid,
        }
      })
      this.sa_brandidOptions = res.data

      const res1 = await this.$api.requested({
        "id": 20230219212802,
        "content": {
          "sys_enterpriseid": this.form.sys_enterpriseid,
        }
      })
      this.tradefieldOptions = res1.data
    },
    rowClick (row) {
      console.log(row)
      this.form.sys_enterpriseid = row.sys_enterpriseid
      this.form.type === '促销订单'?this.$refs['activity'].listData(row.sys_enterpriseid):''
      this.form.type === '促销订单'?this.activityClick({}):''
      this.pageData()
    },
    listCreate (param) {
      param.content.sys_enterpriseid = this.form.sys_enterpriseid
    },
    contractClick (row) {
      this.form.sa_contractid = row.sa_contractid
      this.form.sa_projectid = row.sa_projectid
      this.form.contractname = row.title === ''?'未知':row.title
      this.visible = false
    },
    setChildField (item) {
      console.log(item)
      this.childField = item.subvalues
    },
    activityClick (row) {
      this.form.sa_promotionid = row.sa_promotionid
      this.form.promname = row.promname
      this.form.tradefield = row.tradefield
      this.form.sa_brandid = row.sa_brandid
      if (row.tradefield) {
      let arr = []
        arr = this.tradefieldOptions.filter(e=>{
          if (e.tradefield === row.tradefield) {
            return e
          }
        })
        this.childField = arr[0].subvalues
      }
      this.$refs['form'].validate()
      this.visible1 = false
    },
    refresh () {
      this.form = {
        "sa_orderid": 0,
        "sys_enterpriseid": 0, //订货企业id，可不传，默认取当前账号的
        "sa_accountclassid": 0, //营销账户类型ID
        "sa_brandid": "", //品牌ID
        "sa_contractid": 0, //合同ID，标准订单不传
        "sa_projectid": 0, //工程项目表ID，标准订单不传
        "sys_enterprise_financeid": 0, //合作企业财务信息ID（开票信息）
        "sa_logiscompid": 0, //物流公司档案ID
        "rec_contactsid": 0, //合作企业联系人表ID（收货信息）
        "type": "", //订单类型
        "typemx": "", //明细分类，可选
        "remarks": "", //可选
        "saler_hrid":0,//销售人员hrid,业务员hrid
        "tradefield":"",//必选
        "pay_enterpriseid": 0, //结算单位
        "rebate_used":0,//默认0，是否使用返利金
        "billdate":"",//单据日期，默认创建日期
        "signbacknum":""
      }
      this.visible1 = false
    }
  }
}

</script>
<style>
</style>