表单只读

src/Dynamic/ConfigRenderComponent/DForm/FormItem/DCheckbox.vue

@@ -2,7 +2,7 @@
  * @Author: zong.wang01@hand-china.com
  * @Date: 2024-08-01 09:55:12
  * @LastEditors: zong.wang01@hand-china.com
- * @LastEditTime: 2024-08-13 15:47:01
+ * @LastEditTime: 2024-08-14 10:29:59
  * @Version: 1.0.0
  * @Description: 动态渲染-复选框组件
  * @Copyright: Copyright (c) 2021, Hand-RongJing
@@ -86,7 +86,7 @@ export default {
   },
   methods: {
     checked (flag) {
-      if (!this.disable) {
+      if (!this.disabled) {
         this.$emit('input', flag)
         this.$emit('change', flag)
       }
@@ -96,5 +96,5 @@ export default {
 </script>
 
 <style lang="less">
-@import './index.less';
+// @import './index.less';
 </style>

src/Dynamic/ConfigRenderComponent/DForm/FormItem/DDate.vue

@@ -2,7 +2,7 @@
  * @Author: zong.wang01@hand-china.com
  * @Date: 2024-08-01 09:55:12
  * @LastEditors: zong.wang01@hand-china.com
- * @LastEditTime: 2024-08-14 09:29:36
+ * @LastEditTime: 2024-08-14 10:31:08
  * @Version: 1.0.0
  * @Description: 动态渲染-日期组件
  * @Copyright: Copyright (c) 2021, Hand-RongJing
@@ -21,7 +21,7 @@
     <van-field
       readonly
       v-model="currentValue"
-      placeholder="请选择"
+      :placeholder="disabled ? '' : '请选择'"
       :name="name"
       :disabled="disabled"
       :required="required"
@@ -30,9 +30,9 @@
       :error="false"
     >
       <d-label :label="label" :help="help" slot="label" />
-      <template slot="right-icon" >
+      <template slot="right-icon">
         <van-icon name="clear" v-show="!disabled && clearable && currentValue" @click="clear"/>
-        <img src="../../../assets/date-icon.png" alt="" class="right-icon"/>
+        <img src="../../../assets/date-icon.png" alt="" class="right-icon" v-show="!disabled"/>
       </template>
     </van-field>
 

src/Dynamic/ConfigRenderComponent/DForm/FormItem/DField.vue

@@ -2,7 +2,7 @@
  * @Author: zong.wang01@hand-china.com
  * @Date: 2024-08-01 09:55:12
  * @LastEditors: zong.wang01@hand-china.com
- * @LastEditTime: 2024-08-13 15:46:33
+ * @LastEditTime: 2024-08-14 10:57:14
  * @Version: 1.0.0
  * @Description: 动态渲染-文本框组件
  * @Copyright: Copyright (c) 2021, Hand-RongJing
@@ -11,7 +11,7 @@
 <div class="d-form-item">
   <van-field 
     v-model="currentValue"
-    placeholder="请输入"
+    :placeholder="disabled ? '' : '请选择'"
     @input="fieldInput"
     :name="name"
     :type="fieldType[type]"
@@ -21,6 +21,8 @@
     :formatter="formatter"
     :rules="[{ required, message: `请输入${label}` }]"
     :error="false"
+    :class="type === 'TextArea' ? 'd-form-textarea' : ''"
+    clear-trigger="always"
   >
     <d-label :label="label" :help="help" slot="label" />
     <span slot="extra" v-if="type === 'CentField'">%</span>
@@ -115,5 +117,5 @@ export default {
 </script>
 
 <style lang="less">
-@import './index.less';
+// @import './index.less';
 </style>

src/Dynamic/ConfigRenderComponent/DForm/FormItem/DLov.vue

@@ -2,7 +2,7 @@
  * @Author: zong.wang01@hand-china.com
  * @Date: 2024-08-01 09:55:12
  * @LastEditors: zong.wang01@hand-china.com
- * @LastEditTime: 2024-08-14 09:28:23
+ * @LastEditTime: 2024-08-14 10:26:23
  * @Version: 1.0.0
  * @Description: 动态渲染-Lov
  * @Copyright: Copyright (c) 2021, Hand-RongJing
@@ -34,13 +34,13 @@
     <d-label :label="label" :help="help" slot="label" />
     <template #input>
       <div @click="changeVisible(true)" class="cell-value">
-        <span v-if="!currentValue || currentValue.length === 0" class="placeholder">请选择</span>
+        <span v-if="!currentValue || currentValue.length === 0" class="placeholder">{{disabled ? '' : '请选择'}}</span>
         <span v-else>{{valueDisplay()}}</span>
       </div>
     </template>
     <template slot="right-icon" >
       <van-icon name="clear" v-show="!disabled && clearable && !(!currentValue || currentValue.length === 0)" @click="clear"/>
-      <van-icon name="arrow" />
+      <van-icon name="arrow" v-show="!disabled" />
     </template>
   </van-field>
 
@@ -271,7 +271,7 @@ export default {
 </script>
 
 <style lang="less">
-@import './index.less';
+// @import './index.less';
 .d-lov-popup {
   display: flex;
   flex-direction: column;

src/Dynamic/ConfigRenderComponent/DForm/FormItem/DSelect.vue

@@ -2,7 +2,7 @@
  * @Author: zong.wang01@hand-china.com
  * @Date: 2024-08-01 09:55:12
  * @LastEditors: zong.wang01@hand-china.com
- * @LastEditTime: 2024-08-14 09:28:54
+ * @LastEditTime: 2024-08-14 11:01:18
  * @Version: 1.0.0
  * @Description: 动态渲染-Select
  * @Copyright: Copyright (c) 2021, Hand-RongJing
@@ -32,13 +32,13 @@
     <d-label :label="label" :help="help" slot="label" />
     <template #input>
       <div @click="showSelectOption(true)" class="cell-value">
-        <span v-if="!(currentValue.length || currentValue.meaning)" class="placeholder">请选择</span>
+        <span v-if="!(currentValue.length || currentValue.meaning)" class="placeholder">{{disabled ? '' : '请选择'}}</span>
         <span v-else>{{valueDisplay()}}</span>
       </div>
     </template>
     <template slot="right-icon" >
       <van-icon name="clear" v-show="!disabled && clearable && (currentValue.length || currentValue.meaning)" @click="clear"/>
-      <van-icon name="arrow" />
+      <van-icon name="arrow" v-show="!disabled"/>
     </template>
   </van-field>
 
@@ -207,7 +207,10 @@ export default {
     },
     selectOption(val, index) {
       if (!this.multiple) {
-        this.options = this.options.map(o => ({...o, _selected: false}))
+        this.options = this.options.map(o => ({...o, _selected: false}));
+        this.currentValue = val;
+        this.inputValue(this.currentValue.value);
+        this.showSelectOption(false);
       }
       this.$set(this.options[index], '_selected', !this.options[index]._selected);
     },
@@ -228,7 +231,7 @@ export default {
 </script>
 
 <style lang="less">
-@import './index.less';
+@import '../../../index.less';
 .d-select-popup {
   max-height: 60%;
   .title{

src/Dynamic/ConfigRenderComponent/DForm/FormItem/DSwitch.vue

@@ -2,7 +2,7 @@
  * @Author: zong.wang01@hand-china.com
  * @Date: 2024-08-01 09:55:12
  * @LastEditors: zong.wang01@hand-china.com
- * @LastEditTime: 2024-08-13 15:48:06
+ * @LastEditTime: 2024-08-14 10:30:25
  * @Version: 1.0.0
  * @Description: 动态渲染-开关组件
  * @Copyright: Copyright (c) 2021, Hand-RongJing
@@ -85,7 +85,7 @@ export default {
   },
   methods: {
     checked (flag) {
-      if (!this.disable) {
+      if (!this.disabled) {
         this.$emit('input', flag ? 1 : 0);
         this.$emit('change', flag ? 1 : 0);
       }
@@ -95,5 +95,5 @@ export default {
 </script>
 
 <style lang="less">
-@import './index.less';
+// @import './index.less';
 </style>

src/Dynamic/ConfigRenderComponent/DForm/FormItem/DUrl.vue

@@ -2,7 +2,7 @@
  * @Author: zong.wang01@hand-china.com
  * @Date: 2024-08-01 09:55:12
  * @LastEditors: zong.wang01@hand-china.com
- * @LastEditTime: 2024-08-11 10:44:31
+ * @LastEditTime: 2024-08-14 10:30:30
  * @Version: 1.0.0
  * @Description: 动态渲染-超链接组件
  * @Copyright: Copyright (c) 2021, Hand-RongJing
@@ -63,18 +63,12 @@ export default {
     }
   },
   methods: {
-    checked (flag) {
-      if (!this.disable) {
-        this.$emit('input', flag)
-        this.$emit('change', flag)
-      }
-    },
   },
 }
 </script>
 
 <style lang="less">
-  @import './index.less';
+  // @import './index.less';
 
   .d-url {
     padding: 6px 14px;

src/Dynamic/ConfigRenderComponent/DForm/FormItem/index.less

@@ -3,12 +3,12 @@
 
 .d-form-item {
   position: relative;
-  .value-input {
-    text-align: right;
-    &::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
-      color: #B4B4B5;
-    }
-  }
+  // .value-input {
+  //   text-align: right;
+  //   &::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
+  //     color: #B4B4B5;
+  //   }
+  // }
   .placeholder {
     text-align: right;
     color: #B4B4B5;
@@ -21,21 +21,32 @@
     .right-icon {
       width: 16px;
     }
-    .value-input {
-      text-align: right;
-      &::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
-        color: #B4B4B5;
-      }
+    // .value-input {
+    //   text-align: right;
+    //   &::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
+    //     color: #B4B4B5;
+    //   }
+    // }
+  }
+  .d-form-textarea { // 文本域
+    display: flex;
+    flex-direction: column;
+    .van-field__control {
+      text-align: left;
     }
   }
   .van-icon {
     color: #B4B4B5;
   }
   .van-cell__title {
-    min-width: 40%;
+    // min-width: 40%;
+    max-width: 50%;
+    width: auto;
   }
-  .van-field--disabled .van-cell__title {
-    color: #c8c9cc;
+  .van-field--disabled {
+    .cell-value {
+      color: #656262;
+    }
   }
 
   .van-field__right-icon {
@@ -60,5 +71,5 @@
     border-bottom: 1px solid #ebedf0;
     -webkit-transform: scaleY(.5);
     transform: scaleY(.5);
-}
+  }
 }
\ No newline at end of file

src/Dynamic/index.vue

@@ -2,7 +2,7 @@
  * @Author: zong.wang01@hand-china.com
  * @Date: 2024-07-29 10:51:56
  * @LastEditors: zong.wang01@hand-china.com
- * @LastEditTime: 2024-08-13 13:02:20
+ * @LastEditTime: 2024-08-14 10:48:44
  * @Version: 1.0.0
  * @Description: 
  * @Copyright: Copyright (c) 2021, Hand-RongJing
@@ -80,7 +80,7 @@ export default {
     };
   },
   created() {
-    window.localStorage.setItem('access_token', '5d974657-7d25-4a4a-8195-6266f308a863');
+    window.localStorage.setItem('access_token', 'eee48cb3-3db0-4a82-99dd-3168b9610a8c');
     this.params = {
       ...this.$route.params,
       ...this.$route.query

src/global.less

@@ -10,6 +10,8 @@
 
 // field
 @field-error-message-color: #FF4837;
+@field-input-disabled-text-color: #656262;
+@field-disabled-text-color: rgba(101, 102, 102, 0.804);
 
 // picker组件
 @text-link-color: @primary-color;