laisiao/src/DRP/HDrpManagement/priceAdjustment/detail/modules/priceAssistant.vue

<template>
  <div>
    <a-button type="primary" @click="showDrawer">调价助手</a-button>
    <a-modal
      v-model:open="visible"
      class="custom-class"
      title="调价助手"
      placement="right"
      :closable="false"
    >
      <a-form ref="formRef" :model="form" layout="vertical">
        <a-row :gutter="16">
          <a-col :span="24">
            <a-form-item label="调价方式">
              <a-radio-group v-model:value="form.manner" name="radioGroup">
                <a-radio :value="1">按金额</a-radio>
                <a-radio :value="0">按百分比</a-radio>
              </a-radio-group>
            </a-form-item>
          </a-col>
          <a-col :span="24">
            <a-form-item label="调价规则">
              <a-radio-group v-model:value="form.cardinality" name="radioGroup">
                <a-radio :value="1">上浮</a-radio>
                <a-radio :value="0">下调</a-radio>
              </a-radio-group>
            </a-form-item>
          </a-col>
          <a-col :span="12">
            <a-form-item label="调整量">
              <a-input :suffix="form.manner == 1?'RMB':'%'" v-model:value="form.coefficient" placeholder="输入调整量"></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="24" v-if="form.manner == 0">
            <a-slider v-model:value="form.coefficient" :min="-100" :max="100" :step="10" :tipFormatter="tipFormatter" @change="sliderChange">
            </a-slider>
          </a-col>
        </a-row>
      </a-form>
      <template #footer>
        <a-space>
          <a-button @click="onClose">关闭</a-button>
          <a-button @click="reloadPrice">重置单据价格</a-button>
          <a-button type="primary" @click="submit">保存</a-button>
        </a-space>
      </template>
    </a-modal>
  </div>
</template>

<script setup>
import {ref,defineProps,defineEmits} from 'vue'
import { message } from 'ant-design-vue';

import Api from '@/api/api'
import utils from '@/utils/utils'
const props = defineProps(['id'])
const emit = defineEmits(['onSuccess'])
const visible = ref(false)
const form = ref({
  sa_itempriceadjustid:props.id,
  manner:1,
  cardinality:1,
  coefficient:0
})
const showDrawer = ()=>{
  visible.value = true
}
const formRef = ref()
const onClose = () => {
  visible.value = false;
  formRef.value.resetFields();
};
const reloadPrice = async ()=>{
   const res = await Api.post({
    "id":202212003011904,
    "content":{
      "sa_itempriceadjustid":props.id,
    }
  })
  utils.message(res,'重置成功',()=>{
    form.value = {
      sa_itempriceadjustid:props.id,
      manner:1,
      cardinality:1,
      coefficient:0
    }
    emit('onSuccess')
    onClose()
  })
}
const submit = async ()=>{
  try {
    // const values = await formRef.value.validateFields();
    const res = await Api.requested({
      id:20221027095504,
      content:form.value
    })
    utils.message(res,'调整成功',()=>{
      emit('onSuccess')
      onClose()
    })
  } catch (errorInfo) {
    console.log('Failed:', errorInfo);
  }
}
const tipFormatter = (val)=>{
  if (val > 0)
    return '上浮' + val + '%'
  if(val == 0)
    return '正常价格'
  if (val < 0)
    return '下调' + val + '%'
}
const sliderChange = (val)=>{
  if (val > 0) {
    form.value.cardinality = 1
  } else {
    form.value.cardinality = 0
  }
}
</script>
<style>
</style>