Merge remote-tracking branch 'origin/dev_third_stage' into dev_third_stage

jero-web/src/common/lang/en-us.js

@@ -1233,5 +1233,6 @@ module.exports = {
   displayInformation:'Display information',
   addComparison:'Add comparison',
   showOrNot:'Show or not',
+  comparisonMarket:'Comparison Market',
   share:'share',
 }

jero-web/src/common/lang/zh-cn.js

@@ -1336,5 +1336,6 @@ module.exports = {
   displayInformation:'展示信息',
   addComparison:'添加对比',
   showOrNot:'是否展示',
+  comparisonMarket:'对比市场',
   share:'分享',
 }

jero-web/src/views/businessSupport/problemKnowledgeBase/components/countryCardView.vue

@@ -70,17 +70,19 @@
       </div>
     </div>
     <displayInformationModel ref="displayInformationModelRef"/>
+    <countryCardViewAdd ref="countryCardViewAddRef" @countryCardViewAddForm="countryCardViewAddForm"/>
   </div>
 </template>
 
 <script>
   import { getAction, postAction, downloadFile } from '@/api/manage'
   import displayInformationModel from './displayInformationModel'
-
+  import countryCardViewAdd from './countryCardViewAdd'
   export default {
     name: 'countryCardView',
     components: {
-      displayInformationModel
+      displayInformationModel,
+      countryCardViewAdd
     },
     data() {
       return {}
@@ -92,6 +94,9 @@
         this.$refs.displayInformationModelRef.getData()
       },
       newlyAddedClick() {
+       this.$refs.countryCardViewAddRef.add()
+      },
+      countryCardViewAddForm(){
 
       }
     }

jero-web/src/views/businessSupport/problemKnowledgeBase/components/countryCardViewAdd.vue

@@ -0,0 +1,189 @@
+<template>
+  <a-modal
+    :title="$t('addComparison')"
+    :width="700"
+    :height="500"
+    :visible="visible"
+    :confirm-loading="confirmLoading"
+    :maskClosable="false"
+    @ok="handleOk"
+    @cancel="handleCancel"
+  >
+    <a-form-model :model="formInline" class="formAdd" :rules="rules" ref="ruleForm">
+      <a-row :gutter="24">
+        <a-col :span="24">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="Required">*</span>
+              <span class="title-text-text"
+                    :title="$t('applicableMarket')">{{$t('applicableMarket')}}</span>
+            </div>
+            <a-form-model-item class="itemModel" prop="applicableMarket">
+              <a-input class="box-input"
+                       v-model="formInline.applicableMarket"
+                       :placeholder="$t('PleaseEnter')+$t('applicableMarket')"/>
+            </a-form-model-item>
+          </div>
+        </a-col>
+      </a-row>
+      <a-row :gutter="24" v-for="(item,index) in formInline.dataList">
+        <a-col :span="24">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="Required">*</span>
+              <span class="title-text-text" :title="$t('comparisonMarket')+(index+1)">{{$t('comparisonMarket')+(index+1)}}</span>
+            </div>
+            <a-form-model-item class="itemModel" style="width: calc(100% - 220px)" prop="comparisonMarket">
+              <a-input class="box-input"
+                       v-model="formInline.comparisonMarket"
+                       :placeholder="$t('PleaseEnter')+$t('comparisonMarket')"/>
+            </a-form-model-item>
+
+            <a-icon class="icon-size"
+                    style="margin-left: 8px"
+                    @click="addData"
+                    v-if="(formInline.dataList.length-1) == index"
+                    type="plus-circle"/>
+            <a-icon class="icon-size"
+                    @click="deleteData"
+                    v-if="formInline.dataList.length > 1 && (formInline.dataList.length - 1) == index"
+                    type="minus-circle"/>
+          </div>
+        </a-col>
+      </a-row>
+    </a-form-model>
+  </a-modal>
+</template>
+
+<script>
+  import { getAction, postAction, downloadFile } from '@/api/manage'
+
+  export default {
+    name: 'countryCardViewAd',
+    data() {
+      return {
+        visible: false,
+        confirmLoading: false,
+        formInline: {},
+        rules: {
+          personChargeName: [
+            {
+              required: true,
+              message: this.$t('personCharge') + this.$t('cannotEmpty'),
+              trigger: 'change'
+            },
+            {
+              max: 100,
+              message: this.$t('personCharge') + this.$t('cannotExceed') + 100 + this.$t('Characters'),
+              trigger: 'change'
+            }
+          ],
+          problemLabel: [
+            {
+              required: true,
+              message: this.$t('problemLabel') + this.$t('cannotEmpty'),
+              trigger: 'blur'
+            },
+            {
+              max: 100,
+              message: this.$t('problemLabel') + this.$t('cannotExceed') + 100 + this.$t('Characters'),
+              trigger: 'blur'
+            }
+          ]
+        },
+        title: ''
+      }
+    },
+    mounted() {
+    },
+    methods: {
+      add() {
+        this.visible = true
+        this.$nextTick(() => {
+          this.formInline = {}
+          this.formInline.dataList = [{
+            relatedSection: ''
+          }]
+          this.formInline = { ...this.formInline }
+          this.$refs.ruleForm.clearValidate()
+        })
+      },
+      PersonnelSelectionChange(value, id) {
+        this.formInline[value] = id
+        this.formInline = { ...this.formInline }
+      },
+      handleOk() {
+        this.$refs.ruleForm.validate(valid => {
+          if (valid) {
+
+          }
+        })
+      },
+      handleCancel() {
+        this.visible = false
+      },
+      addData() {
+        this.formInline.dataList.push({
+          relatedSection: ''
+        })
+        this.formInline = { ...this.formInline }
+      },
+      deleteData() {
+        this.formInline.dataList.pop()
+        this.formInline = { ...this.formInline }
+      }
+    }
+  }
+</script>
+
+<style scoped>
+  .box-title-text {
+    line-height: 1.4;
+    display: flex;
+  }
+
+  .title-text {
+    width: 84px;
+    text-align: right;
+    display: inline-block;
+    font-weight: 500;
+    font-size: 14px;
+    margin-right: 16px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    height: 42px;
+    line-height: 42px;
+  }
+
+  .box-input {
+    display: inline-block;
+    height: 38px;
+    width: 100%;
+  }
+
+  .itemModel {
+    width: calc(100% - 130px);
+    display: inline-block;
+    margin-top: 2px;
+  }
+
+  .title-text-text {
+    margin-top: 9px;
+  }
+
+  .formAdd {
+    margin-bottom: 40px;
+  }
+
+  .Required {
+    color: red;
+    margin-right: 4px;
+  }
+
+  .icon-size {
+    font-size: 18px;
+    margin-top: 14px;
+    margin-right: 4px;
+  }
+</style>