添加标签宽度。

src/components/VueFormMaking/components/Container.vue

@@ -321,9 +321,6 @@ export default {
         }
       })
     },
-    handleGoGithub() {
-      window.location.href = 'https://github.com/GavinZhuLei/vue-form-making'
-    },
     handleConfigSelect(value) {
       this.configTab = value
     },

src/components/VueFormMaking/components/GenerateFormItem.vue

 <template>
   <el-form-item
-    :label-width="widget.type==='divider' || (widget.type==='text' && widget.options.textLabelStatus===false)?'0px':data.config.labelWidth + 'px'"
+    :label-width="widgetLabelWidth + 'px'"
     :label="widget.type==='divider' || (widget.type==='text' && widget.options.textLabelStatus===false)?'':widget.name"
     :prop="widget.model"
   >
@@ -249,6 +249,7 @@ export default {
   props: ['widget', 'models', 'rules', 'remote', 'data', 'disabled'],
   data() {
     return {
+      widgetLabelWidth: '',
       dataModel: this.models[this.widget.model]
     }
   },
@@ -295,6 +296,17 @@ export default {
     } else {
       this.widget.options.disabled = this.disabled
     }
+
+    // label width
+    if (this.widget.options.labelWidthDisabled) {
+      this.widgetLabelWidth = this.widget.options.labelWidth
+    } else if (this.widget.type==='grid' || 
+        this.widget.type==='divider' || 
+        (this.widget.type==='text' && this.widget.options.textLabelStatus===false)) {
+      this.widgetLabelWidth = 0
+    } else {
+      this.widgetLabelWidth = this.data.config.labelWidth
+    }
   },
   methods: {
   }

src/components/VueFormMaking/components/WidgetConfig.vue

 <template>
   <div v-if="show">
     <el-form label-position="top">
+      <!-- 字段标识 -->
       <el-form-item v-if="data.type!='grid'" :label="$t('fm.config.widget.model')">
         <el-input v-model="data.model" />
       </el-form-item>
+      <!-- 标题 -->
       <el-form-item v-if="data.type!=='grid' && data.type!=='divider'" :label="$t('fm.config.widget.name')">
         <el-input v-model="data.name" />
       </el-form-item>
+      <!-- 宽度 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('width')>=0" :label="$t('fm.config.widget.width')">
         <el-input v-model="data.options.width" />
       </el-form-item>
 
+      <!-- 兰玉磊开始添加 -->
+      <!-- 标签宽度 -->
+      <el-form-item
+        v-if="Object.keys(data.options).indexOf('labelWidth')>=0 &&
+          data.type!=='grid' &&
+          data.type !== 'divider'"
+        :label="$t('fm.config.widget.labelWidth')"
+      >
+        <el-checkbox v-model="data.options.labelWidthDisabled">自定义</el-checkbox>
+        <el-input-number v-model="data.options.labelWidth" :min="1" :disabled="!data.options.labelWidthDisabled" />
+      </el-form-item>
+      <!-- 兰玉磊结束添加 -->
+
+      <!-- 高度 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('height')>=0" :label="$t('fm.config.widget.height')">
         <el-input v-model="data.options.height" />
       </el-form-item>
-
+      <!-- 大小 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('size')>=0" :label="$t('fm.config.widget.size')">
         {{ $t('fm.config.widget.width') }} <el-input v-model.number="data.options.size.width" style="width: 90px;" type="number" />
         {{ $t('fm.config.widget.height') }} <el-input v-model.number="data.options.size.height" style="width: 90px;" type="number" />
       </el-form-item>
-
+      <!-- 占位内容 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('placeholder')>=0 && (data.type!='time' || data.type!='date')" :label="$t('fm.config.widget.placeholder')">
         <el-input v-model="data.options.placeholder" />
       </el-form-item>
+      <!-- 布局方式，块，行 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('inline')>=0" :label="$t('fm.config.widget.layout')">
         <el-radio-group v-model="data.options.inline">
           <el-radio-button :label="false">{{ $t('fm.config.widget.block') }}</el-radio-button>
           <el-radio-button :label="true">{{ $t('fm.config.widget.inline') }}</el-radio-button>
         </el-radio-group>
       </el-form-item>
+      <!-- 显示输入框 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('showInput')>=0" :label="$t('fm.config.widget.showInput')">
         <el-switch v-model="data.options.showInput" />
       </el-form-item>
+      <!-- 最小值 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('min')>=0" :label="$t('fm.config.widget.min')">
         <el-input-number v-model="data.options.min" :min="0" :max="100" :step="1" />
       </el-form-item>
+      <!-- 最大值 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('max')>=0" :label="$t('fm.config.widget.max')">
         <el-input-number v-model="data.options.max" :min="0" :max="100" :step="1" />
       </el-form-item>
+      <!-- 步长 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('step')>=0" :label="$t('fm.config.widget.step')">
         <el-input-number v-model="data.options.step" :min="0" :max="100" :step="1" />
       </el-form-item>
+      <!-- 是否多选 -->
       <el-form-item v-if="data.type=='select' || data.type=='imgupload'" :label="$t('fm.config.widget.multiple')">
         <el-switch v-model="data.options.multiple" @change="handleSelectMuliple" />
       </el-form-item>
+      <!-- 是否可搜索 -->
       <el-form-item v-if="data.type=='select'" :label="$t('fm.config.widget.filterable')">
         <el-switch v-model="data.options.filterable" />
       </el-form-item>
+      <!-- 允许半选 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('allowHalf')>=0" label="$t('fm.config.widget.allowHalf')">
         <el-switch
           v-model="data.options.allowHalf"
         />
       </el-form-item>
+      <!-- 支持透明度选择 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('showAlpha')>=0" :label="$t('fm.config.widget.showAlpha')">
         <el-switch
           v-model="data.options.showAlpha"
         />
       </el-form-item>
+      <!-- 是否显示标签 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('showLabel')>=0" :label="$t('fm.config.widget.showLabel')">
         <el-switch
           v-model="data.options.showLabel"
         />
       </el-form-item>
+      <!-- 选项 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('options')>=0" :label="$t('fm.config.widget.option')">
         <el-radio-group v-model="data.options.remote" size="mini" style="margin-bottom:10px;">
           <el-radio-button :label="false">{{ $t('fm.config.widget.staticData') }}</el-radio-button>
@@ -137,7 +165,7 @@
         </template>
 
       </el-form-item>
-
+      <!-- 级联选择器 -->
       <el-form-item v-if="data.type=='cascader'" :label="$t('fm.config.widget.remoteData')">
         <div>
           <el-input v-model="data.options.remoteFunc" size="mini" style="">
@@ -154,7 +182,7 @@
           </el-input>
         </div>
       </el-form-item>
-
+      <!-- 默认值 -->
       <el-form-item v-if="Object.keys(data.options).indexOf('defaultValue')>=0 && (data.type == 'textarea' || data.type == 'input' || data.type=='rate' || data.type=='color' || data.type=='switch')" :label="$t('fm.config.widget.defaultValue')">
         <el-input v-if="data.type=='textarea'" v-model="data.options.defaultValue" type="textarea" :rows="5" />
         <el-input v-if="data.type=='input'" v-model="data.options.defaultValue" />
@@ -167,7 +195,7 @@
         />
         <el-switch v-if="data.type=='switch'" v-model="data.options.defaultValue" />
       </el-form-item>
-
+      <!-- 显示类型 -->
       <template v-if="data.type == 'time' || data.type == 'date'">
         <el-form-item v-if="data.type == 'date'" :label="$t('fm.config.widget.showType')">
           <el-select v-model="data.options.type">
@@ -223,7 +251,7 @@
           />
         </el-form-item>
       </template>
-
+      <!-- 图片上传 -->
       <template v-if="data.type=='imgupload'">
 
         <el-form-item :label="$t('fm.config.widget.limit')">
@@ -246,7 +274,7 @@
           </el-form-item>
         </template>
       </template>
-
+      <!-- 多行文本 -->
       <template v-if="data.type==='text'">
         <el-form-item label="文字内容">
           <el-input v-model="data.options.defaultValue" placeholder="请输入文字内容" />
@@ -270,7 +298,7 @@
           </el-radio-group>
         </el-form-item>
       </template>
-
+      <!-- 分割符 -->
       <template v-if="data.type==='divider'">
         <el-form-item label="文字内容">
           <el-input v-model="data.options.defaultValue" placeholder="请输入文字内容" />
@@ -311,7 +339,7 @@
           </el-select>
         </el-form-item>
       </template>
-
+      <!-- 珊格 -->
       <template v-if="data.type == 'grid'">
         <el-form-item :label="$t('fm.config.widget.gutter')">
           <el-input v-model.number="data.options.gutter" type="number" />
@@ -352,7 +380,7 @@
           </el-select>
         </el-form-item>
       </template>
-
+      <!-- 非珊格 -->
       <template v-if="data.type != 'grid'">
         <el-form-item :label="$t('fm.config.widget.attribute')">
           <el-checkbox v-if="Object.keys(data.options).indexOf('readonly')>=0" v-model="data.options.readonly">{{ $t('fm.config.widget.readonly') }}</el-checkbox>

src/components/VueFormMaking/components/WidgetForm.vue

@@ -13,6 +13,7 @@
 
         <transition-group name="fade" tag="div" class="widget-form-list">
           <template v-for="(element, index) in data.list">
+            <!-- 珊格 -->
             <template v-if="element.type == 'grid'">
               <el-row
                 v-if="element && element.key"

src/components/VueFormMaking/components/WidgetFormItem.vue

 <template>
   <el-form-item
     v-if="element && element.key"
-    :label-width="element.type==='divider' || (element.type==='text' && element.options.textLabelStatus===false)?'0px':dataConfig.config.labelWidth + 'px'"
+    :label-width="elementLabelWidth + 'px'"
     class="widget-view "
     :class="{active: selectWidget.key === element.key, 'is_req': element.options.required}"
     :label="element.type==='divider' || (element.type==='text' && element.options.textLabelStatus===false)?'':element.name"
@@ -239,6 +239,7 @@ export default {
   props: ['element', 'select', 'index', 'data', 'dataConfig'],
   data() {
     return {
+      elementLabelWidth: '',
       selectWidget: this.select
     }
   },
@@ -251,12 +252,31 @@ export default {
         this.$emit('update:select', val)
       },
       deep: true
+    },
+    'element.options.labelWidth': function (val) {
+      this.elementLabelWidth = val
+    },
+    'element.options.labelWidthDisabled': function (val) {
+      this.setLabelWidth(val)
     }
   },
   mounted() {
-
+    this.setLabelWidth()
   },
   methods: {
+    setLabelWidth(status) {
+      if (status === undefined) {
+        status = this.element.options.labelWidthDisabled
+      }
+      if (status) {
+        this.elementLabelWidth = this.element.options.labelWidth
+      } else if (this.element.type==='grid' || this.element.type==='divider' || (this.element.type==='text' && element.options.textLabelStatus===false)) {
+        this.elementLabelWidth = 0
+      } else {
+        // 全局
+        this.elementLabelWidth = this.dataConfig.config.labelWidth
+      }
+    },
     handleSelectWidget(index) {
       this.selectWidget = this.data.list[index]
     },

src/components/VueFormMaking/components/componentsConfig.js

@@ -9,7 +9,9 @@ export const basicComponents = [
       dataType: 'string',
       pattern: '',
       placeholder: '',
-      disabled: false
+      disabled: false,
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -21,7 +23,9 @@ export const basicComponents = [
       required: false,
       disabled: false,
       pattern: '',
-      placeholder: ''
+      placeholder: '',
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -35,7 +39,9 @@ export const basicComponents = [
       max: '',
       step: 1,
       disabled: false,
-      controlsPosition: ''
+      controlsPosition: '',
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -68,7 +74,9 @@ export const basicComponents = [
         label: 'label'
       },
       remoteFunc: '',
-      disabled: false
+      disabled: false,
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -98,7 +106,9 @@ export const basicComponents = [
         label: 'label'
       },
       remoteFunc: '',
-      disabled: false
+      disabled: false,
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -117,7 +127,9 @@ export const basicComponents = [
       arrowControl: true,
       format: 'HH:mm:ss',
       required: false,
-      width: ''
+      width: '',
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -136,7 +148,9 @@ export const basicComponents = [
       format: 'yyyy-MM-dd',
       timestamp: false,
       required: false,
-      width: ''
+      width: '',
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -147,7 +161,9 @@ export const basicComponents = [
       max: 5,
       disabled: false,
       allowHalf: false,
-      required: false
+      required: false,
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -157,7 +173,9 @@ export const basicComponents = [
       defaultValue: '',
       disabled: false,
       showAlpha: false,
-      required: false
+      required: false,
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -189,7 +207,9 @@ export const basicComponents = [
         value: 'value',
         label: 'label'
       },
-      remoteFunc: ''
+      remoteFunc: '',
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -198,7 +218,9 @@ export const basicComponents = [
     options: {
       defaultValue: false,
       required: false,
-      disabled: false
+      disabled: false,
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -213,7 +235,9 @@ export const basicComponents = [
       step: 1,
       showInput: false,
       range: false,
-      width: ''
+      width: '',
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -226,7 +250,9 @@ export const basicComponents = [
       font_family: '', // 字体属性
       defaultValue: 'This is a text',
       textLabelStatus: true,
-      customClass: ''
+      customClass: '',
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   }
 ]
@@ -236,7 +262,9 @@ export const advanceComponents = [
     type: 'blank',
     icon: 'icon-zidingyishuju',
     options: {
-      defaultType: 'String'
+      defaultType: 'String',
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -259,7 +287,9 @@ export const advanceComponents = [
       isDelete: false,
       min: 0,
       isEdit: false,
-      action: 'https://jsonplaceholder.typicode.com/photos/'
+      action: 'https://jsonplaceholder.typicode.com/photos/',
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -267,7 +297,9 @@ export const advanceComponents = [
     icon: 'icon-fuwenbenkuang',
     options: {
       defaultValue: '',
-      width: ''
+      width: '',
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   },
   {
@@ -286,7 +318,9 @@ export const advanceComponents = [
         label: 'label',
         children: 'children'
       },
-      remoteFunc: ''
+      remoteFunc: '',
+      labelWidth: 100,
+      labelWidthDisabled: false
     }
   }
 ]

src/components/VueFormMaking/iconfont/demo_index.html

@@ -742,7 +742,7 @@
         <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
 <pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
 </code></pre>
-        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
+        <h3>第二步：挑选相应图标并获取类名，应用于页面：</h3>
 <pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
 </code></pre>
         <blockquote>
@@ -1126,7 +1126,7 @@
 }
 &lt;/style&gt;
 </code></pre>
-          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
+          <h3>第三步：挑选相应图标并获取类名，应用于页面：</h3>
 <pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
   &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
 &lt;/svg&gt;

src/views/login/index.vue

@@ -189,7 +189,6 @@ export default {
               this.getCode()
             })
         } else {
-          console.log('error submit!!')
           return false
         }
       })

src/views/process/admin/process-manager.vue

@@ -329,7 +329,6 @@ export default {
     },
     verifyProcess() {
       this.ruleForm.structure = this.$refs.wfd.graph.save()
-      console.log(this.ruleForm.structure)
       for (var r of this.ruleForm.structure.nodes) {
         if (r.sort === undefined || r.sort === null || r.sort === '') {
           return '流程节点顺序不能为空'
@@ -376,7 +375,6 @@ export default {
     },
     editForm(formName) {
       var r = this.verifyProcess()
-      console.log(r)
       if (r !== '') {
         this.$message.error(r)
         return

src/views/process/admin/template-manager.vue

@@ -195,7 +195,6 @@ export default {
       this.listQuery.per_page = this.queryParams.pageSize
       templateList(this.listQuery).then(response => {
         this.tplList = response.data.data
-        console.log(this.tplList)
         this.queryParams.pageIndex = response.data.page
         this.queryParams.pageSize = response.data.per_page
         this.total = response.data.total_count

src/views/process/list/apply-process-list.vue

@@ -59,7 +59,6 @@ export default {
       })
     },
     handleQuery() {
-      console.log(this.listQuery)
       this.getProcessList()
     },
     submitWorkOrder(processId) {

src/views/system/role/index.vue

@@ -464,7 +464,6 @@ export default {
     submitDataScope: function() {
       if (this.form.roleId !== undefined) {
         this.form.deptIds = this.getDeptAllCheckedKeys()
-        console.log(this.getDeptAllCheckedKeys())
         dataScope(this.form).then(response => {
           if (response.code === 200) {
             this.msgSuccess('修改成功')