Explorar o código

feat: 更新 ElIcons ...

lanceJiang hai 1 ano
pai
achega
6a722c052d

+ 1 - 1
src/components/registerGlobComp.ts

@@ -34,7 +34,7 @@ const compList = [
 
 export function registerGlobComp(app: App) {
 	Object.entries(ElementPlusIconsVue).map(([key, component]) => {
-		app.component(key, component)
+		app.component(`ElIcon${key}`, component)
 	})
 	compList.forEach(comp => {
 		// eslint-disable-next-line

+ 2 - 1
src/views/flow/create/components/BasicInfo.vue

@@ -71,7 +71,8 @@ defineExpose({
 		</template>-->
 		<el-form ref="formRef" :model="form" :rules="rules" label-position="top">
 			<el-form-item label="图标" prop="图标">
-				<scUpload v-model="form.图标" title="图标" />
+<!--				todo...-->
+<!--				<scUpload v-model="form.图标" title="图标" />-->
 			</el-form-item>
 			<el-form-item label="名称" prop="名称">
 				<el-input v-model="form.名称" clearable></el-input>

+ 34 - 60
src/views/flow/create/components/FormDesign.vue

@@ -7,36 +7,33 @@ defineProps({
 		type: String
 	}
 })
-
+import draggable from 'vuedraggable'
 </script>
 
 <template>
 	<el-tab-pane class="form-design-wrap" :label="label" :name="name">
-		<el-container>
+<!--		<el-container>
 			<el-aside width="400px">
-				<div effect="dark" style="background-color: white;margin-top: 0px;padding-top: 20px">
+				<div effect="dark" style="background-color: white; margin-top: 0px; padding-top: 20px">
 					<h4 style="text-align: center">组件库</h4>
-					<template v-for="(item,index) in oriFormList">
+					<template v-for="(item, index) in oriFormList">
 						<h5 style="padding-left: 60px">{{ item.name }}</h5>
 						<draggable
 							v-model="item.formList"
-							ghost-class="ghost" :force-fallback="true"
+							ghost-class="ghost"
+							:force-fallback="true"
 							item-key="index"
 							:sort="false"
-							@end="dragEnd"
-							@start="drag=true"
 							class="leftItem"
 							:animation="300"
 							:group="{ name: 'dragFormList', pull: 'clone', put: false }"
-
-							:clone='cloneFunc'
+							:clone="cloneFunc"
+							@end="dragEnd"
+							@start="drag = true"
 						>
-
 							<template #item="{ element }">
 								<div class="zj">
-									<el-button size="large" style="width: 100%" :icon="$icon[element.icon]"
-									>{{ element.name }}
-									</el-button>
+									<el-button size="large" style="width: 100%" :icon="$icon[element.icon]">{{ element.name }} </el-button>
 								</div>
 							</template>
 						</draggable>
@@ -44,21 +41,15 @@ defineProps({
 				</div>
 			</el-aside>
 			<el-main>
-				<div style="display: flex;flex-direction: row">
-
+				<div style="display: flex; flex-direction: row">
 					<div class="f11">
-						<div
-							class="drag-content"
-
-						>
-							<div style="text-align: center;font-size: 15px;font-weight: bold;margin-bottom: 20px">{{ flowName }}</div>
+						<div class="drag-content">
+							<div style="text-align: center; font-size: 15px; font-weight: bold; margin-bottom: 20px">{{ flowName }}</div>
 							<div class="drag-content-inner">
-
-
 								<el-form label-position="top">
 									<draggable
 										v-model="targetList"
-										style="min-height: 600px;background-color: var(--el-bg-color-page)"
+										style="min-height: 600px; background-color: var(&#45;&#45;el-bg-color-page)"
 										item-key="index"
 										:sort="true"
 										effect="dark"
@@ -66,36 +57,32 @@ defineProps({
 									>
 										<template #item="{ element, index }">
 											<div
-												class="okcomponent border line  " effect="dark"
-												:class="{'active-component':isCurrentForm(element.id)}"
+												class="okcomponent border line"
+												effect="dark"
+												:class="{ 'active-component': isCurrentForm(element.id) }"
 												@click.stop="showCurrentPageConfigPanel(element.id)"
 											>
-
-
-												<el-icon v-if="element.type!='Empty'" class="deleteIcon" @click.stop="deleteForm(element.id)">
-													<Delete/>
+												<el-icon v-if="element.type != 'Empty'" class="deleteIcon" @click.stop="deleteForm(element.id)">
+													<Delete />
 												</el-icon>
-												<el-form-item :label="step2Object[element.id]?.name"
-																			:required="step2Object[element.id]?.required">
-
-													<component style="width: 100%"
-																		 @showPanel="showPanel"
-																		 :index="index"
-																		 :is="getFormWidget(element.type)"
-																		 :id="element.id"
-																		 v-model:form="step2Object[element.id]"
+												<el-form-item :label="step2Object[element.id]?.name" :required="step2Object[element.id]?.required">
+													<component
+														:is="getFormWidget(element.type)"
+														:id="element.id"
+														v-model:form="step2Object[element.id]"
+														style="width: 100%"
+														:index="index"
+														@showPanel="showPanel"
 													></component>
 												</el-form-item>
-
 											</div>
 										</template>
 									</draggable>
 								</el-form>
 							</div>
 						</div>
-
 					</div>
-					<div class="f22" v-if="currentForm">
+					<div v-if="currentForm" class="f22">
 						<el-card class="box-card">
 							<template #header>
 								<div class="card-header">
@@ -104,38 +91,28 @@ defineProps({
 							</template>
 							<el-form label-width="120px" label-position="top">
 								<el-form-item required label="标题">
-									<el-input v-model="currentForm.name" maxlength="10"/>
+									<el-input v-model="currentForm.name" maxlength="10" />
 								</el-form-item>
 
-								<el-form-item label="提示" :required="currentForm.type==='Description'">
-									<el-input v-model="currentForm.placeholder" maxlength="50"/>
+								<el-form-item label="提示" :required="currentForm.type === 'Description'">
+									<el-input v-model="currentForm.placeholder" maxlength="50" />
 								</el-form-item>
 
-								<component
-									:is="getFormConfigWidget(currentForm.type)"
-									:id="currentForm.id"
-									ref="currentFormConfigRef"
-								></component>
+								<component :is="getFormConfigWidget(currentForm.type)" :id="currentForm.id" ref="currentFormConfigRef"></component>
 								<el-form-item label="其他">
-									<el-checkbox v-model="currentForm.required" label="必填"/>
+									<el-checkbox v-model="currentForm.required" label="必填" />
 								</el-form-item>
 							</el-form>
-
 						</el-card>
-
-
 					</div>
-
 				</div>
-
 			</el-main>
-		</el-container>
+		</el-container>-->
 	</el-tab-pane>
 </template>
 
 <style scoped lang="scss">
 .form-design-wrap {
-
 }
 .leftItem {
 	padding-left: 50px;
@@ -173,7 +150,6 @@ $center_width: 360px;
 
 .f22 {
 	width: $f22_width;
-
 }
 
 .okcomponent {
@@ -182,8 +158,6 @@ $center_width: 360px;
 	margin-bottom: 10px;
 	background-color: white;
 	border: 1px solid white;
-
-
 }
 
 .active-component {