工资单模板编辑新增页面样式调整

This commit is contained in:
黎永顺 2023-02-07 15:46:15 +08:00
parent 9452bd9d64
commit 93ea26dfac
2 changed files with 84 additions and 61 deletions

View File

@ -23,6 +23,26 @@
}
.showSettingForm {
.themeSetting {
border: 1px solid #e5e5e5;
border-bottom: none;
& > div {
padding: 5px 16px;
border-bottom: 1px solid #e5e5e5;
.wea-form-item-wrapper {
display: flex !important;
align-items: center;
justify-content: space-between;
.wea-input-normal {
flex: 1;
padding-right: 8px;
}
}
}
}
.settingItemWrapper {
.itemTitle {
@ -197,8 +217,9 @@
}
}
}
.salaryItemModalWrapper{
.modalContent{
.salaryItemModalWrapper {
.modalContent {
padding: 16px;
}
}

View File

@ -56,16 +56,17 @@ export default class ShowSettingForm extends React.Component {
} = { ...salaryTemplateShowSet, ...JSON.parse(salaryTemplateShowSetStorage) };
return (
<div className="showSettingForm">
<WeaSearchGroup title="主题及其他设置" items={[]} needTigger showGroup center>
<WeaFormItem
label="工资单主题"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<WeaInput style={{ width: "200px" }} viewAttr={3} value={theme} onChange={(value) => {
this.handleChange({ theme: value });
}}/>
<span style={{ float: "right" }}>
<WeaSearchGroup title="主题及其他设置" items={[]} needTigger showGroup>
<div className="themeSetting">
<WeaFormItem
label="工资单主题"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<WeaInput style={{ width: "200px" }} viewAttr={3} value={theme} onChange={(value) => {
this.handleChange({ theme: value });
}}/>
<span style={{ float: "right" }}>
<span>插入变量</span>
<a onClick={() => {
this.handleThemeNameCllck("${companyName}");
@ -74,55 +75,56 @@ export default class ShowSettingForm extends React.Component {
this.handleThemeNameCllck("${salaryMonth}");
}} className="themeFormalStr">薪资所属月</a>
</span>
</WeaFormItem>
<WeaFormItem
label="工资单背景"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<BackgroundUpload imageUrl={background} onChange={(value) => {
this.handleChange({ background: value });
}}/>
</WeaFormItem>
<WeaFormItem
label="文本内容"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<WeaInput value={textContent} onChange={(value) => {
this.handleChange({ textContent: value });
}}/>
</WeaFormItem>
<WeaFormItem
label="文本内容位置"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<Radio.Group value={textContentPosition} onChange={(e) => {
this.handleChange({ textContentPosition: e.target.value });
}}>
<Radio value={"1"}>薪资项目前</Radio>
<Radio value={"2"}>薪资项目后</Radio>
</Radio.Group>
</WeaFormItem>
<WeaFormItem
label="薪资项为空时不显示"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<Switch checked={salaryItemNullStatus} onChange={(value) => {
this.handleChange({ salaryItemNullStatus: value });
}}/>
</WeaFormItem>
<WeaFormItem
label="薪资项为0时不显示"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<Switch checked={salaryItemZeroStatus} onChange={(value) => {
this.handleChange({ salaryItemZeroStatus: value });
}}/>
</WeaFormItem>
</WeaFormItem>
<WeaFormItem
label="工资单背景"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<BackgroundUpload imageUrl={background} onChange={(value) => {
this.handleChange({ background: value });
}}/>
</WeaFormItem>
<WeaFormItem
label="文本内容"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<WeaInput value={textContent} onChange={(value) => {
this.handleChange({ textContent: value });
}}/>
</WeaFormItem>
<WeaFormItem
label="文本内容位置"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<Radio.Group value={textContentPosition} onChange={(e) => {
this.handleChange({ textContentPosition: e.target.value });
}}>
<Radio value={"1"}>薪资项目前</Radio>
<Radio value={"2"}>薪资项目后</Radio>
</Radio.Group>
</WeaFormItem>
<WeaFormItem
label="薪资项为空时不显示"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<Switch checked={salaryItemNullStatus} onChange={(value) => {
this.handleChange({ salaryItemNullStatus: value });
}}/>
</WeaFormItem>
<WeaFormItem
label="薪资项为0时不显示"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<Switch checked={salaryItemZeroStatus} onChange={(value) => {
this.handleChange({ salaryItemZeroStatus: value });
}}/>
</WeaFormItem>
</div>
</WeaSearchGroup>
<WeaSearchGroup