From 8d7b4ba60070e78fe497ec5d5a0abe80caec9b86 Mon Sep 17 00:00:00 2001 From: heimawl <1785969728@qq.com> Date: 星期一, 12 六月 2023 09:57:03 +0800 Subject: [PATCH] 完成宣教、问卷路由设置、问卷模块页面及其添加/修改页面部分布局开发 --- src/assets/styles/variables.scss | 2 src/views/knowledge/questionnaire/compilequer/index.vue | 710 +++++++++++++++++++++++++++ src/views/knowledge/questionnaire/examine/index.vue | 21 src/views/knowledge/education/index.vue | 17 src/views/knowledge/questionnaire/index.vue | 761 +++++++++++++++++++++++++++++ src/store/modules/settings.js | 2 6 files changed, 1,511 insertions(+), 2 deletions(-) diff --git a/src/assets/styles/variables.scss b/src/assets/styles/variables.scss index 550e1db..431299d 100644 --- a/src/assets/styles/variables.scss +++ b/src/assets/styles/variables.scss @@ -20,7 +20,7 @@ $base-menu-light-background:#ffffff; $base-logo-light-title-color: #001529; -$base-sub-menu-background:#82afe4; +$base-sub-menu-background:#81bcec; $base-sub-menu-hover:#001528; // 鑷畾涔夋殫鑹茶彍鍗曢鏍� diff --git a/src/store/modules/settings.js b/src/store/modules/settings.js index 55ac682..61c197c 100644 --- a/src/store/modules/settings.js +++ b/src/store/modules/settings.js @@ -5,7 +5,7 @@ const storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || '' const state = { title: '', - theme: storageSetting.theme || '#5aecd9', + theme: storageSetting.theme , sideTheme: storageSetting.sideTheme || sideTheme, showSettings: showSettings, topNav: storageSetting.topNav === undefined ? topNav : storageSetting.topNav, diff --git a/src/views/knowledge/education/index.vue b/src/views/knowledge/education/index.vue new file mode 100644 index 0000000..3dc5259 --- /dev/null +++ b/src/views/knowledge/education/index.vue @@ -0,0 +1,17 @@ +<template> + <div>瀹f暀绠$悊</div> +</template> + +<script> +export default { + data() { + return {}; + }, + + created() {}, + + methods: {}, +}; +</script> + +<style lang="scss" scoped></style> diff --git a/src/views/knowledge/questionnaire/compilequer/index.vue b/src/views/knowledge/questionnaire/compilequer/index.vue new file mode 100644 index 0000000..2bb899e --- /dev/null +++ b/src/views/knowledge/questionnaire/compilequer/index.vue @@ -0,0 +1,710 @@ +<template> + <div class="Questionnairemanagement"> + <!-- 宸︿晶鏍� --> + <div class="sidecolumn"> + <div style="height: 400px"> + <el-steps direction="vertical" :active="Editprogress"> + <el-step title="鍩虹淇℃伅璁剧疆"></el-step> + <el-step title="闂嵎璁剧疆"></el-step> + <el-step + title="闂嵎棰勮" + description="杩欐槸涓�娈靛緢闀垮緢闀垮緢闀跨殑鎻忚堪鎬ф枃瀛�" + ></el-step> + <el-step + title="缁撴灉鍙嶉" + description="杩欐槸涓�娈靛緢闀垮緢闀垮緢闀跨殑鎻忚堪鎬ф枃瀛�" + ></el-step> + </el-steps> + </div> + </div> + <!-- 鍙充晶鏁版嵁 --> + <div class="leftvlue"> + <div v-if="Editprogress == 1"> + <div class="leftvlue-jbxx"> + 鍩烘湰淇℃伅<span>褰撳墠鐗堟湰:{{ currentVersion }}</span> + </div> + <el-form + :model="ruleForm" + :rules="rules" + ref="ruleForm" + label-width="100px" + class="demo-ruleForm" + > + <el-form-item label="娲诲姩鍚嶇О" prop="name"> + <el-input v-model="ruleForm.name"></el-input> + </el-form-item> + <el-form-item label="娲诲姩鍖哄煙" prop="region"> + <el-select + v-model="ruleForm.region" + size="medium" + multiple + filterable + placeholder="璇烽�夋嫨娲诲姩鍖哄煙" + > + <el-option + class="ruleFormaa" + v-for="item in options" + :key="item.value" + :label="item.label" + :value="item.value" + > + </el-option> + </el-select> + </el-form-item> + <el-form-item label="娲诲姩褰㈠紡" prop="desc"> + <el-input + :rows="4" + type="textarea" + v-model="ruleForm.desc" + ></el-input> + </el-form-item> + <el-form-item> + <el-button type="success" @click="submitForm('ruleForm')" + >涓嬩竴姝�</el-button + > + <el-button @click="resetForm('ruleForm')">閲嶇疆</el-button> + </el-form-item> + </el-form> + </div> + <div v-if="Editprogress == 2"> + <div class="leftvlue-jbxx">闂嵎璁剧疆</div> + <el-form + :model="ruleForm" + :rules="rules" + ref="ruleForm" + label-width="100px" + class="demo-ruleForm" + > + <el-form-item label="闂嵎浠嬬粛" prop="desc"> + <el-cascader + class="demo-cascader" + v-model="ruleForm.templatevalue" + :options="options" + :props="{ expandTrigger: 'hover' }" + @change="handleChange" + ></el-cascader> + <el-select v-model="ruleForm.data2" placeholder="鎻愪氦鎻愮ず"> + <el-option + v-for="item in options" + :key="item.value" + :label="item.label" + :value="item.value" + > + </el-option> + </el-select> + <dev class="PreviewTemplate" @click="PreviewTemplate()" + >棰勮妯$増</dev + > + <el-button type="primary">纭寮曠敤</el-button> + </el-form-item> + <el-form-item label="娲诲姩褰㈠紡" prop="desc"> + <el-input type="textarea" v-model="ruleForm.desc"></el-input> + </el-form-item> + <el-form-item label="娲诲姩褰㈠紡" prop="desc"> + <el-input type="textarea" v-model="ruleForm.desc"></el-input> + </el-form-item> + <el-form-item> + <el-button type="success" @click="submitForm('ruleForm')" + >涓嬩竴姝�</el-button + > + <el-button type="primary" @click="laststep()">涓婁竴姝�</el-button> + <el-button @click="resetForm('ruleForm')">閲嶇疆</el-button> + </el-form-item> + </el-form> + </div> + <div v-if="Editprogress == 3"> + <el-form + :model="ruleForm" + :rules="rules" + ref="ruleForm" + label-width="100px" + class="demo-ruleForm" + > + <el-form-item label="娲诲姩鍚嶇О" prop="name"> + <el-input v-model="ruleForm.name"></el-input> + </el-form-item> + <el-form-item label="娲诲姩鍖哄煙" prop="region"> + <el-select v-model="ruleForm.region" placeholder="璇烽�夋嫨娲诲姩鍖哄煙"> + <el-option label="鍖哄煙涓�" value="shanghai"></el-option> + <el-option label="鍖哄煙浜�" value="beijing"></el-option> + </el-select> + </el-form-item> + <el-form-item label="娲诲姩鏃堕棿" required> + <el-col :span="11"> + <el-form-item prop="date1"> + <el-date-picker + type="date" + placeholder="閫夋嫨鏃ユ湡" + v-model="ruleForm.date1" + style="width: 100%" + ></el-date-picker> + </el-form-item> + </el-col> + <el-col class="line" :span="2">-</el-col> + <el-col :span="11"> + <el-form-item prop="date2"> + <el-time-picker + placeholder="閫夋嫨鏃堕棿" + v-model="ruleForm.date2" + style="width: 100%" + ></el-time-picker> + </el-form-item> + </el-col> + </el-form-item> + <el-form-item label="鍗虫椂閰嶉��" prop="delivery"> + <el-switch v-model="ruleForm.delivery"></el-switch> + </el-form-item> + <el-form-item label="娲诲姩鎬ц川" prop="type"> + <el-checkbox-group v-model="ruleForm.type"> + <el-checkbox label="缇庨/椁愬巺绾夸笂娲诲姩" name="type"></el-checkbox> + <el-checkbox label="鍦版帹娲诲姩" name="type"></el-checkbox> + <el-checkbox label="绾夸笅涓婚娲诲姩" name="type"></el-checkbox> + <el-checkbox label="鍗曠函鍝佺墝鏇濆厜" name="type"></el-checkbox> + </el-checkbox-group> + </el-form-item> + <el-form-item label="鐗规畩璧勬簮" prop="resource"> + <el-radio-group v-model="ruleForm.resource"> + <el-radio label="绾夸笂鍝佺墝鍟嗚禐鍔�"></el-radio> + <el-radio label="绾夸笅鍦哄湴鍏嶈垂"></el-radio> + </el-radio-group> + </el-form-item> + <el-form-item label="娲诲姩褰㈠紡" prop="desc"> + <el-input type="textarea" v-model="ruleForm.desc"></el-input> + </el-form-item> + <el-form-item> + <el-button type="success" @click="submitForm('ruleForm')" + >涓嬩竴姝�</el-button + > + <el-button type="primary" @click="laststep()">涓婁竴姝�</el-button> + <el-button @click="resetForm('ruleForm')">閲嶇疆</el-button> + </el-form-item> + </el-form> + </div> + <div v-if="Editprogress == 4"> + <el-form + :model="ruleForm" + :rules="rules" + ref="ruleForm" + label-width="100px" + class="demo-ruleForm" + > + <el-form-item label="娲诲姩鍚嶇О" prop="name"> + <el-input v-model="ruleForm.name"></el-input> + </el-form-item> + <el-form-item label="娲诲姩鍖哄煙" prop="region"> + <el-select v-model="ruleForm.region" placeholder="璇烽�夋嫨娲诲姩鍖哄煙"> + <el-option label="鍖哄煙涓�" value="shanghai"></el-option> + <el-option label="鍖哄煙浜�" value="beijing"></el-option> + </el-select> + </el-form-item> + <el-form-item label="娲诲姩鏃堕棿" required> + <el-col :span="11"> + <el-form-item prop="date1"> + <el-date-picker + type="date" + placeholder="閫夋嫨鏃ユ湡" + v-model="ruleForm.date1" + style="width: 100%" + ></el-date-picker> + </el-form-item> + </el-col> + <el-col class="line" :span="2">-</el-col> + <el-col :span="11"> + <el-form-item prop="date2"> + <el-time-picker + placeholder="閫夋嫨鏃堕棿" + v-model="ruleForm.date2" + style="width: 100%" + ></el-time-picker> + </el-form-item> + </el-col> + </el-form-item> + <el-form-item label="鍗虫椂閰嶉��" prop="delivery"> + <el-switch v-model="ruleForm.delivery"></el-switch> + </el-form-item> + <el-form-item label="娲诲姩鎬ц川" prop="type"> + <el-checkbox-group v-model="ruleForm.type"> + <el-checkbox label="缇庨/椁愬巺绾夸笂娲诲姩" name="type"></el-checkbox> + <el-checkbox label="鍦版帹娲诲姩" name="type"></el-checkbox> + <el-checkbox label="绾夸笅涓婚娲诲姩" name="type"></el-checkbox> + <el-checkbox label="鍗曠函鍝佺墝鏇濆厜" name="type"></el-checkbox> + </el-checkbox-group> + </el-form-item> + <el-form-item label="鐗规畩璧勬簮" prop="resource"> + <el-radio-group v-model="ruleForm.resource"> + <el-radio label="绾夸笂鍝佺墝鍟嗚禐鍔�"></el-radio> + <el-radio label="绾夸笅鍦哄湴鍏嶈垂"></el-radio> + </el-radio-group> + </el-form-item> + <el-form-item label="娲诲姩褰㈠紡" prop="desc"> + <el-input type="textarea" v-model="ruleForm.desc"></el-input> + </el-form-item> + <el-form-item> + <el-button type="success" @click="submitForm('ruleForm')" + >绔嬪嵆鍒涘缓</el-button + > + <el-button type="primary" @click="laststep()">涓婁竴姝�</el-button> + <el-button @click="resetForm('ruleForm')">閲嶇疆</el-button> + </el-form-item> + </el-form> + </div> + </div> + <el-drawer + title="鎴戞槸鏍囬" + :visible.sync="drawer" + :before-close="handleClose" + > + <span>鎴戞潵鍟�!</span> + </el-drawer> + </div> +</template> + +<script> +export default { + data() { + return { + sidecolumnrabs: "left", //鏂瑰悜 + Editprogress: 1, //缂栬緫杩涘害 + currentVersion: "1.2.3", //褰撳墠鐗堟湰 + drawer: false, //鎺у埗灞曞紑 + ruleForm: { + name: "", + region: "", + date1: "", + date2: "", + delivery: false, + type: [], + resource: "", + desc: "", + templatevalue: "", + data2: "", + }, + rules: {}, + rulesa: { + name: [ + { required: true, message: "璇疯緭鍏ユ椿鍔ㄥ悕绉�", trigger: "blur" }, + { min: 3, max: 5, message: "闀垮害鍦� 3 鍒� 5 涓瓧绗�", trigger: "blur" }, + ], + region: [ + { required: true, message: "璇烽�夋嫨娲诲姩鍖哄煙", trigger: "change" }, + ], + date1: [ + { + type: "date", + required: true, + message: "璇烽�夋嫨鏃ユ湡", + trigger: "change", + }, + ], + date2: [ + { + type: "date", + required: true, + message: "璇烽�夋嫨鏃堕棿", + trigger: "change", + }, + ], + type: [ + { + type: "array", + required: true, + message: "璇疯嚦灏戦�夋嫨涓�涓椿鍔ㄦ�ц川", + trigger: "change", + }, + ], + resource: [ + { required: true, message: "璇烽�夋嫨娲诲姩璧勬簮", trigger: "change" }, + ], + desc: [{ required: true, message: "璇峰~鍐欐椿鍔ㄥ舰寮�", trigger: "blur" }], + }, + options: [ + { + value: "閫夐」1", + label: "榛勯噾绯�", + }, + { + value: "閫夐」2", + label: "鍙岀毊濂�", + }, + { + value: "閫夐」3", + label: "铓典粩鐓�", + }, + { + value: "閫夐」4", + label: "榫欓』闈�", + }, + { + value: "閫夐」5", + label: "鍖椾含鐑ら腑", + }, + ], + options: [ + { + value: "zhinan", + label: "鎸囧崡", + children: [ + { + value: "shejiyuanze", + label: "璁捐鍘熷垯", + children: [ + { + value: "yizhi", + label: "涓�鑷�", + }, + { + value: "fankui", + label: "鍙嶉", + }, + { + value: "xiaolv", + label: "鏁堢巼", + }, + { + value: "kekong", + label: "鍙帶", + }, + ], + }, + { + value: "daohang", + label: "瀵艰埅", + children: [ + { + value: "cexiangdaohang", + label: "渚у悜瀵艰埅", + }, + { + value: "dingbudaohang", + label: "椤堕儴瀵艰埅", + }, + ], + }, + ], + }, + { + value: "zujian", + label: "缁勪欢", + children: [ + { + value: "basic", + label: "Basic", + children: [ + { + value: "layout", + label: "Layout 甯冨眬", + }, + { + value: "color", + label: "Color 鑹插僵", + }, + { + value: "typography", + label: "Typography 瀛椾綋", + }, + { + value: "icon", + label: "Icon 鍥炬爣", + }, + { + value: "button", + label: "Button 鎸夐挳", + }, + ], + }, + { + value: "form", + label: "Form", + children: [ + { + value: "radio", + label: "Radio 鍗曢�夋", + }, + { + value: "checkbox", + label: "Checkbox 澶氶�夋", + }, + { + value: "input", + label: "Input 杈撳叆妗�", + }, + { + value: "input-number", + label: "InputNumber 璁℃暟鍣�", + }, + { + value: "select", + label: "Select 閫夋嫨鍣�", + }, + { + value: "cascader", + label: "Cascader 绾ц仈閫夋嫨鍣�", + }, + { + value: "switch", + label: "Switch 寮�鍏�", + }, + { + value: "slider", + label: "Slider 婊戝潡", + }, + { + value: "time-picker", + label: "TimePicker 鏃堕棿閫夋嫨鍣�", + }, + { + value: "date-picker", + label: "DatePicker 鏃ユ湡閫夋嫨鍣�", + }, + { + value: "datetime-picker", + label: "DateTimePicker 鏃ユ湡鏃堕棿閫夋嫨鍣�", + }, + { + value: "upload", + label: "Upload 涓婁紶", + }, + { + value: "rate", + label: "Rate 璇勫垎", + }, + { + value: "form", + label: "Form 琛ㄥ崟", + }, + ], + }, + { + value: "data", + label: "Data", + children: [ + { + value: "table", + label: "Table 琛ㄦ牸", + }, + { + value: "tag", + label: "Tag 鏍囩", + }, + { + value: "progress", + label: "Progress 杩涘害鏉�", + }, + { + value: "tree", + label: "Tree 鏍戝舰鎺т欢", + }, + { + value: "pagination", + label: "Pagination 鍒嗛〉", + }, + { + value: "badge", + label: "Badge 鏍囪", + }, + ], + }, + { + value: "notice", + label: "Notice", + children: [ + { + value: "alert", + label: "Alert 璀﹀憡", + }, + { + value: "loading", + label: "Loading 鍔犺浇", + }, + { + value: "message", + label: "Message 娑堟伅鎻愮ず", + }, + { + value: "message-box", + label: "MessageBox 寮规", + }, + { + value: "notification", + label: "Notification 閫氱煡", + }, + ], + }, + { + value: "navigation", + label: "Navigation", + children: [ + { + value: "menu", + label: "NavMenu 瀵艰埅鑿滃崟", + }, + { + value: "tabs", + label: "Tabs 鏍囩椤�", + }, + { + value: "breadcrumb", + label: "Breadcrumb 闈㈠寘灞�", + }, + { + value: "dropdown", + label: "Dropdown 涓嬫媺鑿滃崟", + }, + { + value: "steps", + label: "Steps 姝ラ鏉�", + }, + ], + }, + { + value: "others", + label: "Others", + children: [ + { + value: "dialog", + label: "Dialog 瀵硅瘽妗�", + }, + { + value: "tooltip", + label: "Tooltip 鏂囧瓧鎻愮ず", + }, + { + value: "popover", + label: "Popover 寮瑰嚭妗�", + }, + { + value: "card", + label: "Card 鍗$墖", + }, + { + value: "carousel", + label: "Carousel 璧伴┈鐏�", + }, + { + value: "collapse", + label: "Collapse 鎶樺彔闈㈡澘", + }, + ], + }, + ], + }, + { + value: "ziyuan", + label: "璧勬簮", + children: [ + { + value: "axure", + label: "Axure Components", + }, + { + value: "sketch", + label: "Sketch Templates", + }, + { + value: "jiaohu", + label: "缁勪欢浜や簰鏂囨。", + }, + ], + }, + ], + }; + }, + + created() {}, + + methods: { + submitForm(formName) { + if (this.Editprogress <= 3) { + return this.Editprogress++; + } + this.rules = this.rulesa; + // 鎻愪氦 + this.$refs[formName].validate((valid) => { + if (valid) { + alert("submit!"); + } else { + console.log("error submit!!"); + return false; + } + }); + }, + // 棰勮妯$増 + PreviewTemplate() { + this.drawer = true; + }, + laststep() { + this.Editprogress--; + }, + resetForm(formName) { + this.$refs[formName].resetFields(); + }, + }, +}; +</script> + +<style lang="scss" scoped> +.Questionnairemanagement { + display: flex; +} +.sidecolumn { + width: 300px; + min-height: 100vh; + text-align: center; + // display: flex; + // margin-top: 20px; + margin: 20px; + margin-bottom: 0; + padding: 30px; + background: #edf1f7; + border: 1px solid #dcdfe6; + -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), + 0 0 6px 0 rgba(0, 0, 0, 0.04); +} +.leftvlue { + // display: flex; + // flex: 1; + width: 80%; + margin-top: 20px; + // margin: 20px; + padding: 30px; + background: #ffff; + border: 1px solid #dcdfe6; + -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), + 0 0 6px 0 rgba(0, 0, 0, 0.04); + .mulsz { + font-size: 20px; + } + .leftvlue-jbxx { + margin-bottom: 50px; + font-size: 20px; + span { + position: absolute; + right: 80px; + } + } + .demo-cascader { + margin-right: 20px; + } + .PreviewTemplate { + color: #02a7f0; + cursor: pointer; + font-size: 20px; + margin: 0 20px; + } +} +::v-deep.el-step.is-vertical .el-step__title { + font-size: 25px; +} +::v-deep.el-input--medium { + font-size: 24px !important; +} +::v-deep.ruleFormaa.el-select { + display: inline-block; + position: relative; + width: 700px; +} +.el-select__tags { + font-size: 20px; + max-width: 888px !important; +} +</style> diff --git a/src/views/knowledge/questionnaire/examine/index.vue b/src/views/knowledge/questionnaire/examine/index.vue new file mode 100644 index 0000000..3e0c8c8 --- /dev/null +++ b/src/views/knowledge/questionnaire/examine/index.vue @@ -0,0 +1,21 @@ +<template> + <div class="examineemanagement"> + <div>鏌ョ湅璇︽儏W</div> + <div></div> + <div></div> + </div> +</template> + +<script> +export default { + data() { + return {}; + }, + + created() {}, + + methods: {}, +}; +</script> + +<style lang="scss" scoped></style> diff --git a/src/views/knowledge/questionnaire/index.vue b/src/views/knowledge/questionnaire/index.vue new file mode 100644 index 0000000..1fac129 --- /dev/null +++ b/src/views/knowledge/questionnaire/index.vue @@ -0,0 +1,761 @@ +<template> + <div class="Questionnairemanagement"> + <!-- 宸︿晶鏍� --> + <div class="sidecolumn"> + <div class="sidecolumn-top"> + <div class="top-wj">闂嵎绫诲瀷</div> + <div class="top-tj" @click="dialogFormVisible = true">+娣诲姞</div> + </div> + <div class="center-ss"> + <el-input + placeholder="璇疯緭鍏ュ唴瀹�" + v-model="sidecolumnval" + class="input-with-select" + size="medium " + > + <el-button + @click="sidecolumnss" + slot="append" + icon="el-icon-search" + ></el-button> + </el-input> + </div> + <div class="bottom-fl"> + <el-tabs tab-position="right"> + <el-tab-pane :label="`鍏ㄩ儴 (${numberlb})`"></el-tab-pane> + <el-tab-pane + class="tab-paness" + :key="item.name" + v-for="(item, index) in editableTabs" + :label="item.title + ' (' + item.number + ')'" + ></el-tab-pane> + + <el-tab-pane :label="`鏈垎缁�(${numberlbs})`"></el-tab-pane> + </el-tabs> + </div> + </div> + <!-- 鍙充晶鏁版嵁 --> + <div class="leftvlue"> + <div class="leftvlue-top"> + <el-tabs v-model="topactiveName" @tab-click="tophandleClick"> + <el-tab-pane name="Local"> + <span class="mulsz" slot="label">鏈湴闂嵎搴� </span> + </el-tab-pane> + <el-tab-pane name="sharing"> + <span class="mulsz" slot="label">鍏变韩闂嵎搴� </span> + </el-tab-pane> + </el-tabs> + </div> + <div class="leftvlue-bg"> + <el-row :gutter="20"> + <!--鐢ㄦ埛鏁版嵁--> + <el-col :span="24" :xs="24"> + <el-form + :model="queryParams" + ref="queryForm" + size="small" + :inline="true" + v-show="showSearch" + label-width="98px" + > + <el-form-item label="闂嵎鍚嶇О" prop="userName"> + <el-input + v-model="queryParams.userName" + placeholder="璇疯緭鍏�" + clearable + style="width: 200px" + @keyup.enter.native="handleQuery" + /> + </el-form-item> + <el-form-item label="閫傜敤鐤剧梾" prop="status"> + <el-cascader + v-model="queryParams.status" + :options="optionss" + :props="propss" + clearable + ></el-cascader> + </el-form-item> + + <el-form-item> + <el-button + type="primary" + icon="el-icon-search" + size="medium" + @click="handleQuery" + >鎼滅储</el-button + > + <el-button + icon="el-icon-refresh" + size="medium" + @click="resetQuery" + >閲嶇疆</el-button + > + </el-form-item> + </el-form> + + <el-row :gutter="10" class="mb8"> + <el-col :span="1.5"> + <el-button + type="primary" + plain + icon="el-icon-plus" + size="medium" + @click="handleAdd" + v-hasPermi="['system:user:add']" + >鏂板</el-button + > + </el-col> + <el-col :span="1.5"> + <el-button + type="success" + plain + icon="el-icon-edit" + size="medium" + :disabled="single" + @click="handleUpdate" + v-hasPermi="['system:user:edit']" + >淇敼</el-button + > + </el-col> + <el-col :span="1.5"> + <el-button + type="danger" + plain + icon="el-icon-delete" + size="medium" + :disabled="multiple" + @click="handleDelete" + v-hasPermi="['system:user:remove']" + >鍒犻櫎</el-button + > + </el-col> + + <!-- <el-col :span="1.5"> </el-col> --> + </el-row> + <!-- <right-toolbar + :showSearch.sync="showSearch" + @queryTable="getList" + :columns="columns" + ></right-toolbar> --> + <el-table + v-loading="loading" + :data="userList" + border="true" + @selection-change="handleSelectionChange" + > + <el-table-column type="selection" width="50" align="center" /> + <el-table-column + label="搴忓彿" + align="center" + key="userId" + prop="userId" + v-if="columns[0].visible" + /> + <el-table-column + label="闂嵎鍚嶇О" + align="center" + key="userName" + prop="userName" + v-if="columns[1].visible" + :show-overflow-tooltip="true" + /> + <el-table-column + label="鐗堟湰" + align="center" + key="nickName" + prop="nickName" + v-if="columns[2].visible" + :show-overflow-tooltip="true" + /> + + <el-table-column + label="閫傜敤鐤剧梾" + align="center" + key="aphonenumber" + prop="aphonenumber" + v-if="columns[4].visible" + width="120" + /><el-table-column + label="闂嵎鎻忚堪" + align="center" + key="bphonenumber" + prop="bphonenumber" + v-if="columns[4].visible" + width="120" + /> + <el-table-column + label="鏈�杩戠紪杈�" + align="center" + key="cphonenumber" + prop="cphonenumber" + v-if="columns[4].visible" + width="120" + /> + + <el-table-column + label="鎿嶄綔" + align="center" + width="300" + class-name="small-padding fixed-width" + > + <template slot-scope="scope"> + <el-button + size="medium" + type="text" + @click="$router.push('/patient/patient/profile/')" + v-hasPermi="['system:user:edit']" + > <span class="button-text"><i class="el-icon-edit"></i>浜岀淮鐮�</span></el-button + > + <el-button + size="medium" + type="text" + @click="ViewQuestionnaire(scope.row)" + v-hasPermi="['system:user:edit']" + ><span class="button-textck"><i class="el-icon-edit"></i>鏌ョ湅</span></el-button + > + <el-button + size="medium" + type="text" + @click="handleUpdate(scope.row)" + v-hasPermi="['system:user:edit']" + ><span class="button-textxg"><i class="el-icon-edit"></i>淇敼</span></el-button + > + <el-button + size="medium" + type="text" + @click="handleDelete(scope.row)" + v-hasPermi="['system:user:remove']" + ><span class="button-textsc"><i class="el-icon-edit"></i>鍒犻櫎</span></el-button + > + </template> + </el-table-column> + </el-table> + + <pagination + v-show="total > 0" + :total="total" + :page.sync="queryParams.pageNum" + :limit.sync="queryParams.pageSize" + @pagination="getList" + /> + </el-col> + </el-row> + + <!-- 娣诲姞鎴栦慨鏀归棶鍗烽厤缃璇濇 --> + <el-dialog + :title="title" + :visible.sync="open" + width="900px" + append-to-body + > + <el-form ref="form" :model="form" :rules="rules" label-width="100px"> + <el-row> + <el-col :span="12"> + <el-form-item label="濮撳悕" prop="nickName"> + <el-input + v-model="form.nickName" + placeholder="璇疯緭鍏ュ鍚�" + maxlength="30" + /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鎬у埆" prop="deptId"> + <el-select v-model="form.sex" placeholder="璇烽�夋嫨鎬у埆"> + <el-option + v-for="dict in dict.type.sys_user_sex" + :key="dict.value" + :label="dict.label" + :value="dict.value" + ></el-option> + </el-select> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="璇佷欢绫诲瀷" prop="phonenumber"> + <el-input + v-model="form.phonenumber" + placeholder="璇烽�夋嫨璇佷欢绫诲瀷" + maxlength="11" + /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="璇佷欢鍙�" prop="email"> + <el-input + v-model="form.email" + placeholder="璇疯緭鍏ヨ瘉浠跺彿" + maxlength="50" + /> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="鏈汉鎵嬫満鍙�" prop="userName"> + <el-input + v-model="form.userName" + placeholder="璇疯緭鍏ユ墜鏈哄彿" + maxlength="30" + /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="浜插睘鎵嬫満鍙�" prop="password"> + <el-input + v-model="form.password" + placeholder="璇疯緭鍏ヤ翰灞炴墜鏈哄彿" + type="password" + maxlength="20" + show-password + /> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="鎮h�呮爣绛�"> + <el-cascader + :options="optionss" + :props="propss" + clearable + ></el-cascader> + </el-form-item> + </el-col> + </el-row> + + <el-row> + <el-col :span="24"> + <el-form-item label="澶囨敞"> + <el-input + v-model="form.remark" + type="textarea" + placeholder="璇疯緭鍏ュ唴瀹�" + ></el-input> + </el-form-item> + </el-col> + </el-row> + </el-form> + <div slot="footer" class="dialog-footer"> + <el-button type="primary" @click="submitForm">纭� 瀹�</el-button> + <el-button @click="cancel">鍙� 娑�</el-button> + </div> + </el-dialog> + </div> + </div> + <!-- 娣诲姞绫诲埆寮规 --> + <el-dialog title="鏂板绫诲埆" width="30%" :visible.sync="dialogFormVisible"> + <el-form :model="sidecolumnform"> + <el-form-item label="璇疯緭鍏ョ被鍒悕绉�"> + <el-input v-model="form.name" autocomplete="off"></el-input> + </el-form-item> + </el-form> + <div slot="footer" class="dialog-footer"> + <el-button @click="dialogFormVisible = false">鍙� 娑�</el-button> + <el-button type="primary" @click="submitsidecolumn">纭� 瀹�</el-button> + </div> + </el-dialog> + </div> +</template> + +<script> +import { + listUser, + getUser, + delUser, + addUser, + updateUser, +} from "@/api/system/user"; +import { getToken } from "@/utils/auth"; +import Treeselect from "@riophae/vue-treeselect"; +import "@riophae/vue-treeselect/dist/vue-treeselect.css"; +export default { + name: "questionnaire", + dicts: ["sys_normal_disable", "sys_user_sex"], + components: { Treeselect }, + data() { + return { + topactiveName: "Local", //椤堕儴閫夋嫨 + // 閬僵灞� + loading: false, + // 閫変腑鏁扮粍 + ids: [], + // 闈炲崟涓鐢� + single: true, + // 闈炲涓鐢� + multiple: true, + // 鏄剧ず鎼滅储鏉′欢 + showSearch: true, + // 鎬绘潯鏁� + total: 0, + // 鐢ㄦ埛琛ㄦ牸鏁版嵁 + userList: [ + { + userid: 1, + userName: "涓夊彿闂嵎", + nickName: "1.2.4", + aphonenumber: "鍏宠妭鐐庣棁", + bphonenumber: "寰堟", + cphonenumber: "2022-12-12 ", + }, + ], + // 寮瑰嚭灞傛爣棰� + title: "", + // 鏄惁鏄剧ず寮瑰嚭灞� + open: false, + // 鏃ユ湡鑼冨洿 + dateRange: [], + // 宀椾綅閫夐」 + postOptions: [], + // 瑙掕壊閫夐」 + roleOptions: [], + // 琛ㄥ崟鍙傛暟 + form: {}, + numberlb: 22, + numberlbs: 2, + sidecolumnform: {}, //娣诲姞绫诲埆琛ㄥ崟 + dialogFormVisible: false, //娣诲姞绫诲埆寮规 + sidecolumnval: "", //绫诲埆鎼滅储 + propss: { multiple: true }, + optionss: [ + { + value: 1, + label: "涓滃崡", + }, + { + value: 2, + label: "瑗垮寳", + }, + { + value: 3, + label: "浠ㄤ花浠�", + }, + { + value: 4, + label: "鍏椋掗", + }, + ], + //绫诲埆鍒楄〃 + editableTabs: [ + { + title: "闂嵎鍒嗙被涓�", + number: "1", + }, + { + title: "闂嵎鍒嗙被浜�", + number: "2", + }, + { + title: "闂嵎鍒嗙被涓�", + number: "2", + }, + { + title: "闂嵎鍒嗙被鍥�", + number: "2", + }, + { + title: "闂嵎鍒嗙被浜�", + number: "2", + }, + ], + // 鏌ヨ鍙傛暟 + queryParams: { + pageNum: 1, + pageSize: 10, + userName: undefined, + phonenumber: undefined, + status: undefined, + deptId: undefined, + IDnumber: undefined, + }, + // 鍒椾俊鎭� + columns: [ + { key: 0, label: `鐢ㄦ埛缂栧彿`, visible: true }, + { key: 1, label: `鐢ㄦ埛鍚嶇О`, visible: true }, + { key: 2, label: `鐢ㄦ埛鏄电О`, visible: true }, + { key: 3, label: `閮ㄩ棬`, visible: true }, + { key: 4, label: `鎵嬫満鍙风爜`, visible: true }, + { key: 5, label: `鐘舵�乣, visible: true }, + { key: 6, label: `鍒涘缓鏃堕棿`, visible: true }, + ], + // 琛ㄥ崟鏍¢獙 + rules: { + userName: [ + { required: true, message: "鐢ㄦ埛鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }, + { + min: 2, + max: 20, + message: "鐢ㄦ埛鍚嶇О闀垮害蹇呴』浠嬩簬 2 鍜� 20 涔嬮棿", + trigger: "blur", + }, + ], + nickName: [ + { required: true, message: "鐢ㄦ埛鏄电О涓嶈兘涓虹┖", trigger: "blur" }, + ], + password: [ + { required: true, message: "鐢ㄦ埛瀵嗙爜涓嶈兘涓虹┖", trigger: "blur" }, + { + min: 5, + max: 20, + message: "鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿", + trigger: "blur", + }, + ], + email: [ + { + type: "email", + message: "璇疯緭鍏ユ纭殑閭鍦板潃", + trigger: ["blur", "change"], + }, + ], + phonenumber: [ + { + pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, + message: "璇疯緭鍏ユ纭殑鎵嬫満鍙风爜", + trigger: "blur", + }, + ], + IDnumber: [ + { + pattern: + /^\d{6}((((((19|20)\d{2})(0[13-9]|1[012])(0[1-9]|[12]\d|30))|(((19|20)\d{2})(0[13578]|1[02])31)|((19|20)\d{2})02(0[1-9]|1\d|2[0-8])|((((19|20)([13579][26]|[2468][048]|0[48]))|(2000))0229))\d{3})|((((\d{2})(0[13-9]|1[012])(0[1-9]|[12]\d|30))|((\d{2})(0[13578]|1[02])31)|((\d{2})02(0[1-9]|1\d|2[0-8]))|(([13579][26]|[2468][048]|0[048])0229))\d{2}))(\d|X|x)$/, + message: "璇疯緭鍏ユ纭殑韬唤璇佸彿鐮�", + trigger: "blur", + }, + ], + }, + }; + }, + watch: {}, + created() { + this.getList(); + }, + + methods: { + /** 鏌ヨ鐢ㄦ埛鍒楄〃 */ + getList() { + // this.loading = true; + listUser().then((response) => { + console.log(response); + // this.userList = response.data; + // this.total = response.total; + // this.loading = false; + console.log(this.userList); + }); + // const { rows } = await listUser(); + // console.log(rows); + // this.list = rows; + }, + // 娣诲姞绫诲埆 + submitsidecolumn() { + this.dialogFormVisible = false; + }, + //鎼滅储绫诲埆 + sidecolumnss() {}, + // 鍒囨崲鍏变韩/鏈湴 + tophandleClick() {}, + // 鍙栨秷鎸夐挳 + cancel() { + this.open = false; + this.reset(); + }, + // 琛ㄥ崟閲嶇疆 + reset() { + this.form = { + userId: undefined, + deptId: undefined, + userName: undefined, + nickName: undefined, + password: undefined, + phonenumber: undefined, + email: undefined, + sex: undefined, + status: "0", + remark: undefined, + postIds: [], + roleIds: [], + }; + this.resetForm("form"); + }, + /** 鎼滅储鎸夐挳鎿嶄綔 */ + handleQuery() { + this.queryParams.pageNum = 1; + this.getList(); + }, + /** 閲嶇疆鎸夐挳鎿嶄綔 */ + resetQuery() { + this.dateRange = []; + this.resetForm("queryForm"); + this.queryParams.deptId = undefined; + this.$refs.tree.setCurrentKey(null); + this.handleQuery(); + }, + // 澶氶�夋閫変腑鏁版嵁 + handleSelectionChange(selection) { + this.ids = selection.map((item) => item.userId); + this.single = selection.length != 1; + this.multiple = !selection.length; + }, + /** 鏂板鎸夐挳鎿嶄綔 */ + handleAdd() { + this.reset(); + getUser().then((response) => { + this.postOptions = response.posts; + this.roleOptions = response.roles; + this.open = true; + this.title = "鏂板鎮h��"; + }); + }, + /** 淇敼鎸夐挳鎿嶄綔 */ + handleUpdate(row) { + this.$router.push({ + path: "/knowledge/questionnaire/compilequer/", + query: { id: "1" }, + }); + // this.reset(); + // const userId = row.userId || this.ids; + // getUser(userId).then((response) => { + // this.form = response.data; + // this.postOptions = response.posts; + // this.roleOptions = response.roles; + // this.$set(this.form, "postIds", response.postIds); + // this.$set(this.form, "roleIds", response.roleIds); + // this.open = true; + // this.title = "淇敼鐢ㄦ埛"; + // this.form.password = ""; + // }); + }, + // 鏌ョ湅闂嵎 + ViewQuestionnaire() { + this.$router.push({ + path: "/knowledge/questionnaire/examine/", + query: { id: "1" }, + }); + }, + + /** 鏇存柊/淇敼鎻愪氦鎸夐挳 */ + submitForm: function () { + this.$refs["form"].validate((valid) => { + if (valid) { + if (this.form.userId != undefined) { + updateUser(this.form).then((response) => { + this.$modal.msgSuccess("淇敼鎴愬姛"); + this.open = false; + this.getList(); + }); + } else { + addUser(this.form).then((response) => { + this.$modal.msgSuccess("鏂板鎴愬姛"); + this.open = false; + this.getList(); + }); + } + } + }); + }, + /** 鍒犻櫎鎸夐挳鎿嶄綔 */ + handleDelete(row) { + const userIds = row.userId || this.ids; + this.$modal + .confirm('鏄惁纭鍒犻櫎鐢ㄦ埛缂栧彿涓�"' + userIds + '"鐨勬暟鎹」锛�') + .then(function () { + return delUser(userIds); + }) + .then(() => { + this.getList(); + this.$modal.msgSuccess("鍒犻櫎鎴愬姛"); + }) + .catch(() => {}); + }, + }, +}; +</script> + +<style lang="scss" scoped> +.Questionnairemanagement { + display: flex; +} +.sidecolumn { + width: 300px; + min-height: 100vh; + text-align: center; + // display: flex; + margin-top: 20px; + margin: 20px; + padding: 30px; + background: #edf1f7; + border: 1px solid #dcdfe6; + -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), + 0 0 6px 0 rgba(0, 0, 0, 0.04); + .sidecolumn-top { + display: flex; + justify-content: space-between; + .top-wj { + font-size: 20px; + } + .top-tj { + font-size: 18px; + + color: rgb(0, 89, 255); + cursor: pointer; + } + } + .center-ss { + margin-top: 30px; + .input-with-select { + height: 40px !important; + } + } + .bottom-fl { + margin-top: 30px; + display: center !important; + } +} +::v-deep.el-tabs--left, +.el-tabs--right { + overflow: hidden; + align-items: center; + display: flex; +} +::v-deep.el-input--medium .el-input__inner { + height: 40px !important; +} +::v-deep.el-tabs--right .el-tabs__active-bar.is-right { + height: 40px; + width: 5px; + left: 0; +} +::v-deep.el-tabs--right .el-tabs__item.is-right { + display: block; + font-size: 20px; +} +.leftvlue { + // display: flex; + // flex: 1; + width: 80%; + margin-top: 20px; + // margin: 20px; + padding: 30px; + background: #ffff; + border: 1px solid #dcdfe6; + -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), + 0 0 6px 0 rgba(0, 0, 0, 0.04); + .mulsz { + font-size: 20px; + } +} +.button-text{ + color: rgb(70, 204, 238) +} +.button-textck{ + color: rgb(39, 167, 67) +} +.button-textxg{ + color: rgb(35, 81, 233) +} +.button-textsc{ + color: rgb(235, 23, 23) +} +</style> -- Gitblit v1.9.3