<template>
  <Modal
    :closable="false"
    :mask-closable="false"
    :title="isUpdate ? '编辑定价' : '添加定价'"
    @on-visible-change="visibleChange"
    v-model="my_show"
  >
    <div class="page-edit-wrap uinn-lr20">
      <ui-loading :show="page_loading.show"></ui-loading>

      <ul>
        <li class="ui-list">
          <div class="ui-list-title">
            <span class="title-require">*</span>定价名称:
          </div>
          <div class="ui-list-content">
            <Input :maxlength="32" v-model.trim="params.name"></Input>
          </div>
        </li>

        <li class="ui-list">
          <div class="ui-list-title">
            <span class="title-require">*</span>选择套餐:
          </div>
          <div class="ui-list-content">
            <Select :disabled="isUpdate" filterable v-model.trim="params.package_id">
              <Option
                :key="item.id"
                :value="item.id"
                v-for="item in completePackagesFilter"
              >{{ item.name }}</Option>
            </Select>
          </div>
        </li>

        <li class="ui-list">
          <div class="ui-list-title">销售价格</div>
          <div class="ui-list-content">
            <InputNumber
              :active-change="false"
              :max="100000"
              :min="0"
              :precision="2"
              :step="0.1"
              v-model.trim="params.price"
            ></InputNumber>
          </div>
        </li>

        <li class="ui-list" v-if="type === 0">
          <div class="ui-list-title">续费价格</div>
          <div class="ui-list-content">
            <InputNumber
              :active-change="false"
              :max="100000"
              :min="0"
              :precision="2"
              :step="0.1"
              v-model.trim="params.renew_price"
            ></InputNumber>
          </div>
        </li>

        <li class="ui-list">
          <div class="ui-list-title">备注:</div>
          <div class="ui-list-content">
            <p>
              <Input :maxlength="32" v-model.trim="params.remark"></Input>
            </p>
          </div>
        </li>

        <li class="ui-list">
          <div class="ui-list-title">状态：</div>
          <div class="ui-list-content lh-32">
            <Switch size="large" :true-value="0" :false-value="1" v-model="params.status">
              <span slot="open">启用</span>
              <span slot="close">禁用</span>
            </Switch>
          </div>
        </li>
      </ul>
    </div>
    <footer class="ta-c" slot="footer">
      <Button @click="clear" class="w-80" ghost type="primary">取消</Button>
      <Button :loading="loading" @click="ok" class="w-80" type="primary">提交</Button>
    </footer>
  </Modal>
</template>

<script src="./js/edit.js"></script>
