|
@@ -0,0 +1,202 @@
|
|
|
+<template>
|
|
|
+ <div id="detail">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24" class="main">
|
|
|
+ <el-col :span="24" class="one">
|
|
|
+ <el-col :span="24" class="top">
|
|
|
+ <el-button type="primary" size="mini" @click="back">返回</el-button>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="down">
|
|
|
+ <el-form :model="form" ref="form" label-width="100px">
|
|
|
+ <el-col :span="12" class="text">
|
|
|
+ <el-form-item label="创新券类型" prop="type">
|
|
|
+ <el-select v-model="form.type" placeholder="">
|
|
|
+ <el-option v-for="(item, index) in typeList" :key="index" :label="item" :value="item"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12" class="text">
|
|
|
+ <el-form-item label="创新券名称" prop="name">
|
|
|
+ <el-input v-model="form.name"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12" class="text">
|
|
|
+ <el-form-item label="折扣类型" prop="discount_type">
|
|
|
+ <el-select v-model="form.discount_type" placeholder="">
|
|
|
+ <el-option v-for="(item, index) in discounttypeList" :key="index" :label="item" :value="item"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12" class="text">
|
|
|
+ <el-form-item label="适用服务类型" prop="use_type">
|
|
|
+ <el-select v-model="form.use_type" placeholder="">
|
|
|
+ <el-option v-for="(item, index) in usetypeList" :key="index" :label="item" :value="item"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12" class="text">
|
|
|
+ <el-form-item label="所属分类" prop="classify">
|
|
|
+ <el-select v-model="form.classify" placeholder="">
|
|
|
+ <el-option v-for="(item, index) in classifyList" :key="index" :label="item" :value="item"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12" class="text">
|
|
|
+ <el-form-item label="期限" prop="limit_time">
|
|
|
+ <el-input v-model="form.limit_time" style="width: 94%"></el-input>
|
|
|
+ <span style="padding: 0 5px">个月</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12" class="text">
|
|
|
+ <el-form-item label="补贴比例" prop="scale">
|
|
|
+ <el-input v-model="form.scale" style="width: 96%"></el-input>
|
|
|
+ <span style="padding: 0 5px">%</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12" class="text">
|
|
|
+ <el-form-item label="面额" prop="allowance">
|
|
|
+ <el-input v-model="form.allowance" style="width: 96%"></el-input>
|
|
|
+ <span style="padding: 0 5px">元</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12" class="text">
|
|
|
+ <el-form-item label="券总额度" prop="total_allowance">
|
|
|
+ <el-input v-model="form.total_allowance" style="width: 96%"></el-input>
|
|
|
+ <span style="padding: 0 5px">元</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12" class="text">
|
|
|
+ <el-form-item label="单个企业/团队最大额度" prop="unit_allowance" label-width="200px">
|
|
|
+ <el-input v-model="form.unit_allowance" style="width: 96%"></el-input>
|
|
|
+ <span style="padding: 0 5px">元</span>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="text">
|
|
|
+ <el-form-item label="描述" prop="desc">
|
|
|
+ <el-input v-model="form.desc" type="textarea" maxlength="300" :autosize="{ minRows: 4, maxRows: 6 }" show-word-limit></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="formBtn">
|
|
|
+ <el-button type="danger" size="mini" @click="back">取消添加</el-button>
|
|
|
+ <el-button type="primary" size="mini" @click="onSubmit('form')">提交保存</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-form>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+const _ = require('lodash');
|
|
|
+import { mapState, createNamespacedHelpers } from 'vuex';
|
|
|
+const { mapActions: policy } = createNamespacedHelpers('policy');
|
|
|
+export default {
|
|
|
+ name: 'detail',
|
|
|
+ props: {},
|
|
|
+ components: {},
|
|
|
+ data: function () {
|
|
|
+ return {
|
|
|
+ form: {},
|
|
|
+ // 创新券类型
|
|
|
+ typeList: ['研发补贴', '奖励兑现', '创新券'],
|
|
|
+ // 折扣类型
|
|
|
+ discounttypeList: ['全额折扣券', '折扣券', '定额券'],
|
|
|
+ usetypeList: ['服务类型1', '服务类型2', '服务类型3'],
|
|
|
+ classifyList: ['分类1', '分类2', '分类3'],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ if (this.id) this.search();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...policy(['fetch', 'create', 'update']),
|
|
|
+ async search() {
|
|
|
+ const res = await this.fetch(this.id);
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
+ this.$set(this, `form`, res.data);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onSubmit(formName) {
|
|
|
+ this.$refs[formName].validate(async (valid) => {
|
|
|
+ if (valid) {
|
|
|
+ let data = this.form;
|
|
|
+ if (this.id) {
|
|
|
+ let res = await this.update(data);
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
+ this.$message({
|
|
|
+ message: '创新券信息修改成功',
|
|
|
+ type: 'success',
|
|
|
+ });
|
|
|
+ this.back();
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ let res = await this.create(data);
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
+ this.$message({
|
|
|
+ message: '创新券信息创新成功',
|
|
|
+ type: 'success',
|
|
|
+ });
|
|
|
+ this.back();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ console.log('error submit!!');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ back() {
|
|
|
+ this.$router.push({ path: '/adminCenter/policy/list' });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState(['user']),
|
|
|
+ id() {
|
|
|
+ return this.$route.query.id;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ metaInfo() {
|
|
|
+ return { title: this.$route.meta.title };
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ test: {
|
|
|
+ deep: true,
|
|
|
+ immediate: true,
|
|
|
+ handler(val) {},
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+.main {
|
|
|
+ border-radius: 10px;
|
|
|
+ box-shadow: 0 0 5px #cccccc;
|
|
|
+ padding: 20px;
|
|
|
+ .top {
|
|
|
+ text-align: right;
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+ }
|
|
|
+ .down {
|
|
|
+ .text {
|
|
|
+ border-bottom: 1px dashed #ccc;
|
|
|
+ padding: 15px 0;
|
|
|
+ }
|
|
|
+ /deep/.el-form-item {
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+ .el-select {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ .formBtn {
|
|
|
+ text-align: center;
|
|
|
+ padding: 10px 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.main:hover {
|
|
|
+ box-shadow: 0 0 5px #409eff;
|
|
|
+}
|
|
|
+</style>
|