cnhis-design-vue 2.1.65 → 2.1.66

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cnhis-design-vue",
-  "version": "2.1.65",
+  "version": "2.1.66",
   "description": "前端业务UI库",
   "keyword": "cnhis-design-vue vue cnhis",
   "homepage": "http://dv.cnhis.com/",

package/packages/scale-view/formitem/r-choice.vue

@@ -6,18 +6,20 @@
       @change="radioChange"
       class="choice-wrap"
       :class="['choice-wrap-' + (item.setting.chooseStyleSetting || 1)]"
+    >
+    <div
+      v-for="(o, i) in curOptions"
+      :key="o.key + i + o.label"
+      class="choice-radio-div"
     >
       <a-radio
-        v-for="(o, i) in curOptions"
         class="choice-radio"
         :value="o[choiceUseKey]"
-        :key="o.key + i + o.label"
-        :class="{ 'block-radio': !item.setting.isHorizontal }"
         :disabled="isLock"
         :style="{ color: choiceColor(o) }"
       >
         <template v-if="showImgWrap(o)">
-          <span class="scale-choice-img-wrap">
+          <span class="scale-choice-img-wrap" @click.stop.prevent>
             <img class="show-picture" :src="o.imageUrl" />
             <div class="scale-preview-wrap">
               <a-icon type="zoom-in" @click.stop.prevent="handlePreview(o.imageUrl, i)" />
@@ -55,6 +57,7 @@
           />
         </template>
       </a-radio>
+    </div>
     </a-radio-group>
     <a-checkbox-group
       v-else-if="item.type == 'CHECKBOX_BLOCK' || item.type === 'EVALUATE_CHECKBOX_BLOCK'"
@@ -63,58 +66,61 @@
       class="choice-wrap"
       :class="['choice-wrap-' + (item.setting.chooseStyleSetting || 1)]"
     >
-      <a-checkbox
-        class="choice-checkbox"
+      <div
         v-for="(o, i) in curOptions"
         :key="o.key + i + o.label"
-        :value="o[choiceUseKey]"
-        :class="{ 'block-checkbox': !item.setting.isHorizontal }"
-        :disabled="isLock"
-        :style="{ color: choiceColor(o) }"
+        class="choice-radio-div"
       >
-        <template v-if="showImgWrap(o)">
-          <span class="scale-choice-img-wrap">
-            <img class="show-picture" :src="o.imageUrl" />
-            <div class="scale-preview-wrap">
-              <a-icon type="zoom-in" @click.stop.prevent="handlePreview(o.imageUrl, i)" />
-            </div>
-          </span>
-        </template>
-        <template>
-          <template v-if="isCheckboxItem && showPreSuffix(o)">
+        <a-checkbox
+          class="choice-checkbox"
+          :value="o[choiceUseKey]"
+          :disabled="isLock"
+          :style="{ color: choiceColor(o) }"
+        >
+          <template v-if="showImgWrap(o)">
+            <span class="scale-choice-img-wrap" @click.stop.prevent>
+              <img class="show-picture" :src="o.imageUrl" />
+              <div class="scale-preview-wrap">
+                <a-icon type="zoom-in" @click.stop.prevent="handlePreview(o.imageUrl, i)" />
+              </div>
+            </span>
+          </template>
+          <template>
+            <template v-if="isCheckboxItem && showPreSuffix(o)">
+              <span
+                v-if="o.prefix"
+                class="prefix-span"
+                :style="{ color: choiceColor(o) }"
+              >{{ o.prefix }}</span>
+              <a-input
+                v-model="optionsPreSuffixObj[o.key]"
+                :disabled="isLock || inputLock"
+                @change="inputPreSuffixCheckboxChange(o, i)"
+                :style="{ color: choiceColor(o) }"
+                placeholder="请输入"
+              />
+              <span
+                v-if="o.suffix"
+                class="suffix-span"
+                :style="{ color: choiceColor(o) }"
+              >{{ o.suffix }}</span>
+            </template>
             <span
-              v-if="o.prefix"
-              class="prefix-span"
+              v-else
+              style="white-space: initial;"
               :style="{ color: choiceColor(o) }"
-            >{{ o.prefix }}</span>
+            >{{ o.label }}</span>
             <a-input
-              v-model="optionsPreSuffixObj[o.key]"
+              v-if="o.importability"
+              v-model="othersText"
               :disabled="isLock || inputLock"
-              @change="inputPreSuffixCheckboxChange(o, i)"
               :style="{ color: choiceColor(o) }"
+              @change="inputCheckboxChange"
               placeholder="请输入"
             />
-            <span
-              v-if="o.suffix"
-              class="suffix-span"
-              :style="{ color: choiceColor(o) }"
-            >{{ o.suffix }}</span>
           </template>
-          <span
-            v-else
-            style="white-space: initial;"
-            :style="{ color: choiceColor(o) }"
-          >{{ o.label }}</span>
-          <a-input
-            v-if="o.importability"
-            v-model="othersText"
-            :disabled="isLock || inputLock"
-            :style="{ color: choiceColor(o) }"
-            @change="inputCheckboxChange"
-            placeholder="请输入"
-          />
-        </template>
-      </a-checkbox>
+        </a-checkbox>
+      </div>
     </a-checkbox-group>
     <a-select
       v-else-if="cloneItem.type == 'SELECT' || item.type === 'EVALUATE_SELECT'"
@@ -163,7 +169,7 @@
  *  getSearchOptions 关键字检索的 function
  *  getCascadeOptions 获取级联数据的 furnction
  */
-import { Select, Input, Radio, Checkbox, Cascader } from 'ant-design-vue';
+import { Select, Input, Radio, Checkbox, Cascader, Icon } from 'ant-design-vue';
 import { judgeTypes } from '../mixin/judgeTypes';
 // import format from "@/components/table/mixins/format";
 // import TextOverTooltip from "./text-over-tooltip/TextOverTooltip.vue";
@@ -195,6 +201,7 @@ export default {
   },
   components: {
     Viewer,
+    [Icon.name]: Icon,
     [Input.name]: Input,
     [Cascader.name]: Cascader,
     [Checkbox.name]: Checkbox,
@@ -611,7 +618,6 @@ export default {
     margin-right: 8px;
     margin-left: 0px;
     > span:last-child {
-      flex: 1;
       display: inline-flex;
       align-items: center;
       word-break: break-all;
@@ -631,12 +637,6 @@ export default {
       padding-left: 8px;
     }
   }
-
-  /deep/ .block-radio,
-  /deep/ .block-checkbox {
-    display: flex;
-    margin-left: 8px;
-  }
   /deep/ .ant-select {
     min-width: 160px;
   }
@@ -647,6 +647,11 @@ export default {
     top: 0px !important;
     left: 1px !important;
   }
+  .choice-radio-div {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+  }
   .choice-wrap {
     display: flex;
     flex-wrap: wrap;
@@ -699,19 +704,19 @@ export default {
       align-items: center;
       white-space: initial;
     }
-    &.choice-wrap-1 label {
+    &.choice-wrap-1 .choice-radio-div {
       width: 100%;
       /deep/ input {
         max-width: 300px;
       }
     }
-    &.choice-wrap-2 label {
+    &.choice-wrap-2 .choice-radio-div {
       width: 50%;
     }
-    &.choice-wrap-3 label {
+    &.choice-wrap-3 .choice-radio-div {
       width: 33%;
     }
-    &.choice-wrap-4 label {
+    &.choice-wrap-4 .choice-radio-div {
       width: 25%;
     }
     /deep/ .ant-checkbox {