From e875ccb607bc37c9515217277aafb3d4204c6d14 Mon Sep 17 00:00:00 2001 From: chengxiangling <291105840@qq.com> Date: 星期五, 16 五月 2025 15:23:56 +0800 Subject: [PATCH] 提交计划运行和基础数据的搜索条件 --- src/views/basicData/calendar/index.vue | 715 ++++++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 505 insertions(+), 210 deletions(-) diff --git a/src/views/basicData/calendar/index.vue b/src/views/basicData/calendar/index.vue index ea785cc..af6d220 100644 --- a/src/views/basicData/calendar/index.vue +++ b/src/views/basicData/calendar/index.vue @@ -26,7 +26,7 @@ <el-select style="width: 140px" clearable - v-model="queryParams.plant" + v-model="queryParams.applicableFactory" placeholder="閫傜敤宸ュ巶" > <el-option @@ -38,14 +38,14 @@ </el-select> </el-form-item> </el-col> - <el-col :span="13" style="text-align: right"> + <!-- <el-col :span="13" style="text-align: right"> <el-form-item class="column-with-margin"> <el-button type="primary" icon="Search" @click="handleQuery" >鏌ヨ</el-button > <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> </el-form-item> - </el-col> + </el-col> --> </el-row> </el-form> @@ -111,8 +111,8 @@ class="auto-height-grid" > <template #status="{ row }"> - <vxe-tag v-if="row.type === '1'" status="primary">鍛ㄥ伐浣滄棩</vxe-tag> - <vxe-tag v-if="row.type === '2'" status="success">鑺傚亣鏃�</vxe-tag> + <vxe-tag v-if="row.type === '1'" status="primary">鍛ㄥ伐浣�</vxe-tag> + <!-- <vxe-tag v-if="row.type === '2'" status="success">鑺傚亣鏃�</vxe-tag> --> </template> <template #mark="{ row }"> <div v-if="row.type === '1'"> @@ -261,7 +261,10 @@ prop="applicableFactory" class="factory_use_item" > --> - <div class="select_factory select_factory_dis">閫傜敤宸ュ巶/杞﹂棿/宸ュ簭</div> + <div class="select_factory select_factory_dis"> + <span class="error_require">*</span> + <span>閫傜敤宸ュ巶/杞﹂棿/宸ュ簭</span> + </div> <!-- <el-row :gutter="20" class="select_factory"> --> <div class="select_factory_dis" @@ -390,10 +393,16 @@ <div>閫傜敤宸ュ巶锛� </div> <div class="flex_item_dis"> <div + class="flex_item" v-for="(item, index) in form.applicableTranslate" :key="index" > - {{ item.factory }} - {{ item.workshop }} - {{ item.process }} + {{ item }} + <div v-if="item[0].factory">{{ item[0].factory }}</div> + <div v-if="item[2].workshop">-</div> + <div v-if="item[2].workshop">{{ item[2].workshop }}</div> + <div v-if="item[1].process">-</div> + <div v-if="item[1].process">{{ item[1].process }}</div> </div> </div> </div> @@ -410,51 +419,159 @@ > </div> <div class="grey_bg"> - <el-form - class="mart10" - ref="holidaysRef" - :model="formHolidays" - :rules="holidayRules" - :inline="true" - label-width="105px" - > - <template v-for="(item, index) in formHolidays" :key="index"> - <el-form-item label="鑺傚亣鏃ユ弿杩�" prop="description"> - <el-input - style="width: 130px" - v-model="item.describe" - placeholder="璇疯緭鍏ユ弿杩�" - /> - </el-form-item> - <el-form-item label="寮�濮嬫椂闂�" prop="startdate"> - <el-date-picker - style="width: 130px" - clearable - v-model="item.startdate" - type="date" - :disabled-date="handleDisabledDate" - :default-value="form.effectiveDate" - placeholder="閫夋嫨鏃ユ湡" + <div + class="flex_holidays_set" + v-for="(item, index) in formHolidays.holidays" + :key="index" + > + <div class="dis_error_wrap"> + <div class="flex_item"> + <div class="flex_item_title"> + <span class="error_require">*</span><span>鑺傚亣鏃ユ弿杩�</span> + </div> + <div> + <el-input + style="width: 130px" + v-model="item.describe" + placeholder="璇疯緭鍏ユ弿杩�" + /> + </div> + </div> + <div class="error_text" v-if="item.describe == ''"> + 璇疯緭鍏ヨ妭鍋囨棩鎻忚堪 + </div> + </div> + <div class="dis_error_wrap"> + <div class="flex_item"> + <div class="flex_item_title"> + <span class="error_require">*</span><span>寮�濮嬫椂闂�</span> + </div> + <div> + <el-date-picker + style="width: 130px" + clearable + v-model="item.startdate" + type="date" + :disabled-date="handleDisabledDate" + :default-value="form.effectiveDate" + placeholder="閫夋嫨鏃ユ湡" + > + </el-date-picker> + </div> + </div> + <div class="error_text" v-if="item.startdate == ''"> + 璇疯緭鍏ュ紑濮嬫椂闂� + </div> + </div> + <div class="dis_error_wrap"> + <div class="flex_item"> + <div class="flex_item_title"> + <span class="error_require">*</span><span>缁撴潫鏃堕棿</span> + </div> + <div> + <el-date-picker + style="width: 130px" + clearable + v-model="item.enddate" + type="date" + :disabled-date="handleDisabledDate" + :default-value="form.expiringDate" + placeholder="閫夋嫨鏃ユ湡" + > + </el-date-picker> + </div> + </div> + <div class="error_text" v-if="item.enddate == ''"> + 璇疯緭鍏ョ粨鏉熸椂闂� + </div> + </div> + <div class="dis_error_wrap"> + <div class="flex_item"> + <el-button + v-if="formHolidays.length > 1" + type="danger" + size="small" + @click="handleDelSettingHolidays(item)" + >鍒犻櫎</el-button + > + </div> + </div> + </div> + <!-- <el-form + class="mart10" + ref="holidaysRef" + :model="item" + :rules="holidayRules" + :inline="true" + label-width="105px" + > + <div v-for="(item, index) in formHolidays.holidays" :key="index"> + <el-form-item + label="鑺傚亣鏃ユ弿杩�" + :prop="'holidays.' + index + '.describe'" + :rules="{ + required: true, + message: '璇疯緭鍏ヨ妭鍋囨棩鎻忚堪', + trigger: 'blur', + }" > - </el-date-picker> - </el-form-item> - <el-form-item label="缁撴潫鏃堕棿" prop="enddate"> - <el-date-picker - style="width: 130px" - clearable - v-model="item.enddate" - type="date" - placeholder="閫夋嫨鏃ユ湡" - :disabled-date="handleDisabledDate" - :default-value="form.expiringDate" + <el-input + style="width: 130px" + v-model="item.describe" + placeholder="璇疯緭鍏ユ弿杩�" + /> + </el-form-item> + <el-form-item + label="寮�濮嬫椂闂�" + :prop="'holidays.' + index + '.startdate'" + :rules="{ + required: true, + message: '璇疯緭鍏ュ紑濮嬫椂闂�', + trigger: 'blur', + }" > - </el-date-picker> - </el-form-item> - <el-form-item label="" prop=""> - <el-button v-if="formHolidays.length>1" type="danger" size="small" @click="handleDelSettingHolidays(item)">鍒犻櫎</el-button> - </el-form-item> - </template> - </el-form> + <el-date-picker + style="width: 130px" + clearable + v-model="item.startdate" + type="date" + :disabled-date="handleDisabledDate" + :default-value="form.effectiveDate" + placeholder="閫夋嫨鏃ユ湡" + > + </el-date-picker> + </el-form-item> + <el-form-item + label="缁撴潫鏃堕棿" + :prop="'holidays.' + index + '.enddate'" + :rules="{ + required: true, + message: '璇疯緭鍏ョ粨鏉熸椂闂�', + trigger: 'blur', + }" + > + <el-date-picker + style="width: 130px" + clearable + v-model="item.enddate" + type="date" + placeholder="閫夋嫨鏃ユ湡" + :disabled-date="handleDisabledDate" + :default-value="form.expiringDate" + > + </el-date-picker> + </el-form-item> + <el-form-item label="" prop=""> + <el-button + v-if="formHolidays.length > 1" + type="danger" + size="small" + @click="handleDelSettingHolidays(item)" + >鍒犻櫎</el-button + > + </el-form-item> + </div> + </el-form> --> </div> </div> </div> @@ -486,6 +603,7 @@ import { selectProcessNameList } from "@/api/basicData/processRoute.js"; import { ElMessage } from "element-plus"; const { proxy } = getCurrentInstance(); +const holidaysRef = ref(null); const { aps_factory } = proxy.useDict("aps_factory"); const tableRef = ref(); const calendarList = ref([]); @@ -509,19 +627,22 @@ process: "", }, ], + applicableTranslate: [{ factory: "" }, { workshop: "" }, { process: "" }], }, - formHolidays: [ - { - enddate: "", - startdate: "", - describe: "", - }, - ], + formHolidays: { + holidays: [ + { + enddate: "", + startdate: "", + describe: "", + }, + ], + }, queryParams: { pageNum: 1, pageSize: 10, description: null, - plant: null, + applicableFactory: null, type: null, effectiveDate: null, expiringDate: null, @@ -560,17 +681,34 @@ }, ], }, - holidayRules: { - describe: [ - { - required: true, - message: "璇疯緭鍏ヨ妭鍋囨棩鎻忚堪", - trigger: "blur", - }, - ], - }, + // holidayRules: { + // describe: [ + // { + // required: true, + // message: "璇疯緭鍏ヨ妭鍋囨棩鎻忚堪", + // trigger: "blur", + // }, + // ], + // startdate: [ + // { + // required: true, + // message: "璇疯緭鍏ュ紑濮嬫椂闂�", + // trigger: "blur", + // }, + // ], + // enddate: [ + // { + // required: true, + // message: "璇疯緭鍏ョ粨鏉熸椂闂�", + // trigger: "blur", + // }, + // ], + // }, }); -const { queryParams, form, rules, formHolidays, holidayRules } = toRefs(data); +const holidayRules = { + holidays: [{ required: true, message: "鑺傚亣鏃ユ槸蹇呭~椤�", trigger: "blur" }], +}; +const { queryParams, form, rules, formHolidays } = toRefs(data); const dateType = ref("鍛ㄥ伐浣�"); const dateTypeList = ref([ { @@ -667,43 +805,43 @@ align: "center", slots: { default: "mark" }, }, - { - title: "閫傜敤宸ュ巶", - field: "applicableFactory", - width: 200, - align: "center", - formatter: ({ cellValue, row, column }) => { - if (cellValue) { - for (let i = 0; i < plantList.value.length; i++) { - if (cellValue === plantList.value[i].plantCode) { - return plantList.value[i].plantName; - } - } - } - }, - }, - { - title: "閫傜敤杞﹂棿", - field: "applicableWorkshop", - width: 200, - align: "center", - formatter: ({ cellValue, row, column }) => { - if (cellValue) { - for (let i = 0; i < shopList.value.length; i++) { - if (cellValue === shopList.value[i].id) { - return shopList.value[i].shopName; - } - } - } - return ""; - }, - }, - { - title: "閫傜敤宸ュ簭", - field: "applicableProcess", - width: 200, - align: "center", - }, + // { + // title: "閫傜敤宸ュ巶", + // field: "applicableFactory", + // width: 200, + // align: "center", + // formatter: ({ cellValue, row, column }) => { + // if (cellValue) { + // for (let i = 0; i < plantList.value.length; i++) { + // if (cellValue === plantList.value[i].plantCode) { + // return plantList.value[i].plantName; + // } + // } + // } + // }, + // }, + // { + // title: "閫傜敤杞﹂棿", + // field: "applicableWorkshop", + // width: 200, + // align: "center", + // formatter: ({ cellValue, row, column }) => { + // if (cellValue) { + // for (let i = 0; i < shopList.value.length; i++) { + // if (cellValue === shopList.value[i].id) { + // return shopList.value[i].shopName; + // } + // } + // } + // return ""; + // }, + // }, + // { + // title: "閫傜敤宸ュ簭", + // field: "applicableProcess", + // width: 200, + // align: "center", + // }, { title: "鍒涘缓鑰�", field: "createBy", @@ -786,6 +924,10 @@ async function handleAdd() { open.value = true; form.value = { + type: "1", + description: "", + expiringDate: "", + effectiveDate: "", applicable: [ { factory: "", @@ -793,7 +935,45 @@ process: "", }, ], + applicableTranslate: [{ factory: "" }, { workshop: "" }, { process: "" }], }; + weekDaysSettingList.value = [ + { + day: "Monday", + chineseName: "鏄熸湡涓�", + work: "y", + }, + { + day: "Tuesday", + chineseName: "鏄熸湡浜�", + work: "y", + }, + { + day: "Wednesday", + chineseName: "鏄熸湡涓�", + work: "y", + }, + { + day: "Thursday", + chineseName: "鏄熸湡鍥�", + work: "y", + }, + { + day: "Friday", + chineseName: "鏄熸湡浜�", + work: "y", + }, + { + day: "Saturday", + chineseName: "鏄熸湡鍏�", + work: "y", + }, + { + day: "Sunday", + chineseName: "鏄熸湡鏃�", + work: "y", + }, + ]; title.value = "娣诲姞鏃ュ巻绠$悊"; } /** 閫夋嫨宸ュ巶鍚庝簨浠� 鍔犺浇杞﹂棿 鍜� 宸ュ簭 **/ @@ -808,7 +988,7 @@ } function changeWorkshop(workShop) { console.log(workShop.split(";")[0]); - listByWorkShop({ workShop: "姘旀煖" }).then((res) => { + listByWorkShop({ workShop: workShop.split(";")[0] }).then((res) => { console.log(res, "workShop"); processList.value = res.rows; }); @@ -825,38 +1005,56 @@ /** 淇敼鎸夐挳鎿嶄綔 */ function handleUpdate(row) { const _id = row.id || ids.value; + open.value = true; + title.value = "淇敼鏃ュ巻绠$悊"; getCalendar(_id).then((response) => { form.value = response.data; - // form.value.content = JSON.parse(response.data.content.value); - if (form.value.type === "1") { - weekDaysSettingList.value = JSON.parse( - response.data.content.value - ).weekdays; - } else if (form.value.type === "2") { - holidays.value = JSON.parse(response.data.content.value).holidays; - } - - open.value = true; - title.value = "淇敼鏃ュ巻绠$悊"; + applicableSettingList.value = JSON.parse(response.data.applicableTranslate); + console.log(response.data, "response.data"); + form.value.content = JSON.parse(response.data.content.value); + weekDaysSettingList.value = response.data.content.weekdays; + form.value.applicableTranslate= applicableTranslateArr(response.data); + console.log(form.value.applicableTranslate,"form.value.applicableTranslate") }); + } +let applicableTranslateArr = (row)=>{ + return JSON.parse(row.applicableTranslate).map( + (item) => { + return Object.keys(item).map((n) => { + console.log(item); + let arrObj = {}; + if (item[n] && item[n].indexOf(";") > 0) { + arrObj[n] = item[n].split(";")[1]; + } else { + arrObj[n] = item[n]; + } + return arrObj; + }); + } + ); +} // 璁剧疆鑺傚亣鏃� function handleSetHolidays(row) { + console.log(applicableTranslateArr, "applicableTranslateArr"); form.value = { ...row, - applicableTranslate: JSON.parse(row.applicableTranslate), + applicableTranslate: applicableTranslateArr(row), }; if (!row.holidays) { - formHolidays.value = [ - { - enddate: "", - startdate: "", - describe: "", - }, - ]; + formHolidays.value = { + holidays: [ + { + enddate: "", + startdate: "", + describe: "", + }, + ], + }; } else { - formHolidays.value = JSON.parse(row.holidays.value); + formHolidays.value.holidays = JSON.parse(row.holidays.value); } + // console.log(formHolidays.value.holidays, "formHolidays.value"); openSetHolidays.value = true; } // 绂佺敤鏃ユ湡 @@ -864,18 +1062,17 @@ const targetDate = moment(date).valueOf(); const startDate = moment(form.value.effectiveDate).valueOf(); const endDate = moment(form.value.expiringDate).valueOf(); - console.log(targetDate, startDate, endDate, "handleDisabledDate"); return targetDate < startDate || targetDate > endDate; } // 鍒犻櫎鑺傚亣鏃ヨ缃� function handleDelSettingHolidays(row) { - formHolidays.value = formHolidays.value.filter(item=>{ - return item != row - }) + formHolidays.value.holidays = formHolidays.value.holidays.filter((item) => { + return item != row; + }); } // 娣诲姞鑺傚亣鏃� function hanldeAddHolidays() { - formHolidays.value.push({ + formHolidays.value.holidays.push({ enddate: "", startdate: "", describe: "", @@ -884,46 +1081,106 @@ function handleToggleExpand() { expand.value = !expand.value; } +// const confirmClick = () => { +// let formList = [predictionFormRef] +// let resultArr = []; +// let validate = (form) => { +// let result = new Promise((resolve, reject) => { +// form.value.validate(valid => { +// if (valid) { +// resolve() +// } else { +// reject() +// } +// }) +// }) +// resultArr.push(result) +// } +// formList.forEach(item => { +// validate(item) +// }) +// Promise.all(resultArr).then(() => { +// saveRule() // 鏍¢獙鎴愬姛涔嬪悗 淇濆瓨鏁版嵁鐨勬柟娉� +// }) +// } +// const submitForm = () => { +// formRef.value.validate((valid) => { +// if (valid) { +// alert('submit!'); +// } else { +// alert('Form is not valid.'); +// return false; +// } +// }); +// }; +function checkFieldsEmpty(arr) { + let filteredArr = arr.filter((item) => { + return Object.values(item).some( + (value) => value == null || value == "" || value == undefined + ); + }); + return filteredArr; +} // 鎻愪氦鑺傚亣鏃� function handleSaveHolidaysForm() { - proxy.$refs["holidaysRef"].validate((valid) => { - if (valid) { - updateCalendar({ - id: form.value.id, - // content: { - // weekdays: weekDaysSettingList.value, - // }, - holidays: formHolidays.value.map((item) => { - return { - startdate: moment(item.startdate).format("YY-MM-DD"), - enddate: moment(item.enddate).format("YY-MM-DD"), - }; - }), - // applicable: applicableSettingList.value.map((item) => { - // return { - // factory: item.factory.split(";")[0], - // process: item.process.split(";")[0], - // workshop: item.workshop.split(";")[0], - // }; - // }), - // applicableTranslate: JSON.stringify( - // applicableSettingList.value.map((item) => { - // return { - // factory: item.factory.split(";")[1], - // process: item.process.split(";")[1], - // workshop: item.workshop.split(";")[1], - // }; - // }) - //), - // applicableCn: - //}, - }).then((response) => { - proxy.$modal.msgSuccess("鏂板鎴愬姛"); - open.value = false; - getList(); - }); - } - }); + const hasValidDates = checkFieldsEmpty(formHolidays.value.holidays); + console.log(hasValidDates, "hasValidDates"); + if (hasValidDates.length == 0) { + updateCalendar({ + id: form.value.id, + holidays: formHolidays.value.holidays.map((item) => { + return { + startdate: moment(item.startdate).format("YYYY-MM-DD"), + enddate: moment(item.enddate).format("YYYY-MM-DD"), + describe: item.describe, + }; + }), + }).then((response) => { + proxy.$modal.msgSuccess("鏂板鎴愬姛"); + openSetHolidays.value = false; + getList(); + }); + } + // holidaysRef.value.validate((valid) => { + // if (!valid) { + // proxy.$modal.msgSuccess("蹇呭~椤逛笉鑳戒负绌�"); + // } + // if (valid) { + // if (!hasValidDates) { + // updateCalendar({ + // id: form.value.id, + // holidays: formHolidays.value.holidays.map((item) => { + // return { + // startdate: moment(item.startdate).format("YYYY-MM-DD"), + // enddate: moment(item.enddate).format("YYYY-MM-DD"), + // describe: item.describe, + // }; + // }), + // }).then((response) => { + // proxy.$modal.msgSuccess("鏂板鎴愬姛"); + // open.value = false; + // getList(); + // }); + // } + // }); + //if (valid) { + // if (!hasValidDates) { + // updateCalendar({ + // id: form.value.id, + // holidays: formHolidays.value.holidays.map((item) => { + // return { + // startdate: moment(item.startdate).format("YYYY-MM-DD"), + // enddate: moment(item.enddate).format("YYYY-MM-DD"), + // describe: item.describe, + // }; + // }), + // }).then((response) => { + // proxy.$modal.msgSuccess("鏂板鎴愬姛"); + // open.value = false; + // getList(); + // }); + // } + // }); } /** 鎻愪氦鎸夐挳 */ function submitForm() { @@ -937,33 +1194,45 @@ return; } if (form.value.id != null) { - // if (form.value.type === "1") { - // updateCalendar({ - // ...form.value, - // content: { - // weekdays: weekDaysSettingList.value, - // }, - // applicableWorkshop: form.value.applicableWorkshop, - // applicableProcess: form.value.applicableProcess, - // }).then((response) => { - // proxy.$modal.msgSuccess("淇敼鎴愬姛"); - // open.value = false; - // getList(); - // }); - // } else if (form.value.type === "2") { updateCalendar({ - ...form.value, + // ...form.value, + id: form.value.id, + expiringDate: form.value.expiringDate, + effectiveDate: form.value.effectiveDate, + description: form.value.description, content: { - holidays: holidays.value, + weekdays: weekDaysSettingList.value, }, - applicableWorkshop: form.value.applicableWorkshop.map((item) => { + // holidays: holidays.value, + applicable: applicableSettingList.value.map((item) => { return { - factory: item.factory.split(";")[0], - process: item.process.split(";")[0], - workshop: item.workshop.split(";")[0], + factory: item.factory + ? item.factory.indexOf(";") > 0 + ? item.factory.split(";")[0] + : item.factory + : "", + process: item.process + ? item.process.indexOf(";") > 0 + ? item.process.split(";")[0] + : item.process + : "", + workshop: item.workshop + ? item.workshop.indexOf(";") > 0 + ? item.workshop.split(";")[0] + : item.workshop + : "", }; }), - applicableProcess: form.value.applicableProcess, + applicableTranslate: JSON.stringify( + applicableSettingList.value.map((item) => { + return { + factory: item.factory ? item.factory : "", + process: item.process ? item.process : "", + workshop: item.workshop ? item.workshop : "", + }; + }) + ), + type: "1", }).then((response) => { proxy.$modal.msgSuccess("淇敼鎴愬姛"); open.value = false; @@ -971,18 +1240,6 @@ }); // } } else { - // if (form.value.type === "1") { - // addCalendar({ - // ...form.value, - // content: { - // weekdays: weekDaysSettingList.value, - // }, - // }).then((response) => { - // proxy.$modal.msgSuccess("鏂板鎴愬姛"); - // open.value = false; - // getList(); - // }); - // } else if (form.value.type === "2") { addCalendar({ ...form.value, content: { @@ -991,20 +1248,33 @@ // holidays: holidays.value, applicable: applicableSettingList.value.map((item) => { return { - factory: item.factory.split(";")[0], - process: item.process.split(";")[0], - workshop: item.workshop.split(";")[0], + factory: item.factory + ? item.factory.indexOf(";") > 0 + ? item.factory.split(";")[0] + : item.factory + : "", + process: item.process + ? item.process.indexOf(";") > 0 + ? item.process.split(";")[0] + : item.process + : "", + workshop: item.workshop + ? item.workshop.indexOf(";") > 0 + ? item.workshop.split(";")[0] + : item.workshop + : "", }; }), applicableTranslate: JSON.stringify( applicableSettingList.value.map((item) => { return { - factory: item.factory.split(";")[1], - process: item.process.split(";")[1], - workshop: item.workshop.split(";")[1], + factory: item.factory ? item.factory : "", + process: item.process ? item.process : "", + workshop: item.workshop ? item.workshop : "", }; }) ), + type: "1", // applicableCn: //}, }).then((response) => { @@ -1149,24 +1419,49 @@ } .h300 { } -.height_dialog{ +.height_dialog { height: 400px; overflow: hidden; - .height_dialog_scroll{ + .height_dialog_scroll { height: 100%; overflow: auto; } +} +.dis_error_wrap { + .error_text { + margin-left: 20px; + font-size: 12px; + color: #f56c6c; + margin-left: 120px; + } +} +.error_require { + color: #f56c6c; + margin-right: 5px; } .grey_bg { background: #f1f1f1; width: 100%; padding: 10px; box-sizing: border-box; + .flex_holidays_set { + display: flex; + justify-content: flex-start; + align-items: center; + } .flex_item { display: flex; justify-content: flex-start; align-items: center; margin-top: 10px; + .flex_item_title { + width: 85px; + color: #606266; + font-size: 14px; + font-weight: 600; + margin-left: 20px; + margin-right: 10px; + } .flex_item_dis { display: flex; flex-direction: column; -- Gitblit v1.9.3