<template>
  <el-dialog :visible.sync="dialogOperationVisible" top="30px" :before-close="cancel" :append-to-body="true"  width="60%" :title="dialogOperationTiTle + $t('form.activity_button')">
    <div class="obpm-main mt-3">
      <div id="contentTable" class="dialog-content">
        <el-form :model="actForm" size="small" label-position="left" :rules="operateRules" ref="operateRuleFrom" label-width="105px">
          <el-form-item :label="$t('view.name')"  prop="name">
            <el-input v-model="actForm.name" class="width-400"></el-input>
          </el-form-item>
          <el-form-item :label="$t('view.label')" >
            <el-input
              type="textarea"
              :rows="6"
              :placeholder="$t('placeholder.name_label_script')"
              class="width-400"
              v-model="actForm.label"
            ></el-input>
            <i class="el-icon-edit-outline" @click="showScriptEditor('actFromLabel')"></i>
          </el-form-item>
          <el-form-item :label="$t('view.multi_language_tag')" >
            <el-input v-model="actForm.multiLanguageLabel" class="width-400"></el-input>
            <el-button plain @click="showMultiLanguage('actFormMultiLang')" style="margin-left : 5px">{{$t('btns.choose')}}</el-button>
          </el-form-item>
          <el-form-item :label="$t('view.action')"  prop="type">
            <el-select v-model="actForm.type" :placeholder="$t('placeholder.select')" class="width-400" :disabled="dialogOperationTiTle === '编辑'" @change="changeAction">
              <el-option v-for="item in actTypeOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
            </el-select>
            <p style="color: #33bd00; margin-bottom: 0; line-hegiht: 1.5" v-show="showNotSupportTxt">*{{$t('unsupport')}}</p>
          </el-form-item>
          <el-form-item :label="$t('view.icon_type')" >
            <el-radio-group v-model="actForm.icontype">
              <el-radio label="img">{{$t('view.img')}}</el-radio>
              <el-radio label="font">{{$t('view.font')}}</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item :label="$t('view.icon')" >
            <div v-if="actForm.icontype === 'img'">
              <img class="imgIcon" :src="actForm.iconUrl" v-if="actForm.iconUrl !== ''" />
              <el-button size="small" @click="actFormSelectImg">{{$t('btns.choose')}}{{$t('widget.pic')}}</el-button>
              <IconSelect :visible.sync="actFormIconSelectCheck" :logoUrl="actForm.iconUrl" @select-ok="onActFormSelectIconOk" v-show="actFormIconSelectCheck" :innerDialog="true" />
              <el-button size="small" @click="resetActFormIconUrl">{{$t('btns.clean')}}</el-button>
            </div>
            <div v-if="actForm.icontype === 'font'">
              <i :class="actForm.fontUrl" class="imgIcon" v-if="actForm.fontUrl !== ''"></i>
              <el-button size="small" @click="actFormSelectFont">{{$t('btns.choose')}}{{$t('widget.icon')}}</el-button>
              <FontSelect :visible.sync="actFormFontSelectCheck" :logoUrl="actForm.fontUrl" @select-ok="onActFormSelectFontOk" v-show="actFormFontSelectCheck" :innerDialog="true" />
              <el-button size="small" @click="resetActFormFontUrl">{{$t('btns.clean')}}</el-button>
            </div>
            <div v-if="actForm.icontype === ''">
              <el-button size="small" disabled>{{$t('btns.choose')}}</el-button>
              <el-button size="small">{{$t('btns.clean')}}</el-button>
            </div>
          </el-form-item>
          <el-form-item :label="$t('view.color_type')" >
            <el-select v-model="actForm.colorType" size="small" class="width-400" >
              <el-option value="default" :label="$t('view.default')"></el-option>
              <el-option value="primary" :label="$t('view.primary')" style="background-color: #337ab7;"></el-option>
              <el-option value="success" :label="$t('view.success')" style="background-color: #449d44;"></el-option>
              <el-option value="info" :label="$t('view.info')" style="background-color: #5bc0de;"></el-option>
              <el-option value="warning" :label="$t('view.warning')" style="background-color: #ec971f;"></el-option>
              <el-option value="danger" :label="$t('view.danger')" style="background-color: #d9534f;"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="$t('view.impmapping_config')" key="actForm.impmappingconfigid"  v-if="actForm.type === '27'" prop="impmappingconfigid">
            <el-select v-model="actForm.impmappingconfigid" :placeholder="$t('placeholder.select')">
              <el-option v-for="item in actFormImportMapOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="$t('view.show_context')"  v-show="showContextMenu">
            <el-checkbox :label="$t('label.tabbtn')" v-model="actForm.showInToolbar"></el-checkbox>
            <el-checkbox :label="$t('label.right_click')" v-model="actForm.contextMenu"></el-checkbox>
          </el-form-item>
          <el-form-item :label="$t('view.onactionform')"  v-if="showOnActionForm" prop="onActionForm">
            <el-select v-model="actForm.onActionForm" :placeholder="$t('placeholder.select')"  class="width-400">
              <el-option v-for="item in dataSourcesOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="$t('view.onactionview')"  v-if="this.actForm.type === '1'" prop="onActionView">
            <el-select v-model="actForm.onActionView" :placeholder="$t('placeholder.select')"  class="width-400">
              <el-option v-for="item in viewOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="$t('view.file_name_script')"  v-if="actForm.type == '26'" prop="fileNameScript">
            <el-input type="textarea" :rows="6" :placeholder="$t('placeholder.file_name_script')" class="width-400" v-model="actForm.fileNameScript"></el-input>
            <i class="el-icon-edit-outline" @click="showScriptEditor('actFromFileNameScript')"></i>
          </el-form-item>
          <el-form-item :label="$t('view.dispatcher_url')"  v-show="actForm.type == '43'">
            <el-input type="textarea" :rows="6" class="width-400" v-model="actForm.dispatcherUrl"></el-input>
            <i class="el-icon-edit-outline" @click="showScriptEditor('actFromDispatcherUrl')"></i>
          </el-form-item>
          <el-form-item :label="$t('view.paramete')"  v-show="actForm.type == '43'">
            <template>
              <el-table :data="actForm.dispatcherParams">
                  <el-table-column min-width="50%" :label="$t('view.parametername')">
                    <template slot-scope="scope">
                      <el-input v-model="scope.row.paramKey" size="mini"></el-input>
                    </template>
                  </el-table-column>
                  <el-table-column min-width="50%" :label="$t('view.parametervalue')">
                    <template slot-scope="scope">
                      <el-input v-model="scope.row.paramValue" size="mini"></el-input>
                    </template>
                  </el-table-column>
                  <el-table-column :label="$t('view.op')" min-width="25%">
                    <template slot="header">
                      <el-button size="small" @click="addRows">{{$t('btns.add')}}</el-button>
                    </template>
                  </el-table-column>
                  <el-table-column>
                    <template slot-scope="scope">
                      <el-button size="small" type="danger" @click="delRow(scope.$index)">{{$t("btns.delete")}}</el-button>
                    </template>
                  </el-table-column>
                </el-table>
            </template>
          </el-form-item>
          <el-form-item :label="$t('view.act_open_type')"  v-show="actForm.type == '43'">
            <el-radio-group v-model="actForm.jumpActOpenType">
              <el-radio label="0">{{$t('view.current_page')}}</el-radio>
              <el-radio label="1">{{$t('view.pop_layer')}}</el-radio>
              <el-radio label="2">{{$t('view.tabs')}}</el-radio>
              <el-radio label="3">{{$t('view.new_page')}}</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item :label="$t('view.before_action_script')" >
            <el-input
              type="textarea"
              :rows="6"
              :placeholder="$t('placeholder.before_action_script')"
              class="width-400"
              v-model="actForm.beforeActionScript"
            ></el-input>
            <i class="el-icon-edit-outline" @click="showScriptEditor('actFromBeforeActionScript')"></i>
          </el-form-item>
          <el-form-item :label="$t('view.afteractionscript')"  v-show="showAfterActionScript">
            <el-input
              type="textarea"
              :rows="6"
              :placeholder="$t('placeholder.action_script')"
              class="width-400"
              v-model="actForm.afterActionScript"
            ></el-input>
            <i class="el-icon-edit-outline" @click="showScriptEditor('actFromAfterActionScript')"></i>
          </el-form-item>
          <el-form-item :label="$t('view.readonly_script')" >
            <el-input
              type="textarea"
              :rows="6"
              :placeholder="$t('placeholder.boolean_value')"
              class="width-400"
              v-model="actForm.readonlyScript"
            ></el-input>
            <i class="el-icon-edit-outline" @click="showScriptEditor('actFromReadonlyScript')"></i>
          </el-form-item>
          <el-form-item :label="$t('view.hidden_script')" >
            <el-input
              type="textarea"
              :rows="6"
              :placeholder="$t('placeholder.boolean_value')"
              class="width-400"
              v-model="actForm.hiddenScript"
            ></el-input>
            <i class="el-icon-edit-outline" @click="showScriptEditor('actFromHiddenScript')"></i>
          </el-form-item>
          <el-form-item :label="$t('view.expSub')"  v-show="actForm.type == '16'">
            <el-checkbox v-model="actForm.expSub"></el-checkbox>
          </el-form-item>
        </el-form>
      </div>
    </div>
    <div class="bar d-inline-block float-right" slot="footer">
      <el-button size="small" @click="cancel">{{$t('btns.cancel')}}</el-button>
      <el-button type="primary" size="small" @click="operateNewSave('operateRuleFrom')">{{$t('btns.save_new')}}</el-button>
      <el-button type="primary" size="small" @click="operateSave('operateRuleFrom')">{{$t("btns.save")}}</el-button>
    </div>

    <!-- 多语言弹窗 -->
    <!-- multiVisible: 弹框显示  closeMultiLanguage： 关闭前回调  selectRowValue：选择行  isNested：是否为内置嵌套的弹窗 languageData: 多语言数据  delMultiLanguage：删除多语言  changeLanguageParams：参数改变 -->
    <MultiLanguages 
      :multiVisible="languagesVisible" 
      @closeMultiLanguage="languagesVisible = false" 
      @selectRowValue="handelMultiLanguage"
      @showMultiVisible="showMultiVisible"
      :isNested="true"
      :languageData="languageData"
      @delMultiLanguage="delMultiLanguage"
      @changeLanguageParams="changeLanguageParams"
      @resetMultiLanguage="resetMultiLanguage"
    />

    <!-- 脚本选择器弹窗 -->
    <!-- scriptEditorVisible:弹窗显示   showScritptEditorCode：将文本框的值传给编译器  handleScriptEditor：将编译器的值传给textarea-->
    <ScriptEditorSelect
      v-if="scriptEditorVisible"
      :scriptEditorVisible="scriptEditorVisible"
      :editorCode="showScritptEditorCode"
      @closeScriptEditorDialog="scriptEditorVisible = false"
      @saveScriptEditor="handleScriptEditor"
      :isNested="true"
    />
  </el-dialog>
</template>

<script>
import { reqImportMap, saveActivitysView, updateActivitysView, getModuleViewList } from "@/service/ViewApi.js";
import { getModuleFormList } from '@/service/FormApi.js'

import { getLogoUrl } from "@/service/CommontoolsAPI.js";
import { getMultiLanguageList, deleteMultiLanguageList } from "@/service/MultiLanguageAPI.js";

import MultiLanguages from "@/components/Common/languages_select";
import ScriptEditorSelect from "@/components/Common/scriptEditor";
import IconSelect from "@/components/Common/icon_select";
import FontSelect from "@/components/Common/font_select";
import { nameCheck } from "@/utils/utils.js";
import configData from  '@/assets/js/config'
import {delMsg} from '@/utils/elementui'
export default {
  data() {
    return {
      dataSourcesOptions: [], // 作用表单
      viewOptions: [], // 作用视图
      operateRules: {
        name: [
          { required: true, message: this.$t('placeholder.name'), trigger: "blur" },
          { validator: nameCheck, trigger: "blur" },
        ],
        type: [{ required: true, message: this.$t('placeholder.action'), trigger: "change" }],
        onActionForm: [{ required: true, message: this.$t('placeholder.form'), trigger: "change" }],
        onActionView: [{ required: true, message: this.$t('placeholder.view'), trigger: "change" }],
        fileNameScript: [{ required: true, message: this.$t('placeholder.route'), trigger: "blur" }],
        impmappingconfigid: [{ required: true, message: this.$t('placeholder.filed'), trigger: "change" }],
      },
      actTypeOptions: configData.actTypeOptions,
      actFormIconSelectCheck: false, // 操作表单的图片弹窗
      actFormFontSelectCheck: false, // 操作表单的字体弹窗

      actFormImportMapOptions: [], // 导入映射的内容

      languagesVisible: false, // 多语言弹窗
      currentMultiLanguage: "", // 当前点击的是哪一个多语言弹窗
      languageData: {}, // 多语言数据
      languageParams:{
        label:'',
        text:'',
        type:'',
        currpage: 1,
        pagelines: 10,
      },

      scriptEditorVisible: false, // 脚本编辑器弹窗
      currentScriptEditor: "", // 当前点击的是哪一个脚本编辑器

      isOpenActDialog: false, // 点击保存并新建后弹窗是否打开
    };
  },
  mounted(){
    this.getModuleFormList()
    this.getViewForm()
  },
  components: {
    MultiLanguages,
    ScriptEditorSelect,
    IconSelect,
    FontSelect,
  },
  methods: {
    /**
     * 切换动作
     */
    changeAction(val){
      if(val == 27){
        this.getImportMap()
      }
    },
    /**
     * 操作保存并新建
     */

    operateNewSave(formName) {
      this.operateSave(formName)
      this.isOpenActDialog = true
    },
    /**
     * 操作保存
     */
    operateSave(formName) {
      this.$refs[formName].validate(async (valid) => {
        if (valid) {
          this.isOpenActDialog = false
          if(this.actForm.icontype){
            if (this.actForm.icontype === "img") {
              if (!this.actForm.iconUrl) {
                try{
                  await delMsg(this.$t('msg.confirm_icon'), this.$t('msg.tip'))
                  this.actForm.icon = ''
                  this.saveInfo()
                }catch(e){
                  console.log(e)
                }
              } else {
                let index = this.actForm.iconUrl.lastIndexOf('/icon/') + 5
                this.actForm.icon = `{"icon":"${this.actForm.iconUrl.slice(index)}","type":"${this.actForm.icontype}"}`;
                this.saveInfo()
              }
            } else if (this.actForm.icontype === "font") {
              if (!this.actForm.fontUrl) {
                try{
                  await delMsg(this.$t('msg.confirm_icon'), this.$t('msg.tip'))
                  this.actForm.icon = ''
                  this.saveInfo()
                }catch(e){
                  console.log(e)
                }
              } else {
                this.actForm.icon = this.actForm.icon = `{"icon":"${this.actForm.fontUrl}","type":"${this.actForm.icontype}"}`;
                this.saveInfo()
              }
            }
          }else{
            this.saveInfo()
          }
        } else {
          return false;
        }
      });
    },

    /**
     * 新增或更新
     */
    saveInfo(){
      let params = {
        ...this.params,
        appId: sessionStorage.getItem("appId"),
        viewId: this.viewId,
        activityId: this.activityId, // 当前行的id
      };

      let actForm = {
        ...this.actForm,
        type: parseInt(this.actForm.type),
        jumpActOpenType: parseInt(this.actForm.jumpActOpenType),
        dispatcherParams: JSON.stringify(this.actForm.dispatcherParams),

      }
      if(actForm.type=='43'){
        actForm.targetList=this.viewId+"|"
      }
      
      if (this.dialogOperationTiTle === "编辑") {
        updateActivitysView(params, actForm, {
          onSucess: (response) => {
            // console.log(response);
            if (response.data.errcode == 0) {
              this.$parent.getViewActivitys();
              this.$message.success(this.$t('msg.update_ss'))
              if(this.isOpenActDialog){
                this.$refs['operateRuleFrom'].resetFields()
                this.$parent.createAct()
              }else{
                this.$emit("closeOperationDialog");
                // 重置信息
                this.$refs['operateRuleFrom'].resetFields()
              }
            }
          },
        });
      } else if (this.dialogOperationTiTle === "新建") {
        // 给新增的值添加排序号
        actForm.orderno = this.$parent.activiteTableData.length
        // 更新
        saveActivitysView(params, actForm, {
          onSucess: (response) => {
            // console.log(response);
            if (response.data.errcode == 0) {
              this.$parent.getViewActivitys();
              this.$message.success(this.$t('msg.created_ss'))
              if(this.isOpenActDialog){
                this.$refs['operateRuleFrom'].resetFields()
                this.$parent.createAct()
              }else{
                this.$emit("closeOperationDialog");
                // 重置信息
                this.$refs['operateRuleFrom'].resetFields()
              }
            }
          },
        });
      }
    },

    /**
     * 取消
     */
    cancel() {
      this.$refs['operateRuleFrom'].resetFields()
      this.$store.dispatch("rightHelpPageParams", { title: "视图信息操作", url: "application/application_module_view_info_activity_help.html" });
      let actForm = {
        ...this.actForm,
        name: "", //名称
        label: "", //标签
        multiLanguageLabel: "", //多语言标签
        type: "", //动作
        icon: "", // 图标类型和图标合并的值
        icontype: "", // 图标类型【img:图片，font图标】
        iconUrl: "", // 图片地址
        fontUrl: "", // 字体图标地址
        colorType: "default", //颜色类型
        impmappingconfigid: "", // 导入映射
        showInToolbar: true, // 在工具栏中显示
        contextMenu: true, // 右键菜单操作
        onActionForm: "", // 作用表单
        onActionView: "", // 作用视图
        fileNameScript: "", // 文件执行脚本
        dispatcherUrl: "", // 地址脚本
        dispatcherParams: [
          {
            paramKey:'',
            paramValue:''
          }
        ], // 参数
        jumpActOpenType: "0", //打开方式
        beforeActionScript: "", //动作执行前脚本
        afterActionScript: "", //动作执行后脚本
        readonlyScript: "", //只读条件
        hiddenScript: "", //隐藏条件
        expSub: false, // 是否导出子表数据
        orderno: 0 // 排序
      };
      this.$emit("resetActFormData", actForm);
      this.$emit("closeOperationDialog");
    },

    /**
     * 添加图片弹窗
     */
    actFormSelectImg() {
      this.actFormIconSelectCheck = true;
    },

    /**
     *添加字体图标弹窗
     */
    actFormSelectFont() {
      this.actFormFontSelectCheck = true;
    },
    /**
     * 操作添加图片
     */
    onActFormSelectIconOk(item) {
      if (item) {
        if (item.path) {
          this.actForm.iconUrl = getLogoUrl(item.path);
        } else {
          this.$message({
            showClose: true,
            type: "error",
            message: this.$t('msg.select_fail'),
          });
        }
      }
    },
    // 选择字体图标
    onActFormSelectFontOk(font) {
      this.actForm.fontUrl = font;
      this.actFormFontSelectCheck = false;
    },
    /**
     * 清空图片路径
     */
    resetActFormIconUrl() {
      this.actForm.iconUrl = "";
    },
    /**
     * 清空字体图标路径
     */
    resetActFormFontUrl() {
      this.actForm.fontUrl = "";
    },

    /**
     * 动作为跳转时添加的参数
     */
    addRows(){
      this.actForm.dispatcherParams.push({ paramKey: "", paramValue: "" });
    },

    /**
     * 动作为跳转时删除的参数
     */
    delRow(index){
      this.actForm.dispatcherParams.splice(index, 1)
    },
    
    /**
     * 显示多语言弹框
     */
    showMultiLanguage(val) {
      this.languagesVisible = true;
      this.currentMultiLanguage = val;
      this.getMultiLanguagetions()
    },

    /**
     * 多语言列表
     */
    async getMultiLanguagetions() {
      let appId = sessionStorage.getItem("appId");
      const response = await getMultiLanguageList(this.languageParams, appId);
      if (response.data.errcode == 0) {
        let list = response.data.data;
        if(list.data == null){
          list.data = []
        }
        list.data.map((item) => {
          if (item.type == 1) {
            item.language = "English";
          } else if (item.type == 2) {
            item.language = "简体中文";
          } else if (item.type == 3) {
            item.language = "繁體中文";
          }
        });
        this.languageData = list;
      }
    },

    /**
     * 删除多语言
     */
    async delMultiLanguage(arr){
      try{
        await delMsg(this.$t('msg.delConfirm'), this.$t('msg.tip'))
        const response = await deleteMultiLanguageList(arr)
        if (response.data.errcode == 0) {
          this.$message.success(this.$t('msg.remove_ss'));
          this.getMultiLanguagetions();
        }
      }catch(e){
        console.log(e)
      }
    },

    /**
     * 多语言参数改变时重新请求
     */
    changeLanguageParams(params){
      this.languageParams = params
      this.getMultiLanguagetions()
    },

    /**
     * 清空多语言的值
     */
    resetMultiLanguage(){
      this.actForm.multiLanguageLabel = ''
    },

    /**
     * 选择多语言的值
     */
    handelMultiLanguage(row) {
      if (this.currentMultiLanguage === "actFormMultiLang") {
        this.actForm.multiLanguageLabel = row.language;
      }
    },

    /**
     * 重新显示多语言列表
     */
    showMultiVisible(){
      this.languagesVisible = true;
      this.getMultiLanguagetions();
    },

    /**
     * 显示脚本编辑器弹框
     */
    showScriptEditor(val) {
      this.scriptEditorVisible = true;
      this.currentScriptEditor = val;
    },
    /**
     * 将脚本编辑器的值写入到textarea中
     */
    handleScriptEditor(val) {
      if (this.currentScriptEditor === "actFromBeforeActionScript") {
        // 视图操作动作执行前脚本
        this.actForm.beforeActionScript = val;
      } else if (this.currentScriptEditor === "actFromAfterActionScript") {
        // 视图操作动作执行后脚本
        this.actForm.afterActionScript = val;
      } else if (this.currentScriptEditor === "actFromReadonlyScript") {
        // 视图操作只读条件
        this.actForm.readonlyScript = val;
      } else if (this.currentScriptEditor === "actFromHiddenScript") {
        // 视图操作隐藏条件
        this.actForm.hiddenScript = val;
      } else if (this.currentScriptEditor === "actFromFileNameScript") {
        // 视图操作文件路径脚本
        this.actForm.fileNameScript = val;
      } else if (this.currentScriptEditor === "actFromDispatcherUrl") {
        // 视图操作地址脚本
        this.actForm.dispatcherUrl = val;
      }else if(this.currentScriptEditor === "actFromLabel"){
        // 名称标签脚本
        this.actForm.label = val;
      }
    },

    /**
     * 操作动作为导入Excel的导入映射
     */
    async getImportMap() {
      let response = await reqImportMap(
        {
          appId: sessionStorage.getItem("appId"),
          name: "",
          pageNo: 1,
          linesPerPage: 1000000,
        });
      if (response.data.errcode == 0) {
        this.actFormImportMapOptions = response.data.data.datas;
        
        // 如果是新建就默认第一个
        if(this.dialogOperationTiTle == '新建'){
          this.actForm.impmappingconfigid = this.actFormImportMapOptions[0].id;
        }
      }
    },

    /**
     * 数据来源表单
     */
    getModuleFormList() {
      let params = {
        moduleId: this.moduleId,
        name: '',
        description: '',
        type: '',
        pageNo: 1,
        linesPerPage: 100000,
      }
      getModuleFormList(params, {
        onSucess: (response) => {
          if (response.data.errcode == 0) {
            let data = response.data.data.datas
            let dataArr = []
            for (let i = 0; i < data.length; i++) {
              if (data[i].type == 1) {
                dataArr.push(data[i])
              } else if (data[i].type == 65536) {
                dataArr.push(data[i])
              }
            }
            this.dataSourcesOptions = dataArr // 普通表单和映射表单的数组
          }
        },
      })
    },
    /**
     * 获取列表单作用视图数据
     */
    getViewForm() {
      let params = {
        appId: sessionStorage.getItem('appId'),
        moduleId: this.moduleId,
        searchword: "",
        viewId: "",
        pageNo: 1,
        linesPerPage: 100000,
      };
      getModuleViewList(params, {
        onSucess: (response) => {
          if (response.data.errcode == 0) {
            this.viewOptions = [];
            let data = response.data.data.datas;
            for (let i = 0; i < data.length; i++) {
              let arr = {};
              arr.value = data[i].id;
              arr.label = data[i].name;
              this.viewOptions.push(arr);
            }
          }
        },
      });
    },
  },
  computed: {
    /**
     * 视图操作动作中不支持手机的文字提示
     */
    showNotSupportTxt() {
      let flag;
      if (this.actForm.type === "" || this.actForm.type === "1" || this.actForm.type === "2" || this.actForm.type === "3" || this.actForm.type === "34" || this.actForm.type === "43" || this.actForm.type === "18" ||  this.actForm.type === "20") {
        flag = false;
      } else {
        flag = true;
      }
      return flag;
    },
    /**
     * 视图操作作用表单
     */
    showOnActionForm() {
      let flag;
      if (this.actForm.type === "2" || this.actForm.type === "18") {
        flag = true;
      } else {
        flag = false;
      }
      return flag;
    },
    /**
     * 视图操作显示位置
     */
    showContextMenu() {
      let flag;
      if (this.actForm.type === "2" || this.actForm.type === "3") {
        flag = true;
      } else {
        flag = false;
      }
      return flag;
    },
    /**
     * 视图操作动作执行后脚本
     */
    showAfterActionScript() {
      let flag;
      if (this.actForm.type === "26" || this.actForm.type === "43") {
        flag = false;
      } else {
        flag = true;
      }
      return flag;
    },
    /**
     * 脚本编辑器的值
     */
    showScritptEditorCode() {
      let code;
      if (this.currentScriptEditor === "actFromBeforeActionScript") {
        // 视图操作动作执行前脚本
        code = this.actForm.beforeActionScript;
      } else if (this.currentScriptEditor === "actFromAfterActionScript") {
        // 视图操作动作执行后脚本
        code = this.actForm.afterActionScript;
      } else if (this.currentScriptEditor === "actFromReadonlyScript") {
        // 视图操作只读条件
        code = this.actForm.readonlyScript;
      } else if (this.currentScriptEditor === "actFromHiddenScript") {
        // 视图操作隐藏条件
        code = this.actForm.hiddenScript;
      } else if (this.currentScriptEditor === "actFromFileNameScript") {
        // 视图操作文件路径脚本
        code = this.actForm.fileNameScript;
      } else if (this.currentScriptEditor === "actFromDispatcherUrl") {
        // 视图操作地址脚本
        code = this.actForm.dispatcherUrl;
      }else if(this.currentScriptEditor === "actFromLabel"){
        // 名称标签脚本
        code = this.actForm.label;
      }
      return code;
    },
  },
  props: {
    dialogOperationVisible: Boolean,
    actForm: Object,
    dialogOperationTiTle: String,
    activityId: {
      type: String,
      default: "",
    },
    viewId: String,
    moduleId: String
  },
  watch: {
    "$store.state.rightHelpPageParams": {
      handler() {
        if (this.$store.state.rightHelpFrame) {
          this.$store.state.rightHelpFrame.contentWindow.showHelpContentHtml(this.$store.state.rightHelpPageParams.title, this.$store.state.rightHelpPageParams.url);
        }
      },
      deep: true,
    },
  },
};
</script>
