123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145 |
- <template>
- <a-modal
- :footer="null"
- :title="title"
- centered
- :maskClosable="false"
- :zIndex="5000"
- @cancel="cancle"
- v-model="isShow">
- <a-form :form="form">
- <a-form-item label="原价" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
- <a-input-number
- style="width: 90%;"
- :min=0
- :precision="2"
- v-decorator="[
- 'formValidate.itemSrcPrice',
- { initialValue: formValidate.itemSrcPrice,
- rules: [{ required: true, type: 'number', message: '请输入原价', trigger: 'change' }] },
- ]">
- </a-input-number >
- 元
- </a-form-item>
- <a-form-item label="数量" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
- <a-input-number
- style="width: 90%;"
- :precision="0"
- :min=1
- v-decorator="[
- 'formValidate.itemNum',
- { initialValue: formValidate.itemNum,
- rules: [{ required: true, type: 'number', message: '请输入数量', trigger: 'change' }] },
- ]"
- >
- </a-input-number>
- </a-form-item>
- <a-form-item :wrapper-col="{ span: 18, offset:3}">
- <a-button v-if="!checked" type="primary" style="width:100px;" @click="handleSubmit()">加入</a-button>
- <a-button v-if="checked" type="primary" style="width:100px;" @click="handleSubmit()">保存</a-button>
- <a-button v-if="checked" type="error" style="margin-left: 20px;width:100px;" @click="del()">删除</a-button>
- <a-button @click="cancle()" style="margin-left: 20px;width:100px;">取消</a-button>
- </a-form-item>
- </a-form>
- </a-modal>
- </template>
- <script>
- export default {
- name: 'addServerToHd',
- props: {
- openModal: {
- type: Boolean,
- default: false
- },
- index: {
- type: [String, Number]
- },
- },
- components: { },
- watch: {
- isShow (newValue, oldValue) {
- if (!newValue){
- this.$emit('closeModal')
- this.clearData()
- }
- },
- openModal (newValue, oldValue) {
- this.isShow = newValue
- }
- },
- data () {
- return {
- isShow: this.openModal,
- modal_loading: false,
- title: '加入活动内容',
- checked: false,
- form: this.$form.createForm(this, { name: 'serverToHd' }),
- formValidate: {
- itemSrcPrice: 0,
- itemNum: 1
- },
- serverData: {},
- }
- },
- methods: {
- // 设置数据
- setServerData (item, checked){
- console.log(item,'000')
- this.checked = checked
- this.title = item.itemName
- this.serverData = item
- this.formValidate.itemSrcPrice = item.itemSrcPrice
- this.formValidate.itemNum = item.itemNum
- },
- // 清空数据
- clearData (){
- this.title = ''
- this.checked = false
- this.serverData = {}
- this.form.resetFields()
- },
- // 关闭弹窗触发
- cancle (){
- this.isShow = false
- },
- // 加入套餐,type 1新增,0编辑
- handleSubmit () {
- this.form.validateFields((valid,vaules) => {
- if (!valid) {
- console.log(vaules.formValidate)
- vaules.formValidate.itemSrcPrice = Number(vaules.formValidate.itemSrcPrice)
- if (!vaules.formValidate.itemNum){
- this.$message.info('请输入数量')
- return
- }
- if (!vaules.formValidate.itemSrcPrice){
- this.$message.info('请输入原价')
- return
- }
-
- this.serverData = Object.assign({}, this.serverData, vaules.formValidate)
- this.$emit('addServer', this.serverData, this.checked)
- this.cancle()
- }
- })
- },
- // 取消工单
- del (){
- this.$emit('delServer', this.serverData, this.index)
- this.cancle()
- }
- },
- mounted (){
- }
- }
- </script>
- <style lang="less" scoped>
- .ant-btn-error{
- background: red;
- color: #fff;
- border: none;
- &:hover{
- background: firebrick;
- }
- }
- </style>
|