Source/ProjectWeb/src/views/base/UIContentArea.vue

@@ -9,30 +9,48 @@
            </template>
            <div class="componentVO">
              <compoent-index :key="areasName+'componentVO-'+componentVO.oid"
                              :uiBtmType="uiBtmType"
                              :uiContext="uiContext"
                              :inDialog="inDialog"
                              :canEdit="canEdit"
                              :actionType="actionType"
                              :componentVO="componentVO"
                              :sourceData="newSourceData"
                              :sourceBtmType="sourceBtmType"
                              :dataStore="dataStore"
                              :areasName="areasName"
                              :paramVOS="paramVOS"
                              @setData="setData"
                              @setDataStore="setDataStore"
                              :isShow="collapseActiveNames.indexOf(areasName+'-collapse-'+componentIndex)!=-1?true:false"></compoent-index>
            </div>
          </el-collapse-item>
        </el-collapse>
        <div v-else class="componentVO">
        <div v-else-if="areaItem.componentVOs.length==1" class="componentVO">
          <compoent-index :key="areasName+'componentVO-'+areaItem.componentVOs[0].oid"
                          :uiBtmType="uiBtmType"
                          :uiContext="uiContext"
                          :inDialog="inDialog"
                          :canEdit="canEdit"
                          :actionType="actionType"
                          :componentVO="areaItem.componentVOs[0]"
                          :sourceData="newSourceData"
                          :sourceBtmType="sourceBtmType"
                          :dataStore="dataStore"
                          :areasName="areasName"
                          :paramVOS="paramVOS"
                          @setData="setData"
                          @setDataStore="setDataStore"
                          :isShow="activeName==(areasName+'-Tab-'+index)?true:false"></compoent-index>
        </div>
        <div v-else>
          <el-alert
            class="alert"
            :closable="false"
            title=""
            type="info"
            description="没有可显示的内容，请联系管理人员检查配置。">
          </el-alert>
        </div>
      </el-tab-pane>
    </el-tabs>
@@ -47,30 +65,45 @@
                            :uiBtmType="uiBtmType"
                            :uiContext="uiContext"
                            :inDialog="inDialog"
                            :canEdit="canEdit"
                            :actionType="actionType"
                            :componentVO="componentVO"
                            :sourceData="newSourceData"
                            :sourceBtmType="sourceBtmType"
                            :dataStore="dataStore"
                            :areasName="areasName"
                            :paramVOS="paramVOS"
                            @setData="setData"
                            @setDataStore="setDataStore"
                            :isShow="collapseActiveNames.indexOf(areasName+'-collapse-'+componentIndex)!=-1?true:false"></compoent-index>
          </div>
        </el-collapse-item>
      </el-collapse>
      <div v-else class="componentVO">
      <div v-else-if="newAreasData[0].componentVOs.length===1" class="componentVO">
        <compoent-index :key="areasName+'componentVO-'+newAreasData[0].componentVOs[0].oid"
                        :uiBtmType="uiBtmType"
                        :uiContext="uiContext"
                        :inDialog="inDialog"
                        :canEdit="canEdit"
                        :actionType="actionType"
                        :componentVO="newAreasData[0].componentVOs[0]"
                        :sourceData="newSourceData"
                        :sourceBtmType="sourceBtmType"
                        :dataStore="dataStore"
                        :areasName="areasName"
                        :paramVOS="paramVOS"
                        @setData="setData"
                        @setDataStore="setDataStore"
                        :isShow="true"></compoent-index>
      </div>
      <div v-else>
        <el-alert
          class="alert"
          :closable="false"
          title=""
          type="info"
          description="没有可显示的内容，请联系管理人员检查配置。">
        </el-alert>
      </div>
    </div>
    <div v-else>
@@ -84,24 +117,21 @@
        description="该区域没有配置显示的内容">
      </el-alert>
      <el-alert
        v-else-if="Object.keys(newSourceData).length === 0"
        class="alert"
        :closable="false"
        title="源数据为空"
        type="error"
        show-icon
        description="不满足显示表达式条件，没有可显示的内容">
      </el-alert>
      <el-alert
        v-else
        v-else-if="Object.keys(newSourceData).length== 0"
        class="alert"
        :closable="false"
        title=""
        type="error"
        show-icon
        type="info"
        description="没有可显示的内容，请选择来源数据。">
      </el-alert>
      <el-alert
        v-else-if="newAreasData.length== 0"
        class="alert"
        :closable="false"
        title=""
        type="info"
        description="不满足显示表达式条件，没有可显示的内容。">
      </el-alert>
      {{newSourceData}}
    </div>
  </basic-container>
</template>
@@ -124,6 +154,15 @@
    inDialog: {
      type: Boolean,
      default: false
    },
    canEdit:{
      //内容是否可编辑
      type:Boolean,
      default:false
    },
    actionType:{
      //按钮操作类型
      default:""
    },
    areasName:{
      type:String,
@@ -156,24 +195,11 @@
  data(){
    return{
      activeName:this.areasName+'-Tab-0',
      collapseActiveNames:[this.areasName+'-collapse-0']
      collapseActiveNames:[this.areasName+'-collapse-0'],
      newAreasData:[]
    }
  },
  computed:{
    newAreasData(){
      let newAreasData = [];
      this.areasData.forEach(areaData => {
        //验证显式表达式
        if (!validatenull(areaData.displayExpression)) {
          if (this.checkDisplayExpression(areaData.displayExpression)) {
            newAreasData.push(areaData)
          }
        } else {
          newAreasData.push(areaData)
        }
      })
     return newAreasData;
    },
    newSourceData(){
      if(this.sourceData.attributes && this.sourceData.parentId!=undefined && this.sourceData.parentId !=null){
        //源数据是树节点
@@ -182,29 +208,63 @@
      return this.sourceData;
    }
  },
  watch: {
    'newSourceData':{
      handler(newval) {
        this.getNewAreasData();
      }
    }
  },
  created() {

    this.getNewAreasData();
  },
  mounted() {
    // console.log(this.areasData);
  },
  methods:{
    checkDisplayExpression(displayExpressionStr){
    getNewAreasData(){
      if(Object.keys(this.newSourceData).length> 0){
        let newAreasData = [];
        this.areasData.forEach(areaData => {
          //验证显式表达式
          if (!validatenull(areaData.displayExpression)) {
            if (this.checkDisplayExpression(areaData.displayExpression)) {
              newAreasData.push(areaData)
            }
          } else {
            newAreasData.push(areaData)
          }
        })
        this.newAreasData = newAreasData;
      }else {
        this.newAreasData=this.areasData;
      }
    },
    checkDisplayExpression(displayExpressionStr) {
      //"${folderbusinesstype}"<>"workunit" and "${folderbusinesstype}"<>"part"  and "${folderbusinesstype}"<>"Terminology" and  "${folderbusinesstype}"<>"AssMaterial" and  "${folderbusinesstype}"<>"resourcelib" and  "${folderbusinesstype}"<>"material"  and "${folderbusinesstype}"<>"machine"
      // "${folderbusinesstype}"="AssMaterial" or "${folderbusinesstype}"="assmaterial"
      //"${folderbusinesstype}"="material"
      //("${btmname}"="产品型号" and "${producttype}"<>"试验件") or "${btmname}"="ppart"or "${btmname}"="工艺零件"or "${btmname}"="part"or "${btmname}"="零件"
      //${folderbusinesstype}为源数据中的属性

      let checkdisplay=false;
      let checkdisplay = false;
      //替换and和or
      let newDisplayExpressionStr=displayExpressionStr.replace(/"\s*and\s*"/g,'" && "').replace(/"\s*AND\s*"/g,'" && "').replace(/"\s*or\s*"/g,'" || "').replace(/"\s*OR\s*"/g,'" || "');
      newDisplayExpressionStr=newDisplayExpressionStr.replace(/"\s*<>\s*"/g,'" != "').replace(/"\s*=\s*"/g,'" == "');
      newDisplayExpressionStr=newDisplayExpressionStr.replace(/"\$\{/g,'this.newSourceData.').replace(/\}"/g,'')
      let newDisplayExpressionStr = displayExpressionStr.replace(/"\s*and\s*"/g, '" && "').replace(/"\s*AND\s*"/g, '" && "').replace(/"\s*or\s*"/g, '" || "').replace(/"\s*OR\s*"/g, '" || "');
      newDisplayExpressionStr = newDisplayExpressionStr.replace(/\)\s*and\s*"/g, ') && "').replace(/\)\s*AND\s*"/g, ') && "').replace(/\)\s*or\s*"/g, ') || "').replace(/\)\s*OR\s*"/g, ') || "');
      newDisplayExpressionStr = newDisplayExpressionStr.replace(/"\s*and\s*\(/g, '" && (').replace(/"\s*AND\s*\(/g, '" && (').replace(/"\s*or\s*\(/g, '" || (').replace(/"\s*OR\s*\(/g, '" || (');
      newDisplayExpressionStr = newDisplayExpressionStr.replace(/\)\s*and\s*\(/g, ') && (').replace(/\)\s*AND\s*\(/g, ') && (').replace(/\)\s*or\s*\(/g, ') || (').replace(/\)\s*OR\s*\(/g, ') || (');
      //替换符号
      newDisplayExpressionStr = newDisplayExpressionStr.replace(/"\s*<>\s*"/g, '" != "').replace(/"\s*=\s*"/g, '" == "');
      newDisplayExpressionStr = newDisplayExpressionStr.replace(/"\$\{/g, 'this.newSourceData.').replace(/\}"/g, '')

      const sandbox = {};
      if(eval('('+newDisplayExpressionStr+')')){
        checkdisplay=true;
      try {
        if (eval('(' + newDisplayExpressionStr + ')')) {
          checkdisplay = true;
        }
      }catch (e) {
        console.log(displayExpressionStr);
      }

      return checkdisplay;
    },
    tabHandleClick(tab, event) {
@@ -213,6 +273,9 @@
    handleChange(val) {
      //console.log(val);
    },
    setData(value) {
      this.$emit("setData", value);
    },
    setDataStore(value) {
      this.$emit("setDataStore", value);
      this.dataStore = value.dataStore;