ylrz_scrm_adminUI/src/views/qw/sopTemp/updateTemp.vue

<template>
  <div class="app-container">

    <div style="margin: 30px;" v-if="this.form.sendType == 1 && formType==1 "> sop规则【修改企微接口】模板</div>
    <div style="margin: 30px;" v-if="this.form.sendType == 1 && formType==2 "> sop规则【复制企微接口】模板</div>
    <div style="margin: 30px;" v-if="this.form.sendType == 1 && formType==3 "> sop规则【查看企微接口】模板</div>
    <div style="margin: 30px;" v-if="this.form.sendType == 2 && formType==1 "> sop规则【修改AI插件】模板</div>
    <div style="margin: 30px;" v-if="this.form.sendType == 2 && formType==2 "> sop规则【复制AI插件】模板</div>
    <div style="margin: 30px;" v-if="this.form.sendType == 2 && formType==3 "> sop规则【查看AI插件】模板</div>

    <div style="margin-top: 10px;margin-left: 50px;margin-right: 100px;margin-bottom: 60px;">
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="名称" prop="name">
          <el-input v-model="form.name" placeholder="请输入模板标题" />
        </el-form-item>

        <el-form-item label="状态">
          <el-radio-group v-model="form.status">
            <el-radio
              v-for="dict in statusOptions"
              :key="dict.dictValue"
              :label="dict.dictValue"
            >{{dict.dictLabel}}</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="间隔天数" prop="gap">
          <el-input-number v-model="form.gap"  :min="1" label="间隔天数"></el-input-number>
        </el-form-item>
        <el-form-item label="排序" prop="sort">
          <el-input-number v-model="form.sort"  :min="0" label="排序"></el-input-number>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer" style="float: right;" v-if="formType==1 || formType==2 ">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </div>
  </div>
</template>

<script>
import { listSopTemp, getSopTemp, delSopTemp, updateTemp, exportSopTemp } from "@/api/qw/sopTemp";
export default {
  name: "updateSopTemp",
  data() {
    return {
      uploadUrl:process.env.VUE_APP_BASE_API+"/common/uploadOSS2",
      uploadUrlByVoice:process.env.VUE_APP_BASE_API+"/common/uploadOSSByHOOKVoice",
      //上传语音的遮罩层
      voiceLoading :false,

      // 遮罩层
      loading: true,
      // 导出遮罩层
      exportLoading: false,
      // 选中数组
      ids: [],
      sysFsSopWatchStatus: [],
      //消息内容类型 企微版
      sysQwSopContentType:[],
      //插件版
      sysQwSopAiContentType:[],

      //类别
      sysQwSopSettingType:[],

      courseList:[],
      videoList:[],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // sop模板表格数据
      setting: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 状态字典
      statusOptions: [],
      videoNumOptions:{
        title:'选择视频号',
        open:false,
        content:null,
        contentIndex:null,
        setIndex:null,
      },
      //1 修改 2 复制 3 查看
      formType:null,
      // 查询参数
      form: {
        name: null,
        setting: null,
        status: "1",
        sort: 1,
        companyId: null,
        gap:1,
      },
      // 表单校验
      rules: {
        name: [
          { required: true, message: '名称不能为空', trigger: 'blur' }
        ],
        status: [
          { required: true, message: '状态不能为空', trigger: 'blur' }
        ],
        sort: [
          { required: true, message: '排序不能为空', trigger: 'blur' }
        ],
        gap: [
          { required: true, message: '间隔天数不能为空', trigger: 'blur' }
        ],
      }
    };
  },
  created() {
    this.getDicts("sys_company_status").then(response => {
      this.statusOptions = response.data;
    });
    const id = this.$route.params && this.$route.params.id;
    this.formType = this.$route.params && this.$route.params.type;
    this.handleUpdate(id);
  },
  methods: {
    // 取消按钮
    cancel() {
      this.$store.dispatch("tagsView/delView", this.$route);
      this.$router.replace('/qw/conversion/sopTemp')
      // this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        name: null,
        setting: null,
        status: "0",
        sort: null,
        createTime: null,
        createBy: null,
        companyId: null
      };
      this.resetForm("form");
    },


    /** 修改按钮操作 */
    handleUpdate(id) {
      getSopTemp(id).then(response => {
        this.form = response.data;
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.formType == 1) {
            if (this.form.id != null) {
              updateTemp(this.form).then(response => {
                this.msgSuccess("修改成功");
                this.$store.dispatch("tagsView/delView", this.$route);
                // this.$router.replace('/qw/conversion/sopTemp')
                window.location.replace('/qw/conversion/sopTemp')
                this.reset();
              });
            }
          } else {
            //id制空，防止键值重复-报错
            this.form.id = null
            //更新时间制空
            this.form.updateTime = null
            addTemp(this.form).then(response => {
              this.msgSuccess("复制成功");
              this.$store.dispatch("tagsView/delView", this.$route);
              // this.$router.replace('/qw/conversion/sopTemp')
              window.location.replace('/qw/conversion/sopTemp')
              this.reset();
            });
          }

        }
      });
    },
  }
};
</script>

<style scoped>
.custom-input /deep/ .el-input__inner {
  height: 20px;
  text-align: center;
}

.custom-input /deep/ .el-input__icon {
  line-height: 10px;
}
</style>